js高程(二)-----继承

首先来讨论一下原型链，上代码

function SuperType(){
    this.property = true;
  }

  SuperType.prototype.getSuperValue = function(){
    console.log(this.property);
  }

  function SubType(){
    this.subproperty = false;
  }

  SubType.prototype = new SuperType();

  SubType.prototype.getSubValue = function(){
    console.log(this.subproperty);
  }

  var instance = new SubType();

  console.log(instance.getSuperValue());//true

前三行创建了一个名为SuperType的构造器，并为其添加了一个属性propertype，其值设为true，然后在SuperType的原型上添加方法getSuperValue，功能是输出属性property的值，第一个构造函数完毕。9到11行创建第二个构造函数并添加属性subproperty，其值设为false。重点部分：第13行，把一个SuperType的实例赋值给SubType的原型。后面同样为SubType的原型添加一个方法。然后创建一个Subtype的实例，调用getSuperValue方法，返回true。 

下面来仔细分析一下这条原型链，首先创造一个构造函数SuperType，它指向自己的原型，而原型的constructor有指向SuperType，这是第一部分，第二次创造了新的构造函数SubType，它的实例instance指向它的原型，而它的原型已经被设定为一个SuperType的实例，而这个实例又指向SuperType的原型，所以这部分和刚刚的第一部分就联系起来了，问题来了，instance。constructor是谁？沿着刚刚说的原型链向上找，

console.log(instance.constructor);//SuperType

同理，SuperType其实还能沿着原型链向上，上面就是Object。

第二种：借用构造函数，上代码：

function SuperType(name){
    this.name = name;
  }

  function SubType(){
    SuperType.call(this,"jiangjie");
    this.age = 20;
  }

  var instance = new SubType();

  console.log(instance.name);//jiangjie
  console.log(instance.age);//20

  console.log(instance.constructor);//Subtype
  console.log(Object.getPrototypeOf(instance)==SubType.prototype);//true

  console.log(instance.hasOwnProperty("name"));//true

这样的写法就更容易理解了，使用call只是使用了Supertype的属性，但是并没有改动任何的原型链，我们可以使用hasOwnProperty来证明并不是调用了SuperType作为原型，

第三种：组合继承，上代码

function SuperType(name){
    this.color = ['red','black','white'];
    this.name = name;
  }


  SuperType.prototype.sayName = function(){
    console.log(this.name);
  }

  function SubType(name,age){
    SuperType.call(this,name);
    this.age = age;
  }

  SubType.prototype = new SuperType();

  SubType.prototype.sayAge = function(){
    console.log(this.age);
  }

  var instance1 = new SubType('jaingjie','20');
  var instance2 = new SubType('lukexin','20');

  instance1.color.push('green');
  console.log(instance1.color);//['red','black','white','green'];
  console.log(instance1.sayName());//jiangjie
  console.log(instance1.sayAge());//20

  console.log(instance2.color);//['red','black','white'];
  console.log(instance2.sayName());//lukexin
  console.log(instance2.sayAge());//20

说白了就是改进版，集中各个方法所长，使用 借用构造函数 方法，来设定各自实例属性，通过原型来设定通用的方法，但是要注意，为了确保构造函数不会重写子类的属性，要在调用超类型构造函数以后，再为子类添加属性