JavaScript对象创建和属性访问无唯一正确方式，需据场景选择：字面量适合临时数据，class适合多实例复用，方括号用于动态/非法标识符属性名，Object.defineProperty和Proxy用于访问控制而非常规创建。
JavaScript 对象创建和属性访问没有唯一“正确”方式，关键看你要什么：是临时存点数据、要复用逻辑、还是需要实例隔离。选错方式会导致后期改起来费劲，甚至出现 undefined 或 this 指向错误。
对象字面量适合快速建单个对象
这是最常用也最安全的起点，适用于配置项、返回值、临时容器等场景。所有属性和方法都直接写在花括号里，不涉及原型或构造上下文。
常见错误是误以为字面量里的函数能自动访问同级属性——其实不能，this 指向取决于调用方式，不是定义位置：
const user = {
name: 'Alice',
getName() {
return this.name; // ✅ 正确：方法被 user.getName() 调用时 this 指向 user
},
getBadName: function() {
return name; // ❌ 报错：name 是未声明变量，不是 this.name
}
};
要点：
立即学习“Java免费学习笔记（深入）”；
- 属性名带空格或特殊字符必须加引号：
{"full-name": "Bob"} - 属性名是变量？用计算属性名：
{[key]: value} - 想继承已有对象？用
Object.assign()或展开运算符{...obj}，别直接改__proto__
用 class 创建多个结构一致的对象
当你需要生成一堆相似对象（比如用户、订单、DOM 封装器），class 比反复写字面量更可控，也能自然支持私有字段（#field）和继承。
注意：class 声明不会被提升，且必须用 new 调用；否则报 Class constructor User cannot be invoked without 'new'。
示例：
class User {
#id; // 私有字段
constructor(name, id) {
this.name = name;
this.#id = id;
}
getId() {
return this.#id; // ✅ 只能在类内部访问 #id
}
}
const u1 = new User('Charlie', 101);
关键区别：
-
class内部方法默认不可枚举（for...in遍历时看不到） - 静态方法用
static关键字，挂载在类本身而非实例上：User.count() - 不要在 class 中给实例直接赋值函数（如
this.handler = () => {}），会破坏原型链复用性
方括号 vs 点号：什么时候必须用 []？
点号（.name）简洁，但只接受合法标识符；只要属性名含空格、短横线、变量、或运行时才确定，就必须用方括号语法。
典型踩坑：
-
obj.user-name→ 报错（减法运算）→ 改成obj["user-name"] -
obj.123→ 报错（数字开头）→ 改成obj["123"] - 动态拼接属性名：
obj[`data_${type}`]，不能写成obj.data_${type} - 访问嵌套属性时，点号链式调用一旦中间为
undefined就崩：user.profile.address.city→ 若profile不存在，直接报Cannot read property 'address' of undefined；可用可选链user?.profile?.address?.city
Object.defineProperty 和 Proxy 的真实用途
这两个不是“创建对象”的常规手段，而是用于控制访问行为——比如做响应式系统、日志追踪、权限拦截。滥用反而让代码难读难调试。
Object.defineProperty 适合单个属性的精细控制（如只读、不可枚举），但无法监听新增/删除属性；Proxy 能代理整个对象，支持 get/set/has/deleteProperty 等多种 trap，但 IE 完全不支持。
简单示例（拦截赋值）：
const obj = {};
const proxied = new Proxy(obj, {
set(target, key, value) {
console.log(`设置 ${key} = ${value}`);
target[key] = value;
return true;
}
});
proxied.count = 5; // 控制台输出日志
提醒：Proxy 返回的是新对象，原对象不受影响；且它对数组索引操作（如 arr[0] = x）同样生效，这点常被忽略。
