讲解了 __proto__, [[prototype]] 和 prototype 三者的关系, 并用 js 实现了一个 __proto__
__proto__ 是一个访问器属性, 用于访问对象的原型 [[prototype]] (见以下模拟的 getter 和 setter 方法, 不一定完全与规范一致, 仅供参考)
get Object.prototype.__proto__
set Object.prototype.__proto__
通过它可以访问到对象的 [[prototype]], 也即对象的原型
[[prototype]] 的值是该对象的原型或 null (对于 Object.prototype 对象而言, 其没有原型, 返回null: Object.prototype.__proto__; // null)
举个例子 (一定要举起来啊!):
综上, [[prototype]] 表示了一个实例的原型 (prototype 属性的值表示了其实例的原型对象), 对象与对象之间通过 [[prototype]] 关联了起来, 形成了一个链式结构 --- 原型链. 如果没把例子举起来, 是我不会讲故事, 请点这里)看图理解.
虽然所有现代浏览器都实现了该访问器属性, ES6 (ECMA2015) 及之后的标准也暂时包含了它, 但是它的存在只是为了确保规范与浏览器兼容
推荐使用 Object.getPrototypeOf() 方法代替 Object.prototype.__proto__
操作 [[prototype]] 属性 (只要该属性变更了), 各个浏览器引擎针对 prototype 相关的优化(缓存)会失效, 这就导致访问原型上的属性很慢
虽然原型只是对象，但它们由 JavaScript 引擎专门处理，以优化在原型上查找方法的性能表现。把你的原型放在一旁！或者，如果你确实需要修改原型，请在其他代码运行之前执行此操作，这样至少不会让引擎所做的优化付诸东流。
原型链上没有 Object.prototype 对象的对象, 均不能访问比如使用 Object.create(null) 创建的对象或我们变更了其原型的对象 obj.__proto__ = null, 该类对象不能访问 Object.prototype.__proto__ (但我们可以通过 Object.getPrototypeOf(obj) 访问其原型: Object.getPrototypeOf(Object.create(null)); // null)
没有原型的原始值一般来说, null, undefined, number, string, boolean, symbol, bigint 这些基本数据类型的 (原始) 值没有原型 (Object.getPrototypeOf(null); // TypeError: Cannot convert undefined or null to object, 原始值不可能有原型), 所以其无法访问到 Object.prototype.__proto__. 但鉴于除了 null, undefined 以外的基本数据类型值在运算时会自动装箱 autoboxing 为对应的包装对象, 所以只有 null 和 undefined 不能访问到Object.prototype.__proto__
众所周知, Object.prototype.__proto__ 的值是 null, 通常来说也是一个对象的原型链终点, 它表示了 Object.prototype 对象没有原型. 附一张图 (图片来源于这里):
这张图说明了 JavaScript 的继承 (委托): new Foobar --- __proto__ ---> Foobar.prototype --- __proto__ ---> Object.prototype --- __proto__ ---> null.
(用《你不知道的JavaScript》里的话来说: 继承意味着复制操作，然而 JavaScript 默认并不会复制对象的属性，相反，JavaScript 只是在两个对象之间创建一个关联，这样，一个对象就可以通过委托访问另一个对象的属性和函数，所以与其叫继承，委托的说法反而更准确些.)