原型链

36 阅读1分钟

原型链

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

function Person(name) {
  this.name = name || '张三'
}
const p1 = new Person('lisi')
  • 对象p1通过new关键字创建出,p1隐式对象指向构造函数的原型对象,即 Person.prototype

    • 隐式对象在多数浏览器中使用__proto__表示。
  • js 中所有的对象都有一个隐式引用,称之为这个对象的 prototype 原型。所以 Person.prototype 也有隐式原型,指向创建它的构造函数的原型即 Object.prototype

  • 构造函数 Person 也是通过 new 关键字创建,即 Person.__proto__指向创建该对象的构造函数的原型对象 Function.prototype

  • 通常创建字面量是const obj = {},obj 的隐式引用指向Object.prototype,而Object.prototype的隐式引用指向null

  • 原型对象中的属性 constructor 指向构造函数对象

    • 即:Date.prototype.constructor === Date
  • Function的隐式原型和显示原型都指向Function.prototype,即:

    Function.__proto__ // 为Function.prototype
    Function.prototype
    

new 关键字

new 运算符创建一个用户定义的对象类型的实例或具有构造函数的内置对象的实例。

  • 执行以下操作:
  1. 创建一个新的空对象字面量 obj {}

  2. 将对象的 __proto__ 属性连接至构造函数的原型对象上Constructor.prototype

  3. 使用 obj 作为this

  4. 执行该构造函数

  5. 返回该对象

    • Constructor.apply(obj, arguments)
    • 如果返回一个对象则返回构造函数的结构Constructor.apply(obj, arguments)
    • 返回 null 或其他类型 则返回 obj 对象
    function myNew() {
      var obj = {}
      var constructor = [].shift.call(arguments)
    
      obj.__proto__ = constructor.prototype
      var res = constructor.apply(obj, arguments)
      return typeof res === 'object' && res !== null ? res : obj
    }
    

引用一张图片

原型链.jpg