属性访问器
属性访问器通过使用点表示法或方括号表示法来访问对象的属性。
试一试
const person1 = {};
person1["firstName"] = "Mario";
person1["lastName"] = "Rossi";
console.log(person1.firstName);
// Expected output: "Mario"
const person2 = {
firstName: "John",
lastName: "Doe",
};
console.log(person2["lastName"]);
// Expected output: "Doe"
语法
object.propertyName
object[expression]
object.#privateProperty
描述
可以将对象看作一个关联数组（又称映射、字典、哈希、查找表）。该数组中的键是对象属性的名称。
有两种访问属性的方法：点表示法和方括号表示法。
点表示法
在 object.propertyName 语法中，propertyName 必须是有效的 JavaScript 标识符，也可以是保留字。例如，object.$1 是有效的，而 object.1 则不是。
const variable = object.propertyName;
object.propertyName = value;
const object = {};
object.$1 = "foo";
console.log(object.$1); // 'foo'
const object = {};
object.1 = "bar"; // SyntaxError
console.log(object.1); // SyntaxError
这里，名为 createElement 的方法从 document 中检索并被调用。
document.createElement("pre");
如果你将方法用于数字字面量，且数字字面量没有指数和小数点，你应该在方法调用前的点之前留下空格，这样点就不会被解释为小数点。
77 .toExponential();
// or
77
.toExponential();
// or
(77).toExponential();
// or
77..toExponential();
// or
77.0.toExponential();
// because 77. === 77.0, no ambiguity
此外，私有元素只能在其定义的类中使用点表示法访问。
方括号表示法
在 object[expression] 语法中，expression 应该求值为一个字符串或Symbol，表示属性的名称。因此，它可以是任何字符串字面量，例如，包括 '1foo'、'!bar!'，甚至 ' '（一个空格）。
const variable = object[propertyName];
object[propertyName] = value;
这与上一个示例的作用完全相同。
document["createElement"]("pre");
方括号表示法前允许有空格。
document ["createElement"]("pre");
传递求值为属性名称的表达式与直接传递属性名称的作用相同。
const key = "name";
const getKey = () => "name";
const Obj = { name: "Michel" };
Obj["name"]; // returns "Michel"
Obj[key]; // evaluates to Obj["name"], and returns "Michel"
Obj[getKey()]; // evaluates to Obj["name"], and returns "Michel"
但是，请注意，使用方括号访问名称由外部输入提供的属性可能会使你的代码容易受到对象注入攻击。
属性名称
每个属性名称都是一个字符串或一个Symbol。任何其他值（包括数字）都会被强制转换为字符串。这将输出 'value'，因为 1 被强制转换为 '1'。
const object = {};
object["1"] = "value";
console.log(object[1]);
这也输出 'value'，因为 foo 和 bar 都被转换为相同的字符串（"[object Object]"）。
const foo = { uniqueProp: 1 };
const bar = { uniqueProp: 2 };
const object = {};
object[foo] = "value";
console.log(object[bar]);
方法绑定
在谈论对象的属性时，通常会区分属性和方法。然而，属性/方法的区别不过是一种约定。方法是可以调用的属性（例如，如果它的值是对一个Function实例的引用）。
方法不绑定到它所属的对象。具体来说，this 在方法中不是固定的，并不一定指包含该方法的对象。相反，this 是通过函数调用“传递”的。请参阅this 的参考。
示例
方括号表示法与 eval()
JavaScript 初学者经常犯一个错误，在可以使用方括号表示法的地方使用eval()。
例如，以下语法在许多脚本中很常见。
const x = eval(`document.forms.form_name.elements.${strFormControl}.value`);
eval() 速度慢，应尽可能避免。此外，strFormControl 必须保存一个标识符，而表单控件的名称和 id 不需要这样做。最好使用方括号表示法代替。
const x = document.forms.form_name.elements[strFormControl].value;
规范
| 规范 |
|---|
| ECMAScript® 2026 语言规范 # sec-property-accessors |
浏览器兼容性
加载中…