你不知道的原型和原型链

🌈 好久好久没更新博客啦，最近在复习原型这一块的时候，有一些新的认识，话不多说，直接上! 💪

__proto__和 prototype 关系

• __proto__ 和 constructor 是对象独有的。
• prototype 属性是函数独有的。

在 js 中我们是使用构造函数来新建一个对象的，每一个构造函数的内部都有一个 prototype 属性，这个属性的值是一个对象，这个对象包含了可以由该构造函数的所有实例共享的属性和方法。当我们使用构造函数新建一个对象后，在这个对象的内部将包含一个指针，这个指针指向构造函数的 prototype 属性对应的值，在 ES5 中这个指针被称为对象的原型。一般来说我们是不应该能够获取到这个值的，但是现在浏览器中都实现了proto 属性来让我们访问这个属性，但是我们最好不要使用这个属性，因为它不是规范中规定的。ES5 中新增了一个 Object.getPrototypeOf() 方法，我们可以通过这个方法来获取对象的原型。

原型链初探

当我们访问一个对象的属性时，如果这个对象内部不存在这个属性，那么它就会去它的原型对象里找这个属性，这个原型对象又会有自己的原型，如果原型对象是另一个构造函数的实例，那么它就这样一直找下去，这样形成的一条链，就叫做原型链。原型链的尽头一般来说都是 Object.prototype 所以这就是我们新建的对象为什么能够使用 toString() 等方法的原因。

• 特点：JavaScript 对象是通过引用来传递的，我们创建的每个新对象实体中并没有一份属于自己的原型副本。当我们修改原型时，与 之相关的对象也会继承这一改变

prototype 、构造函数、实例

1. 原型(prototype): 一个简单的对象，用于实现对象的 属性继承。可以简单的理解成对象的“爹”。每个JavaScript对象中都包含一个 __proto__ (非标准)的属性指向它爹(该对象的原型)，可通过 obj.__proto__ 进行访问。
2. 构造函数: 可以通过 new 来新建一个对象 的函数。
3. 实例: 通过构造函数和new创建出来的对象，便是实例。 实例通过 __proto__ 指向原型，通过 constructor 指向构造函数。
   以Object为例，我们常用的Object便是一个构造函数，因此我们可以通过它构建实例。

// 实例
const instance = new Object()
则此时， 实例为instance, 构造函数为Object，我们知道，构造函数拥有一个prototype的属性指向原型，因此原型为:Object.prototype

// 原型
const prototype = Object.prototype
这里我们可以来看出三者的关系:

实例.__proto__ === 原型
原型.constructor === 构造函数
构造函数.prototype === 原型
// 这条线其实是是基于原型进行获取的，可以理解成一条基于原型的映射线
// 例如: 
// const o = new Object()
// o.constructor === Object   --> true
// o.__proto__ = null;
// o.constructor === Object   --> false
实例.constructor === 构造函数

⭐️ 可以参考下图：

原型链

原型链是由原型对象组成，每个对象都有 __proto__ 属性，指向了创建该对象的构造函数的原型，__proto__ 将对象连接起来组成了原型链。是一个用来实现 继承 和 共享 属性的有限的对象链

⭐️ 原型链属性的查找和修改

1. 属性查找机制: 当查找对象的属性时，如果实例对象自身不存在该属性，则沿着原型链往上一级查找，找到时则输出，不存在时，则继续沿着原型链往上一级查找，直至最顶级的原型对象Object.prototype，如还是没找到，则输出undefined；
2. 属性修改机制: 只会修改实例对象本身的属性，如果不存在，则进行添加该属性，如果需要修改原型的属性时，则可以用: b.prototype.x = 2；但是这样会造成所有继承于该对象的实例的属性发生改变。

⭐️ js 获取原型的方法

• p.__proto__
• p.constructor.prototype
• Object.getPrototypeOf(p)

总结

• 每个函数都有 prototype 属性，该属性指向原型。
• 每个对象都有 __proto__ 属性，指向了创建该对象的构造函数的原型。其实这个属性指向了 [[prototype]]，但是 [[prototype]]是内部属性，我们并不能访问到，所以使用 __proto__来访问。
• 对象可以通过 __proto__ 来寻找不属于该对象的属性，__proto__ 将对象连接起来组成了原型链。