js中5中继承方式分析

//1、借用式继承   把sup的构造函数里的属性方法克隆一份sub实例对象

    function Super(){

      this.val = 1;

      this.fun1 = function(){console.log('fun1')};

    }

    Super.prototype.name = "name";

    Super.prototype.fun2 = function(){console.log('fun2')};

 

    function Sub(){

      Super.call(this);

    }

 

    var sub1 = new Sub();

    var sub2 = new Sub();

 

    console.log(sub1.fun1 === sub2.fun1);

    console.log(sub1.val);

    console.log(sub1.name);

    sub1.fun1();                   

 

    //2、原型式继承    把Super的实例对象拿作Sub构造函数的原型属性

    function Super(){

      this.val1 = 1;

      this.fun1 = function(){console.log(1)};

    }

    var pro = new Super();

 

    function Sub(){}

    Sub.prototype = pro;

 

    var sub1 = Sub();

 

 

    //3、寄生式   sub实例化对象新增了自己的属性方法，并且把Super的实例对象拿作Sub构造函数的原型属性

    function Super(){

      this.val1 = 1;

      this.fun1 = function(){console.log(1)};

    }

    Super.prototype.val2 = 2;

    Super.prototype.fun2 = function(){console.log(2)};

 

    function Sub(){

    }

    Sub.prototype = new Super();

 

    var sub1 = new Sub();

    sub1.attr1 = 1;

    sub1.attr2 = 2;

 

 

    //4、组合式继承   把sup的构造函数里的属性方法克隆一份sub实例对象，并且把Super的实例对象拿作Sub构造函数的原型属性

    function Super(){

      this.val1 = 1;

      this.fun1 = function(){console.log(1)};

    }

    Super.prototype.val2 = 2;

    Super.prototype.fun2 = function(){console.log(2)};

 

    function Sub(){

      Super.call(this);

    }

    Sub.prototype = new Super();

 

    var sub1 = new Sub();

    var sub2 = new Sub();

 

    console.log(sub1);

    console.log(sub1.fun1 === sub2.fun1);

    console.log(sub1.fun2 === sub2.fun2);

 

 

 

    //5、寄生组合式     Sub构造函数的原型属性是第三个构造函数（它的原型为Sup的原型，但是没有Sup构造函数里的属性方法）的实例对象，把sup的构造函数里的属性方法克隆一份sub实例对象

    function beget(obj){   // 生孩子函数 beget：龙beget龙，凤beget凤。

    var F = function(){};

    F.prototype = obj;

    return new F();

    }

 

    function Super(){

        // 只在此处声明基本属性和引用属性

        this.val = 1;

        this.arr = [1];

    }

    //  在此处声明函数

    Super.prototype.fun1 = function(){};

    Super.prototype.fun2 = function(){};

    //Super.prototype.fun3...

 

    function Sub(){

        Super.call(this);   // 核心

        // ...

    }

    var proto = beget(Super.prototype); // 核心

    proto.constructor = Sub;            // 核心

    Sub.prototype = proto;              // 核心

 

    var sub = new Sub();

    alert(sub.val);

    alert(sub.arr);