对象字面量{}是最常用安全的创建方式,适合静态结构;避免new Object();属性访问用点号或方括号,后者支持变量和特殊字符;方法调用需注意this绑定问题。

对象字面量是最常用也最安全的创建方式
直接用 {} 创建对象,适合静态结构、一次性初始化的场景。它避免了构造函数可能带来的原型污染或 this 绑定问题。
常见错误:把对象字面量写成带括号的表达式,比如 ({name: "a"}) 在某些上下文中会被误解析为代码块——除非明确需要立即执行,否则去掉括号更稳妥。
示例:
const user = {
name: "Alice",
age: 30,
greet() {
return `Hello, ${this.name}`;
}
};
- 属性名含空格或特殊字符时,必须加引号:
{"full name": "Bob"} - 方法可省略
function关键字,用简写语法greet() { ... } - 计算属性名需用方括号:
[keyName]: value
用 new Object() 创建对象容易引发误解
虽然语法合法,但几乎不推荐。它和字面量功能一致,却多写 5 个字符,还容易让人误以为有“类实例化”的语义——实际上 new Object() 和 {} 完全等价,且都继承自 Object.prototype。
立即学习“Java免费学习笔记(深入)”;
真正要用 new 的是自定义构造函数或内置类(如 Date、RegExp),而不是普通对象。
- 不要写
const obj = new Object({x: 1})—— 这会把参数当作值传入,不是你想要的对象初始化 - 如果真要动态构造,优先考虑
Object.assign()或展开运算符{...obj1, ...obj2}
访问属性:点号 vs 方括号,区别不止是语法
. 只能访问合法标识符属性名;[] 支持任意字符串、变量、表达式,包括运行时计算的 key。
典型陷阱:user.first name 会报错,因为空格不是合法标识符;而 user["first name"] 正确。
- 当属性名来自变量时,必须用方括号:
const key = "age"; user[key] - 嵌套访问时,点号链式调用一旦中间为
undefined就报Cannot read property X of undefined;可用可选链user?.profile?.avatar避免崩溃 -
in操作符检查属性是否存在(含原型链),hasOwnProperty()只查自身
调用方法时,this 的指向取决于调用方式,不是定义位置
这是最容易出 bug 的地方。函数作为方法被调用(obj.method())时,this 指向 obj;但如果把它赋值给变量再调用(const fn = obj.method; fn()),this 就变成 undefined(严格模式)或全局对象(非严格)。
- 解决方案之一:在对象内用箭头函数定义方法(但注意箭头函数不能作为构造器,且不绑定
this,所以只适用于不依赖this的场景) - 更通用的做法:用
.bind()、call()或在调用处显式绑定:obj.method.call(obj) - 现代写法倾向用 class + # 私有字段 + 箭头方法绑定,或用
useCallback(React)等工具封装
实际项目里,对象结构常来自 API 响应或配置文件,属性名不可控,这时候方括号访问和可选链就成了刚需;而 this 问题在事件回调、定时器、异步操作中高频出现,光靠记忆规则不如一开始就用显式绑定或箭头函数收口。











