放两个链接，强烈建议去读一读：

文一：JavaScript 原型精华 #一篇就够系列
文二：用本人的形式（图）了解constructor、prototype、__proto__和原型链

在文一中我理解到为什么我始终看不懂各路大神的原型图，晓得了原来要分成原型链、构造函数链两个来了解。
文二则帮我彻底了解了什么是构造函数链什么是原型链。

上面讲讲我所了解的原型链，看看我学成啥样了。如果对大家有所帮忙就再好不过了！

初识三个属性

constructor

借鉴文二的程序，先从constructor讲起吧。

这个单词在不同场景下有不同的指代含意。
作为一个名词，它能够指「构造函数」这个函数类型。
在原型链这个场景下，它作为对象的一个属性名呈现。

构造函数 constructor

construtor谷歌翻译为构造函数，所以会在有些场景中，他就指构造函数。

在ES6标准中，是这么形容constructor的：

4.3.4 constructor

function object that creates and initializes objects

翻译：创立和初始化对象的函数对象

在这个语境中，construtor指的就是构造函数。

对象的属性 constructor

同时constructor也是对象的属性。

置信咱们想晓得的也不是构造函数相干的，更多想要理清作为对象属性的constructor是什么。

对象的属性？

比如说一个函数对象fun，咱们能在他的属性外面发现起码三个跟constructor相干的属性：

let Fun = function(){this.a = 'a'}Fun.constructor // ƒ Function() { [native code] }Fun.__proto__.constructor // ƒ Function() { [native code] }Fun.prototype.constructor // ƒ ƒ (){this.a = 'a'}let afun = new Funafun.constructor // ƒ (){this.a = 'a'}afun.__proto__.constructor // ƒ (){this.a = 'a'}

不用晓得他们是做什么的，不用晓得为什么输入这些，也不用晓得__proto__和prototype是什么，前面都会讲的，当初理解constructor会在这三种中央呈现即可。

constructor是做什么的呢？

从他的直译上也可见，该属性与构造函数相干，
用constructor作为对象的属性名，用处则是指向该对象的构造函数
所以fun.constructor指向的就是fun的构造函数：JS内置对象Function：ƒ Function() { [native code] }

prototype

咱们看标准中对prototype的定义（看不懂没关系，前面细讲）：

4.3.5 prototype

object that provides shared properties for other objects

NOTE When a constructor creates an object, that object implicitly references the constructor’s prototype property for the purpose of resolving property references.

翻译：为其余对象提供共享属性的对象
留神：当构造函数创立一个对象的时候，这个对象会隐式援用这个构造函数的prototype属性中的属性，以便于解析属性的援用

我来解释一下吧：

首先要晓得的一点是，`prototype`只存在于函数对象中，下文说起【`prototype`】时代表的意思就是【构造函数的`prototype`属性】。

先看第一句：

prototype 是为其余对象提供共享属性的对象

prototype 是对象

这句话略去定语，剩下的就是：【prototype 是对象】。
prototype属性中寄存一个对象，或者说prototype属性是一个对象。
对象中有很多属性。
模式大略相似这样（当然不会是这些内容，这里仅仅打个样儿）：

