浅析javascript几种继承方式

我们都知道js的继承有几种方法:

  1. 借用构造函数
  2. 组合继承
  3. 原型式继承
  4. 寄生式继承
  5. 寄生组合式继承

第四五种是前三种的变通。
下面主要讲解前三种。

1. 借用构造函数

即在子类型构造函数中通过调用apply和call方法实现继承。

function SuperType(name){
    this.name=name;
}
function SubType(){
    SuperType.call(this,"Nicholas");
    this.age=29;
}
var instance=new SubType();

缺点:

  • 在父类的原型上定义的函数在子类中都不可见。变成了静态继承。
  • 方法都在构造函数中定义,函数无法复用。

2. 组合继承

原型链和构造函数相结合的方式

function SuperType(name){
    this.name=name;
}
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;
SubType.prototype.sayName=function (){
    alert(this.age);
}

核心代码是:

SubType.prototype=new SuperType();
SubType.prototype.constructor=SubType;

3. 原型式继承

function SuperType(name){
    this.name=name;
}
SuperType.prototype.sayName=function(){
    alert(this.name);
}
function SubType(age){
    this.age=age;
}


SubType.prototype=Object.create(SuperType.prototype);
SubType.prototype.constructor=SubType;

核心代码是:

SubType.prototype=Object.create(SuperType.prototype);
SubType.prototype.constructor=SubType;

其中Object.create方法是es5中的功能。若是兼容es5之前的版本。就模拟一个吧

if(!Object.create){
    Object.create=function(proto){
        function F(){};
        F.prototype=proto;
        return new F;
    }
}

注意:SubType.prototype=SuperType.prototype是万万不可的。
这样若是更改SubType原型方法,SuperType的原型方法也会随之改变,因为他们公用的一个原型。

要实现继承,一定要新建一个空对象,它的原型指向父类的原型。子类的constructor指向新对象。

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

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

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

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

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

抵扣说明:

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

余额充值