js 继承 三种常用方法 原型链-借用构造函数-组合式继承

1、经典原型链方法  
function SuperType() {
        this.property = true;
    }
    SuperType.prototype.getSuperValue = function() {
        return this.property;
    }
    function subType() {
        this.property = false;
    }
    //继承了SuperType的属性和方法
    SubType.prototype = new SuperType();
    SubType.prototype.getSubValue = function (){
        return this.property;
    }
    var instance = new SubType();
    console.log(instance.getSuperValue());//true
有一处弊端:如果有两个以上的实例,第一个实例向原型中添加了元素,第二个实例(不想要那个)
也会获取到添加的元素,也就是继承后,所有实例共享相同的属性。另外就是不能向构造函数传参!
SuperType和SubType区别在于是后者继承了前者!继承是通过创建前者的实例并赋给后者的prototype来实现的。
原来存在于前者的属性和方法,现在也存在于后者中。
2、借用构造函数法
function SuperType(){
this.colors = ["red", "blue", "green"];
}
function SubType(){
//使用call() 的方法来继承SuperType
SuperType.call(this);
}
var p1 = new SubType();
p1.colors.push("black");
alert(p.colors); //"red,blue,green,black"
var p2 = new SubType();
alert(p2.colors); //"red,blue,green;
此方法可以去掉第一种方法中实例共享属性的缺陷!也就是第二个实例不会受到第一个实例的影响,
各自继承各自的。在call(this,"jack",15,"clerk")时可在括号里传参!
3、组合继承法(避免了前两种方法的缺陷,融合了优点,推荐使用)

function SuperType(name){
this.name = name;
this.colors = ["red", "blue", "green"];
}
SuperType.prototype.sayName = function(){
alert(this.name)
};
function SubType(name, age){
//继承属性
SuperType.call(this, name);
this.age = age;
}
//继承方法
SubType.prototype = new SuperType();
SubType.prototype.constructor = SubType;//通过constructor改变this指针,现在指向subtype,
SubType.prototype.sayAge = function(){
alert(this.age);
};
var instance1 = new SubType("Nicholas", 29);
instance1.colors.push("black");
alert(instance1.colors); //"red,blue,green,black"
instance1.sayName(); //"Nicholas";
instance1.sayAge(); //29
优点:保证实现函数复用的同时,又能够使每个实例拥有各自的属性!
其中call()已经将属性和方法全部继承了下来,又使用new来继承原型上的方法,覆盖了之前继承下来的方法,即重复继承了。




  • 0
    点赞
  • 0
    收藏
    觉得还不错? 一键收藏
  • 0
    评论

“相关推荐”对你有帮助么?

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值