prototype、__proto__与constructor

参考网站

https://blog.csdn.net/cc18868876837/article/details/81211729

function Foo() {...};
let f1 = new Foo();

以上代码表示创建一个构造函数Foo()，并用new关键字实例化该构造函数得到一个实例化对象f1。虽然是简简单单的两行代码，然而它们背后的关系却是错综复杂的，如下图所示：

注意点：

1. __proto__和constructor属性是对象所独有的；
2. prototype属性是函数所独有的。但是由于JS中函数也是一种对象，所以函数也拥有__proto__和constructor属性(这点是致使我们产生困惑的很大原因之一)

上图有点复杂，我们把它按照属性分别拆开，然后进行分析：

__proto__ 属性

__proto__解释

__proto__它是对象所独有的，__proto__属性都是由一个对象指向一个对象，即指向它们的原型对象（也可以理解为父对象）  

__proto__作用

它的作用就是当访问一个对象的属性时，如果该对象内部不存在这个属性，那么就会去它的__proto__属性所指向的那个对象（可以理解为父对象）里找，如果父对象也不存在这个属性，则继续往父对象的__proto__属性所指向的那个对象（可以理解为爷爷对象）里找，如果还没找到，则继续往上找…直到原型链顶端null（可以理解为原始人。。。），此时若还没找到，则返回undefined（可以理解为，再往上就已经不是“人”的范畴了，找不到了，到此结束）

由以上这种通过__proto__属性来连接对象直到null的一条链即为我们所谓的原型链。

prototype 属性

prototype解释

prototype属性是函数所独有的，它是从一个函数指向一个对象。它的含义是函数的原型对象，也就是这个函数（其实所有函数都可以作为构造函数）所创建的实例的原型对象，所以f1.__proto__ === Foo.prototype，它们两个完全一样。

prototype作用  

它的作用就是包含可以由特定类型（原型函数）的所有实例共享的属性和方法，也就是让该函数所实例化的对象们都可以找到公用的属性和方法。任何函数在创建的时候，其实会默认同时创建该函数的prototype对象。

constructor 属性

constructor解释

constructor属性也是对象才拥有的，它是从一个对象指向一个函数，含义就是指向该对象的构造函数，每个对象都有构造函数（本身拥有或继承而来，继承而来的要结合__proto__属性查看会更清楚点，如下图所示），从上图中可以看出Function这个对象比较特殊，它的构造函数就是它自己（因为Function可以看成是一个函数，也可以是一个对象），所有函数和对象最终都是由Function构造函数得来，所以constructor属性的终点就是Function这个函数。

  感谢网友的指出，这里解释一下上段中“每个对象都有构造函数”这句话。这里的意思是每个对象都可以找到其对应的constructor，因为创建对象的前提是需要有constructor，而这个constructor可能是对象自己本身显式定义的或者通过__proto__在原型链中找到的。而单从constructor这个属性来讲，只有prototype对象才有。每个函数在创建的时候，JS会同时创建一个该函数对应的prototype对象，而函数创建的对象.__proto__ === 该函数.prototype，该函数.prototype.constructor===该函数本身，故通过函数创建的对象即使自己没有constructor属性，它也能通过__proto__找到对应的constructor（找到父对象的constructor，继承关系），所以任何对象最终都可以找到其构造函数（null如果当成对象的话，将null除外）。如下：

总结

1. __proto__和constructor属性是对象所独有的；
2. prototype属性是函数所独有的，因为函数也是一种对象，所以函数也拥有__proto__和constructor属性。
3. 原型链顶端object.prototype（boject对象）在往上就是null
4. 函数创建的对象.__proto__ === 该函数.prototype（指向相同的对象），该函数.prototype.constructor===该函数本身

__proto__属性的作用就是当访问一个对象的属性时，如果该对象内部不存在这个属性，那么就会去它的__proto__属性所指向的那个对象（父对象）里找，一直找，直到__proto__属性的终点null，然后返回undefined，通过__proto__属性将对象连接起来的这条链路即我们所谓的原型链。
prototype属性的作用就是让该函数所实例化的对象们都可以找到公用的属性和方法，即f1.__proto__ === Foo.prototype。
constructor属性的含义就是指向该对象的构造函数，所有函数（此时看成对象了）最终的构造函数都指向Function。