码迷,mamicode.com
首页 > Web开发 > 详细

js中5中继承方式分析

时间:2017-02-18 21:11:43      阅读:269      评论:0      收藏:0      [点我收藏+]

标签:name   type   attr   并且   function   没有   att   继承   var   

//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);

js中5中继承方式分析

标签:name   type   attr   并且   function   没有   att   继承   var   

原文地址:http://www.cnblogs.com/liuluteresa/p/6413974.html

(0)
(0)
   
举报
评论 一句话评论(0
登录后才能评论!
© 2014 mamicode.com 版权所有  联系我们:gaon5@hotmail.com
迷上了代码!