javascript 7种继承-- JavaScript 中的 [[Prototype]] 与 __proto__ 与 .prototype 为什么 JavaScript 中有这么多类型的原型？

前言

为什么 JavaScript 中有这么多类型的原型？它们都有什么作用？
当您开始学习 JavaScript 中的原型时，这似乎非常令人畏惧。很多混乱源于这样一个事实：JavaScript 中有两种不同的原型，它们引用了不同的概念。让我解释。

---

javascript 7种继承 文章序列

由于避免篇幅过长导致阅读疲倦等原因，这边进行内容拆解，并且添加了导航。

	文章名
1	new操作符的原理以及实现
2	[[Prototype]] 与 proto 与 .prototype
3	1. 原型链继承分析
4	2. 构造函数继承分析
5	3. 组合式继承分析
6	4. 原型式继承分析
7	5. 寄生式继承分析
8	6. 寄生组合式继承
9	7. class继承

---

[[Prototype]]

[[Prototype]]是 Javascript 中所有对象都具有的隐藏私有属性，它保存对对象原型的引用。

对象的原型是对象继承或派生的对象。在下图中，对象son源自father，son的原型是father。这意味着 的隐藏[[Prototype]]属性son指向father。

总结一下：

• [[Prototype]]是引用对象原型的隐藏属性。
• 对象的原型是对象派生或继承的对象。

---

__proto__

__proto__（也称为 Dunder Proto 或双下划线原型）是一个属性Object.prototype（稍后会详细介绍），它公开[[Prototype]]对象的隐藏属性并允许您访问或修改它。您不应该使用它，因为它已被弃用，尽管您可能会在旧代码中遇到它。

访问对象原型的现代方法是使用Object.getPrototypeOf(obj). **Object.setPrototypeOf(obj, prototype)**您还可以使用以下示例中所示的方法来修改对象的原型：

总结一下：

• __proto__是一种公开隐藏[[Prototype]]属性并允许您修改它的方法。
• Object.getPrototypeOf()和Object.setPrototypeOf()是访问和设置对象原型的现代方法。

---

prototype

.prototype是几乎所有函数都具有的特殊属性，仅在函数作为构造函数调用时使用。我说几乎全部是因为使用简洁语法定义的箭头函数和方法没有.prototype属性，不能用作构造函数。

该*.prototype属性包含对对象的引用，当使用构造函数实例化或创建新对象时，该属性.prototype*被设置为新对象的原型。

构造函数就像一个对象工厂，它创建作为其自身实例的新对象。“什么是构造函数？”

例如，当构造函数ObjectFactory用于实例化由obj以下代码块第 5 行的变量引用的新对象时，obj的隐藏内部**[[Prototype]]属性现在保存对由 引用的同一对象的引用ObjectFactory.prototype**。这意味着定义的任何属性或方法都ObjectFactory.prototype可以通过obj.

在第 7 行，我们证明ObjectFactory.prototype引用了一个对象。在第 8 行我们证明这ObjectFactory.prototype是 的原型obj。

访问原型的属性

prop请注意，在第 10 行，我们添加了一个名为所引用的对象的属性ObjectFactory.prototype。请记住，obj的[[Prototype]]属性引用与以下相同的对象ObjectFactory.prototype.

我们可以在第 12 行看到它obj没有名为 的属性prop，它只有一个名为 的属性property。但是，obj可以在第 13 行访问prop，因为它继承了其原型的属性，我们知道该原型是 引用的对象ObjectFactory.prototype。

总结

• .prototype是所有函数都具有的特殊属性，其中包含对对象的引用。
• 当构造函数用来实例化一个新对象时，ConstructorName.prototype被设置为新对象的原型。
• 该构造函数的所有实例（它创建的对象）都可以访问 的属性ConstructorName.prototype。

---

我Object.prototype在文章前面简单提到过，Object JavaScript 中几乎所有对象都是内置构造函数的实例，因此几乎所有对象都继承自其.prototype属性引用的对象Object.prototype。