js 继承

ECMAScript只帮助促成持续(继承实际的方法),首要借助原型链来完结。

1、原型链

主导考虑是应用原型让三个引用类型继承另多个引用类型的属性和艺术。

示例:

  function SuperType(){
        this.property = true; //实例属性
    }
    SuperType.prototype.getSuperValue = function(){//原型方法
        return this.property;
    }

    function SubType(){
        this.subproperty = false;
    }
    
    //SubType继承了SuperType
    SubType.prototype = new SuperType();
    
    SubType.prototype.getSubValue = function(){
        return this.subproperty;
    }
    
    var instance = new SubType();
    console.log(instance.getSuperValue()); //true
    console.log(instance.constructor); //SuperType

说明:

  以上代码创立了八个门类:SuperType 和
SubType。那八个门类都有些的品质和措施,SubType继承了SuperType,继承是透过创办SuperType的实例,并把该实例赋给SubType的prototype。达成的精神是重写了SubType原型对象,代之以一个新品类的实例。

  SubType的新原型具有SuperType全体的习性和艺术,同时其内部还有三个指南针[[Prototype]],指向SuperType的原型,最终结出是instance指向了SubType的原型,SubType的原型又针对了SuperType的原型。

  instance.constructor指向的是SuperType,那是因为本来的SubType.prototype中的constructor被重写了。(实际上不是SubType的原型的constructor属性被重写了,而是SubType的原型指向了SuperType,而这几个原型的constructor属性指向的是SuperType。)

  全部引用类型暗中认可都连续了Object,这么些三番7回也是通过原型链类达成的。全数函数的暗中同意原型都是Object的实例,默许原型都会蕴藏三个里边指针,指向Object.prototype。

 

图片 1

专注:在通过原型链完毕持续时,不可能接纳字面量对象创立原型方法,那样会重写原型链,把大家的原型链切断。

原型链的题材:(1)、包涵引用类型值的原型;

                   
(2)、创设子类型的实例时,无法向超类型的构造函数中传送参数。

贰 、借用构造函数

也叫伪造对象大概经典一而再,基本思想是在子类型构造函数内部调用超类型构造函数。

   function SuperType(name){
        this.name = name;
        this.colors = [‘red’, ‘blue’, ‘green’];
    }
    
    function SubType(){
        //继承了SubType,同时还传递了参数
        SuperType.call(this, ‘Nick’);
        
        //实例属性
        this.age = 12;
    }
    
    var instance1 = new SubType();
    instance1.colors.push(‘gray’);
    console.log(instance1.name);
    console.log(instance1.age);
    
    var instance2 = new SubType();
    console.log(instance2.colors);

借用构造函数的题材:方法都在构造函数中定义,由此函数复用就不能够谈起了。而且,在超类型的原型中定义的方法,对子类型而言也是不可知的。

叁 、组合继承

也叫伪经典延续,基本思维是运用原型链达成对原型属性和艺术的持续,通过借用构造函数完成对实例属性的后续,那样,即透过在原型上定义方法达成了函数复用,又能确认保证每一个实例都有它和谐的性质。

   function SuperType(name){
        this.name = name;
        this.colors = [‘red’, ‘yellow’, ‘blue’];
    }
    
    SuperType.prototype.sayName = function(){
        return this.name;
    }
    
    function SubType(name, age){
        //继承属性
        SuperType.call(this, name);
        this.age = age;
    }
    //继承方法
    SubType.prototype = new SuperType();
    
    SubType.prototype.sayAge = function(){
        return this.age;
    }
    
    var instance1 = new SubType(‘Tom’, 12);
    instance1.colors.push(‘black’);
    console.log(instance1.colors);//[‘red’, ‘yellow’, ‘blue’,
‘black’]
    console.log(instance1.sayAge());//12
    console.log(instance1.sayName());//Tom
    
    var instance2 = new SubType(‘Lucy’,21);
    console.log(instance2.colors);//[‘red’, ‘yellow’, ‘blue’]
    console.log(SubType.prototype.isPrototypeOf(instance2));//true
    console.log(SuperType.prototype.isPrototypeOf(instance2));//true

结合继承是JavaScript常用的后续形式,但是也有欠缺。

 ④ 、寄生组合式继承

因而借用构造函数来再而三属性,通过原型链的混成格局来继承方法。

   
//借助原型基于已有指标成立新目的(本质上讲,object()对传播的靶子进行了贰次浅复制)
    function object(o){
        function F(){}
        F.prototype = o;
        return new F();
    }
    //使用寄生式继承来一连超类型的原型,然后再将结果钦点给子类型的原型
    function inheritPrototype(SuperType, SubType){
        var prototype =
object(SuperType.prototype);//创设超类型原型的三个副本
        prototype.constructor =
SubType;//增强对象,弥补因重写原型而错过的暗中同意的constructor属性
        SubType.prototype = prototype;
    }

    function SuperType(name){
        this.name = name;
        this.colors = [‘blue’, ‘red’, ‘green’];
    }
    
    SuperType.prototype.sayName = function(){
        return this.name;
    }
    
    function SubType(name, age){
        SuperType.call(this, name);
        this.age = age;
    }
    
    inheritPrototype(SuperType, SubType);
    
    SubType.prototype.sayAge = function(){
        return this.age;
    }
    
    var instance = new SubType(‘Tom’, 12);
  instance.colors.push(‘black’);
  console.log(instance.colors);
  delete instance.name;
  console.log(instance.name);

  var instance = new SubType(‘Lucy’, 33);
  console.log(instance.colors);

普遍认为寄生组合式继承是援引类型最非凡的后续范式。