es5实现继承

JavaScript语言本身并没有提供继承的机制,即使es6推出的extends关键字也是通过prototype实现的继承,所以核心就是通过prototype继承到父类的原型成员,通过子类调用父类构造函数达到继承父类实例成员,两者的结合使用完成继承的目的.

es5实现继承的方法有很多,比较好的方式为组合式继承(替换原型继承+构造函数继承)

下面直接上代码:

/**
 * 组合式继承 = 替换原型继承/寄生式[意为将父类原型寄生在子类原型链上](继承父类实例成员) + 借用构造函数继承(继承父类原型成员)
 **/
function Father(age) {
  this.age = age
}
// 父类原型的成员
Father.prototype.fname = 'Susuk'
function Son(name, age) {
  // 使用构造函数继承调用父类构造 得到父类的实例成员
  Father.call(this, age)
  this.name = name
}
// 子类原型的成员
Son.prototype.getName = function () {
  return `子类的name:\t${this.name}`
}
Son.prototype.__proto__ = Object.create(Father.prototype) // 替换掉爷爷原型 防止覆盖掉子类原型的成员
Son.prototype.constructor = Son // 将子类构造函数指回来
const son = new Son('Suk', 18)
console.log(son)