JavaScript对象：通过名称作为字符串（复制）访问变量属性

在JavaScript中，对象是一种非常有用的数据结构。对象由键值对组成，其中每个键都是一个字符串（也称为属性名），每个值可以是另一个对象、数组、函数或基本类型的数据。使用点符号或方括号语法，可以访问对象属性并操作对象。

但是，有时候我们可能需要动态地访问对象的属性，即根据变量的值来引用属性名称。这就是通过名称作为字符串（复制）访问变量属性的概念。

方括号语法

在JavaScript中，可以使用方括号语法来访问对象的属性。方括号内可以是任何表达式，包括字符串变量。

const person = { name: 'Alice', age: 30 };
const propertyName = 'name';

console.log(person[propertyName]); // 输出 "Alice"

在上面的例子中，person[propertyName]会根据propertyName变量的值'name'访问person对象的name属性，并输出它的值'Alice'。

动态创建属性

如果对象中不存在一个属性，可以在运行时使用相同的方括号表示法动态创建它。

const person = {};

person['name'] = 'Alice';

console.log(person.name); // 输出 "Alice"

在这个例子中，person['name']会动态地创建一个新的name属性，并将其值设置为'Alice'。此后，就可以使用点语法访问该属性了。

函数参数

通过名称作为字符串（复制）访问变量属性在函数中尤其有用。例如，如果要编写一个通用函数来获取对象属性的值，则可以传递属性名称作为字符串参数，并使用方括号语法来访问它。

function getProperty(obj, propName) {
  return obj[propName];
}

const person = { name: 'Alice', age: 30 };

console.log(getProperty(person, 'name')); // 输出 "Alice"

在这个例子中，getProperty函数使用方括号语法动态地访问obj对象的propName属性，并返回它的值。

遍历属性

还可以通过名称作为字符串遍历对象的所有属性。例如，可以使用for...in循环遍历对象的所有键（属性名）。

const person = { name: 'Alice', age: 30 };

for(let key in person) {
  console.log(key + ': ' + person[key]);
}
// 输出:
// name: Alice
// age: 30

在上面的代码中，for...in循环遍历person对象的所有键（属性名），并输出每个属性的名称和值。

总结

通过名称作为字符串（复制）访问变量属性是一种非常灵活和强大的技术，在JavaScript中经常使用。无论是动态创建属性、编写通用函数，还是遍历对象的属性，都可以使用方括号语法和字符串变量来访问和操作对象。

来源：JavaScript中文网 ，转载请注明来源 https://www.javascriptcn.com/post/8624