1. 点号访问属性的基础用法
1.1 点号访问的定义与语法
在 JavaScript 中，点号访问（使用“对象.属性”的形式）是最常见的对象属性访问方式之一。对于位于对象中的固定属性，语法简单直观，属性名必须是一个合法标识符，且通常不需要引号。通过这种写法，可以获得更高的可读性与简洁性。
例如：点号访问可以直接读取名字，写法简单、语义清晰，适用于属性名为 合法标识符 的场景。
const user = { name: 'Alice', age: 28 };1.2 点号访问的限制与常见错误
当属性名包含 空格、连字符、或以数字开头时，点号访问就不可用，必须改用方括号访问来实现。这些情况涉及到非法标识符的问题，易导致语法错误或逻辑混乱。
例如，当属性名是 'first-name' 时，不能使用 点号访问，应改用 方括号访问：
const data = { 'first-name': 'Lee', '2nd': true, 'class': 'A' };
// 点号访问在此情景下不可用或会产生错误
// data.first-name; // 语法错误或被解析为 data.first - name
console.log(data['first-name']); // Lee2. 方括号访问属性的灵活性
2.1 动态属性名的获取
相比点号访问，方括号访问允许通过变量名或表达式来取得属性值。这使得在运行时处理动态属性名成为可能，是点号访问的有力补充。
通过 动态属性名，可以把用户输入、接口字段或计算结果映射到对象属性上，从而实现更灵活的数据访问。
const obj = { name: 'Ada', age: 36 };
const key = 'name';
console.log(obj[key]); // Ada2.2 属性名包含特殊字符或数字开头
当属性名包含 空格、连字符，或以数字开头时，只有通过方括号访问才能正确访问，点号访问将失效或产生错误。这种写法也方便在动态场景下增加新属性。
举例说明：'first-name' 与 '1st' 都应使用 方括号访问。
const obj = { 'first-name': 'Ada', '1st': true };
console.log(obj['first-name']); // Ada
console.log(obj['1st']); // true同样地，使用方括号访问还能在运行时为对象添加新属性，例如：动态键的场景。
const obj = {};
const dynamicKey = 'new-key';
obj[dynamicKey] = 123;
console.log(obj[dynamicKey]); // 1233. 点号与方括号的混合使用场景
3.1 实战场景：先写固定键，再处理动态键
在实际开发中，很多对象包含若干个固定属性，同时又需要通过动态键来访问或修改其他字段。这时，点号访问提供了良好的可读性，而方括号访问则负责处理运行时的动态键，二者结合能够覆盖大多数场景。
通过组合使用，可以实现对对象的强大访问能力，更好地适应数据结构的多变性与接口的灵活性。
const user = { id: 101, name: 'Zhang' };
function getValue(obj, key) {return obj[key];
}
console.log(user.name); // Zhang
console.log(getValue(user, 'id')); // 1013.2 兼容性与存在性检查
在需要进行存在性检查时，结合 in 操作符或可选链（Optional Chaining）可以实现更健壮的代码。方括号访问与这些适配手段一起使用，能处理动态键的同时避免运行时错误。
另外，使用 obj?.[key] 的写法，可以在属性不存在时返回 undefined，减少显式的判断逻辑。
const obj = { name: 'Nina' };
if ('name' in obj) {console.log(obj.name); // Nina
}
const key = 'name';
console.log(obj?.[key]); // Nina