实现继承的5种方式

1、借助call

function Parent(){
      this.name='parent'
    }
    function Child(){
      Parent1.call(this)
    }
  
    var a=new Child();

在这里插入图片描述
子类虽然能够拿到父类的属性值,但是,子类无法拿到父类中的方法。

2、借助原型链

 function Parent(){
      this.name='parent'
      this.arr=[1,2,3]
    }
    function Child(){
      
    }
    Child.prototype=new Parent
    var a=new Child();

在这里插入图片描述
子类能拿到父类的属性,也能拿到父类的方法。
但是,var a=new Child();var b=new Child();实例a和实例b使用的是同一个原型对象,如果a.arr.push(23),那么b.arr也会改变。

3、将前两种结合

function Parent(){
      this.name='parent'
      this.arr=[1,2,3]
    }
    function Child(){
      Parent.call(this)
    }
    Child.prototype=new Parent
    var a=new Child();

在这里插入图片描述

这种方式Parent构造函数会执行两次

4、组合继承的优化

function Parent(){
      this.name='parent'
      this.arr=[1,2,3]
    }
    function Child(){
      Parent.call(this)
    }
    Child.prototype=Parent.prototype
    var a=new Child();

在这里插入图片描述
将父类的原型对象直接给子类的原型对象,父类构造函数只执行一次。
但是子类的构造函数会显示位Parent,我们不能手动更改Child.prototype.constructor,因为一更改,那么Parent.prototype.constructor就也变了。

5、组合继承的优化2,寄生组合继承

function Parent(){
      this.name='parent'
      this.arr=[1,2,3]
    }
    function Child(){
      Parent.call(this)
    }
    Child.prototype=Object(Parent.prototype);
    Child.prototype.constructor=Child
    var a=new Child();

在这里插入图片描述
Object(Parent.prototype)产生一个以Parent.prototype为原型的新对象。
同时手动更改Child.prototype.constructor

  • 0
    点赞
  • 1
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
1. 原型链继承:通过将父类的实例作为子类的原型来实现继承实现方式:将子类的原型对象指向父类的实例对象,缺点是无法向父类构造函数传递参数。 2. 借用构造函数继承:通过在子类构造函数中调用父类构造函数来实现继承实现方式:在子类构造函数中调用父类构造函数,并使用call或apply方法改变this指向,缺点是无法继承父类原型链上的方法和属性。 3. 组合继承:通过将原型链继承和借用构造函数继承结合起来,实现同时继承父类属性和方法的继承方式实现方式:将子类的原型对象指向一个以父类实例为原型的对象,并在子类构造函数中调用父类构造函数,缺点是父类构造函数被调用了两次。 4. 原型式继承:通过对一个已有对象进行浅复制来实现继承实现方式:使用Object.create方法复制一个对象,并将其作为子类的原型对象,缺点是无法传递参数给父类构造函数。 5. 寄生式继承:通过在原型式继承的基础上,增强对象,实现继承实现方式:在原型式继承的基础上,增加一个封装继承过程的函数,返回一个增强后的对象,缺点是增加了复杂度。 6. 寄生组合式继承:通过组合继承和寄生式继承实现继承实现方式:在组合继承的基础上,使用寄生式继承,避免了父类构造函数被调用两次的问题,实现了最优的继承方式
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

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

抵扣说明:

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

余额充值