JavaScript对象创建与访问详解

本篇文章给大家分享《JavaScript对象创建与访问方法解析》，覆盖了文章的常见基础知识，其实一个语言的全部知识点一篇文章是不可能说完的，但希望通过这些问题，让读者对自己的掌握程度有一定的认识(B 数)，从而弥补自己的不足，更好的掌握它。

JavaScript对象创建有三种方式：{}字面量等价于new Object()，原型指向Object.prototype；new Foo()使实例__proto__指向Foo.prototype；Object.create(proto)可直接指定原型，如Object.create(null)生成无原型的纯净对象。

对象创建的三种常见方式及其本质区别

JavaScript 中所有对象都源自 Object.prototype，但创建方式直接影响原型链起点和可扩展性。

• 字面量 {}：最常用，等价于 new Object()，原型指向 Object.prototype
• 构造函数 new Foo()：实例的 __proto__ 指向 Foo.prototype，而 Foo.prototype.__proto__ 仍为 Object.prototype
• Object.create(proto)：直接指定原型，比如 Object.create(null) 会跳过 Object.prototype，得到“纯净”空对象（无 toString 等方法）

注意：class 语法只是语法糖，底层仍是基于原型的构造函数，class A extends B 会自动设置 A.prototype.__proto__ === B.prototype。

访问属性时 [[Get]] 的完整查找路径

当你写 obj.x，引擎不会只查 obj 自身，而是按规范执行 [[Get]] 操作：

• 先检查 obj 自身是否有 x（自有属性，Object.hasOwn(obj, 'x') 可检测）
• 没有则沿 obj.__proto__ 向上查找，直到 null
• 若找到，返回值；若到顶都没找到，返回 undefined

关键点：访问过程不触发 setter，也不进入 getter（除非是 accessor 属性），且 for...in 和 Object.keys() 行为不同——前者遍历**可枚举的自身 + 原型链属性**，后者只返回**自身可枚举属性**。

为什么修改 prototype 会影响所有实例，但重赋值 constructor 不影响？

因为实例的 __proto__ 在创建时就固定指向其构造函数的 prototype 对象，后续对 Foo.prototype 的增删改都会实时反映在实例上：

function Person(name) { this.name = name; }
Person.prototype.say = function() { return 'Hi'; };
const p = new Person('Alice');
console.log(p.say()); // 'Hi'

Person.prototype.say = function() { return 'Hello'; };
console.log(p.say()); // 'Hello' —— 已更新

但如果你写 Person.prototype = { speak() {} }，相当于把原来那个被实例引用的原型对象替换成新对象，旧实例的 __proto__ 仍指向老对象，不会自动切换。此时必须手动修复 constructor（如 Person.prototype.constructor = Person），否则 p.constructor 会变成 Object。

继承中容易忽略的两个细节

实现继承时，仅设置 Child.prototype = Object.create(Parent.prototype) 是不够的：

• 忘记调用父类构造函数 → 子类实例缺少父类初始化的自有属性（如 this.name）
• 没绑定 this → 在子类构造函数里用 Parent.call(this, ...) 才能确保父类逻辑作用于当前实例

现代写法推荐用 extends + super()，它自动处理原型链和 this 绑定；但若手写，必须同时做两件事：原型链连接 + 构造函数调用。漏掉任一环节，继承就是“形似而神不至”。

文中关于的知识介绍，希望对你的学习有所帮助！若是受益匪浅，那就动动鼠标收藏这篇《JavaScript对象创建与访问详解》文章吧，也可关注golang学习网公众号了解相关技术文章。