JavaScript 利用原型实现继承

[ChuChencheng]

背景

利用寄生组合继承

不说花里胡哨的，直接手写代码

实现

假设给定一个父类 SuperClass ，实现一个继承它的子类 SubClass

// 给定的父类
function SuperClass () {
  this.superProperty = 1
}

SuperClass.prototype.superMethod = function () {
  console.log('super method')
}

// 实现继承的子类
function inheritPrototype (superClass, subClass) {
  const tempInstance = Object.create(superClass.prototype)
  // 不打破原型链，在 temp 实例上挂一个 constructor
  tempInstance.constructor = subClass
  subClass.prototype = tempInstance
}

function SubClass (...rest) {
  // 继承构造函数创建的属性
  SuperClass.call(this, ...rest)
  this.subProperty = 2
}

// 继承原型上的方法
inheritPrototype(SuperClass, SubClass)

// 在子类原型上可继续添加新方法
SubClass.prototype.subMethod = function () {
  console.log('sub method')
}

hint

在 inheritPrototype 方法中， temp 对象的原型链：

temp.constructor === SubClass // true
temp.__proto__.contructor === SuperClass // true

参考

回忆杀：JavaScript的继承