构造函数、实例对象、原型之间的关系以及原型链

构造函数、实例化对象、原型对象之间的关系

构造函数

• 系统内部已经定义的构造函数如 Date()

• 系统特殊的构造函数 如 Function()、 Object()

• 自定义的构造函数一般是函数名大写的函数

• function Person(){
      // js引擎内部做的一件事 this.prototype = {} 
  }
  

实例化对象

• 通过new 关键字创建出来的对象

const lisi = new Person()  // js引擎内部做的一件事 this.__proto__ = Person.prototype

原型对象

• 函数会有一个prototype属性指向自己的原型对象
• 原型对象会有一个constructor属性指向自己的构造函数
• 因此函数和原型对象会形成一个闭环，所以浏览器会出现下面的情况

console.dir(lisi)

三者的关系

• 通过前面其实已经知道了构造函数和原型对象的关系了只要在加上实例对象就ok了

• 实例对象肯定是和自己的构造函数有关系的，上面可以看到实例对象的结构
  

• 其实第一层是[[Prototype]]这个就是我们常说的__proto__隐式原型属性

• 也就是说 实例化对象是通过__proto__隐式原型属性和自己的构造函数进行关联的。

• __proto__隐式原型属性指向的不是自己的构造函数，而是指向Person的原型对象
  

• 通过上图可以得到下图，这里有个关键点**所有构造函数的原型对象默认指向空的Object对象（Object构造函数除外）**翻译过来就是Person的原型对象指向Object对象

原型、原型链的关系

• 原型、原型链最清楚的图

• 看懂图的基础知识

• 每一个对象都有__proto__属性都指向其构造函数prototype属性（Object原型对象除外，Object.__proto__=null）

• 每一个函数内部都有一个prototype属性指向它的原型对象

• 每一个原型对象都有一个constructor属性指向其自己的构造函数

• 所有构造函数的原型对象默认指向空的Object对象

• 每一个函数的__proto__都会指向Function.prototype（因为每一个函数都是Function的实例对象）

• Function的__proto__指向Function.prototype

  自己画一遍才能理解清楚

  • 红色为隐式原型链，就是查找方法或者属性要遵循的规则