js继承之组合继承

Posted 2023-04-22

参考技术A 组合继承，指的是将原型链和借用构造函数的技术组合在一块，从而发挥二者之长的一种继承模式。

红宝书是这样说的，其思路是使用原型链实现对原型属性和方法的继承，通过借用构造函数来实现对实例属性的继承，这样，即通过在原型上定义方法实现了函数复用，又能保证每个实例都有自己的属性。

下面我们看一个组合继承的例子，没有女朋友我们就new一个女朋友

组合继承避免了原型链和借用构造函数的缺陷，融合了他们的优点，So，组合继承成为了javascript中最常用的继承模式。

js继承

主要有原型链、借助构造函数、组合继承、原型式继承、寄生式继承、寄生组合继承6种，但是由于原型链、构造函数、原型式继承、寄生继承都有一定的缺点，并不常用，故此不在赘述。

• 组合继承

function super(name) {
    this.name = name;
    this.colors = ["red","blue"];    
}
super.prototype.sayName = function(){
    alert(this.name);
};
function sub(name,age){
    super.call(this,name); //属性继承  第二次调用super()
    this.age = age;
}
sub.prototype = new super(); //方法继承 第一次调用super()
sub.prototype.sayAge = function(){
    alert(this.age);
};

var instance1 = new sub("Barney",32);
instance1.colors.push("balck");
alert(instance1.colors);//red blue black
instance1.sayName();//Barney
instance1.sayAge();//32

var instance1 = new sub("Ted",33);
alert(instance1.colors);//red blue
instance1.sayName();//Ted
instance1.sayAge();//33

如上所示，两个实例之间的白能量并没有互相影响，而且都可以使用super和sub中的方法，但是super()被调用了两次,显得有些多余，所以有了原型式继承

• 寄生组合继承

  function inheritPrototype(subType,superType){
      var prototype = Object(superType.prototype);
      prototype.constructor = subType;
      subType.prototype = prototype;
  }
  
  function super (name){
      this.name = name;
      this.colors = ["red","blue"];
  }
  super.prototype.sayName = function(){
      alert(this.name);
  };
  function sub(name,age){
      super.call(this,name);
      this.age = age;
  }
  inheritPrototype(sub,super);
  sub.prototype.sayAge = function(){
      alert(this.age);
  };
  
  var instance = new sub("Barney",32);
  instance.sayName();//Barney
  instance.sayAge();//32
  instance instanceof super; //false 不知道为什么会是false
  instance instanceof sub; //true