Fun.prototype = {    a: function(){ console.log('a') }, // 寄存办法    b: function(){ console.log('b') },    c: 'c' // 寄存具体值    ...}

再说这句话外面的【其余对象】是哪些对象：
是通过构造函数Fun创立进去的对象，
比方let obj1 = new Fun中Fun的实例obj1就是这个【其余对象】。

提供 共享属性 是怎么回事？

通过new Fun能够发明实例obj1、天然也能够发明obj2、obj3...，
这是一个陈词滥调的问题，看一下这个场景：

function Fun(name){    this.name = name;    this.sayHi = function(){ console.log('hi～ i am' + this.name) }}let obj1 = new Fun('obj1Name')let obj2 = new Fun('obj2Name')let obj3 = new Fun('obj3Name')

如果依照下面这种形式为每一个实例增加name属性，那么每创立一个实例，都会创立一个sayHi办法。
下面创立了三个Fun实例，每个实例都创立一个内存空间保留sayHi，总共三个。

这仅仅三个实例，咱们创立就创立了，但如果有成千盈百个实例呢？这样就会很占内存。
怎么说呢，很没必要，很吃力。

那要怎么优化呢？
咱们留神到，这三个实例的构造函数都是Fun，那有没有方法能在Fun上创立一个内存空间保留sayHi，而后供它的实例们调用呢？

既然都这么问了，当然是有方法的，这时候就是prototype闪亮退场了！

咱们下面曾经晓得prototype对象中保留了一些属性、办法。
第一步咱们能够先把sayHi办法保留在Fun.prototype中。
第二步创立实例。
代码如下：

// 初始化 Funfunction Fun(name){    this.name = name;}// 将办法保留在Fun原型对象中Fun.prototype.sayHi = function(){ console.log('hi～ i am' + this.name) }// 创立实例let obj1 = new Fun('obj1Name')let obj2 = new Fun('obj2Name')let obj3 = new Fun('obj3Name')

将sayHi保留在Fun.prototype中，则只在内存中创立了一次sayHi办法，
然而办法创立在Fun.prototype上，实例们该怎么调用呢？
是否应该有一个属性保留一下Fun.prototype的地址呢（保留Fun.prototype的援用）？
还是那句话，都这样问了，当然是要，不然找不到Fun.prototype，谈何找到保留在Fun.prototype的sayHi办法呢。

【一个属性】是什么属性

讲到这儿，再说说NOTE中内容

留神：当构造函数创立一个对象的时候，这个对象会隐式援用这个构造函数的prototype属性中的属性，以便于解析属性的援用

当构造函数Fun创立了一个实例对象obj1时，obj1中会有一个属性指向Fun.prototype，obj1也能够调用Fun.prototype中保留的属性、办法等
为什么说是隐式？
因为obj1中指向Fun.prototype的那个属性按理来讲不应该被开发人员获取到，应该是标准中外部实现的一个属性，然而各个浏览器都不谋而合实现了这个属性，能够被咱们获取到，这个属性就是__proto__.

对于【__proto__】和【prototype】翻译成中文是什么，可能大家都是随性而为，没有一个对立标准称说它。比拟多的说法是：称【__proto__】为【隐式原型】称【prototype】为【原型对象】

obj1.__proto__ === Fun.prototype，这就是obj1中隐式原型属性指向其构造函数Fun的原型对象。

看到这儿是不是有点似曾相识呢，这个__proto__就是咱们下面讲的要指向Fun.prototype的那个「一个属性」呀！

既如此，下面那张图稍作批改：

__proto__

看到这儿应该对于obj.__proto__是什么有所理解了：
我所了解的是：obj.__proto__保留了obj的构造函数的prototype属性（原型对象）的地址（援用）

这么一说，对于这个属性，反而没什么好说的了。

constructor 进阶

说是进阶，也能够叫做补充，下面也仅仅是阐明了一下三个属性是什么罢了。
对于原型链、对于构造函数链，对于原型对象的constructor、隐式原型的constructor等等都没有提到。
然而不焦急，就要聊到这里了。

fun的constructor真的是constructor属性吗

参考自：参考链接 - 文二的 【## 四、真正的constructor属性藏在哪】

先看跟咱们下面说到的sayHi相似的问题：

function Fun(name){    this.name = name;    this.sayHi = ...    this.constructor = function(){ return Fun };}let obj1 = new Fun('obj1Name')...

说到底constructor也是对象的一个属性，存储着返回其构造函数的办法，大略内容可能相似下面写的那样。

如果创立每个实例的时候都创立一遍constructor函数，还是跟sayHi一开始的问题一样：占内存！没必要！吃力！

那怎么办呢？sayHi怎么解决的呢？放到构造函数的原型对象prototype外面！

// 初始化 Funfunction Fun(name){    this.name = name;}// 将办法保留在Fun原型对象中Fun.prototype.sayHi = ...Fun.prototype.constructor = function(){ return Fun };// 创立实例let obj1 = new Fun('obj1Name')...

那obj1.constructor是个什么货色呢？
我认为跟obj1.__proto__相似，也是保留地址（援用）的，
不过obj1.constructor保留的援用是Fun.prototype.constructor的地址（援用）！

Fun.prototype.__proto__.constructor

prototype 是一个对象是吧，
对象都有隐式原型__proto__这点也无可否认吧。

好的，那问题来了，Fun.prototype.__proto__.constructor输入的是什么呢？

不要慌，咱们一点点剖析。
Fun.prototype是一个对象吧，咱们把它看作一个整体：PrototypeFun，
即：

let FunPrototype = Fun.prototype

那问题就变成了FunPrototype.__proto__.constructor 输入什么？
想一下上文说过的 ：

obj.__proto__保留了obj的构造函数的prototype属性（原型对象）的地址（援用）

翻译成人话就是：obj.__proto__ === obj的构造函数.prototype
那就要找到FunPrototype的构造函数了

中途插播：八一八Fun的原型对象「prototype」的构造函数

prototype是JS的内置原型对象，根据在这里：Table 7.

再来看一段跟prototype相干的标准（能够不必看翻译，有点艰涩难懂，一会我会翻译成人话）：

17 ECMAScript Standard Built-in Objects

Unless otherwise specified every built-in prototype object has the Object prototype object, which is the initial value of the expression Object.prototype (19.1.3), as the value of its [[Prototype]] internal slot, except the Object prototype object itself.

翻译： 17 ECMAScript 规范内置对象

除非另有阐明，否则每个内置原型对象都有 Object 原型对象，它是表达式 Object.prototype (19.1.3) 的初始值，作为其 [[Prototype]] 外部槽的值，除了 Object 原型对象自身。

翻译成人话是什么呢？

每个prototype原型对象都有（保留着）一个Object的原型对象「prototype」，这个原型对象初始值就是Object.prototype的值 （说的真啰嗦），那这个原型对象保留在哪里呢？保留在[[Prototype]]外面（就是__proto__）

翻译成人话就是：任何一个原型对象fun.prototype.__proto__ === Object.prototype

ok ，话题回到 Fun.prototype.__proto__.constructor

既然任何一个原型对象的隐式原型都指向Object.prototype，
那么FunPrototype.__proto__ === Object.prototype就是成立的！

FunPrototype.__proto__.constructor返回什么呢？
返回FunPrototype的构造函数！

它的构造函数是什么？
是内置对象Object！
为什么呢？最开始咱们就晓得prototype是一个对象，Fun.prototype天然也是一个对象 （废话） 对象天然由Object创立的。

构造函数链

构造函数链的止境是Function

构造函数链的底层逻辑是:
实例.__proto__ === 实例的构造函数.prototype
其中，下图，
obj2是（Fun的）实例，Fun是（obj2的）构造函数，
Fun是（Function的）实例，Function是（Fun的）构造函数。

咱们能够看到有两条构造函数链：
一条是：obj2 - Fun - Function
另一条：Function - Function
如果要问为什么Function-Function，只能说是规定，设计之初，总要能跳出构造函数的链条，那就让它的止境是Function好了。

加上 Object 呢
咱们能够看到有三条构造函数链：
一条是：obj2 - Fun - Function
另一条：Function - Function
第三条：Object - Function

「 Object是内置函数， new Object是对象（通过new关键字返回的是一个对象）」

原型链

原型链的底层逻辑是从最底下的实例能始终追溯到null：
实例.__proto__.__proto__....__proto__ === null

构造函数链就是这样的链，如果真的要像这样写出一个链条，只能是：`实例.__proto__.constructor.__proto__.constructor...__proto__.constructor === Function.prototype`当然，这个链条感觉写进去也没什么意义。解释一下：【实例.__proto__】 指向其 【构造函数1.prototype】【构造函数1.prototype】 外面有一个属性 【constauctor】  指向构造函数1自身那么 【构造函数1.__proto__】 示意进去就是 【实例.__proto__.constructor.__proto__ 】

原型链的起点是null

加上Function 就是：

原型链、构造函数链 图片比照

【 留神箭头的方向 】

补充解释：
构造函数链跟原型链要离开了解，我以前就是不晓得为什么一个函数的实例既继承了Object的原型办法，又是Function的实例。
应该要离开了解，而后合在一起才对。
obj1、obj2 -> Fun -> Function这是构造函数链。
obj1、obj2 -> Fun -> Object，是原型链。
如果在Fun.prototype上增加‘aaFun’办法，
在Function.prototype上增加‘aaFunction’办法，
在Object.prototype上增加‘aaObject’办法，
那么 obj1、obj2 能够继承（不晓得说继承对不对）aaFun、aaObject办法，
然而运行aaFunction就会返回undefined办法，因为这个aaFunction办法不在原型链！