在前端开发中，我们经常需要使用对象来存储和操作数据。有时候我们需要根据变量的值来访问对象中的属性，这就需要使用动态属性访问。
什么是动态属性访问？
动态属性访问是指使用变量来访问对象的属性，而不是直接使用属性名。这种方式允许我们在运行时根据变量的值来获取或设置对象的属性，使代码更加灵活和可复用。
例如，假设我们有一个包含用户信息的对象：
const user = {
id: 1,
name: 'Alice',
age: 25,
};如果我们想获取用户姓名，可以直接使用 user.name 来访问。但是如果我们的代码需要动态决定要获取哪个属性，比如从用户输入中读取属性名，那么就需要使用动态属性访问。
如何使用动态属性访问？
使用动态属性访问很简单，只需要使用方括号 [] 来表示属性名是一个变量，而不是字面量。
例如，要根据变量 propertyName 获取用户的属性，可以这样写：
const propertyName = 'name'; const value = user[propertyName]; console.log(value); // 输出 "Alice"
这里将变量 propertyName 包裹在方括号中，JavaScript 就会把它的值作为属性名来获取相应的属性值。
同样地，如果我们想动态设置对象的属性值，也可以使用动态属性访问：
const propertyName = 'name'; user[propertyName] = 'Bob'; console.log(user.name); // 输出 "Bob"
这里将变量 propertyName 包裹在方括号中，JavaScript 就会把它的值作为属性名来设置相应的属性值。
注意事项
在使用动态属性访问时，需要注意一些细节。
首先，要确保属性名是一个字符串或者能够被隐式转换为字符串。如果属性名是一个数字或其他类型的值，JavaScript 会自动将其转换为字符串。
其次，要确保对象存在该属性。如果对象中不存在该属性，使用动态属性访问会返回 undefined。
最后，要避免使用未定义的变量作为属性名。这种情况下会抛出一个错误，导致程序崩溃。
示例代码
下面是一个完整的示例代码，演示了如何使用动态属性访问：
-- -------------------- ---- -------
----- ---- - -
--- --
----- --------
---- ---
--
-------- ---------------- ------------- -
-- ---------------------------------- -
------ ------------------
- ---- -
----- --- --------------- --- ------ - - --------------
-
-
----- ------------ - ----------------------
--- -
----- ----- - ----------------- --------------
-------------------
- ----- ------- -
-----------------------------
-这个代码包含了一个 getProperty 函数，它接受一个对象和一个属性名，返回对象中对应属性的值。在主函数中，我们从用户输入中读取属性名，并使用 getProperty 函数动态获取属性值。如果属性不存在，则会抛出一个错误。
来源：JavaScript中文网 ，转载请注明来源 https://www.javascriptcn.com/post/8251