前端开发,必知ES5、ES6的7种继承

众所周知,在ES6之前,前端是不存在类的语法糖,所以不能像其他语言一样用extends关键字就搞定继承关系,需要一些额外的方法来实现继承。下面就介绍一些常用的方法,红宝书已经概括的十分全面了,所以本文基本就是对红宝书继承篇章的笔记和梳理。

原型链继承

原型链继承缺点:

  1. 每个实例对引用类型属性的修改都会被其他的实例共享
  1. 在创建Child实例的时候,无法向Parent传参。这样就会使Child实例没法自定义自己的属性(名字)

借用构造函数(经典继承)

优点:

  1. 解决了每个实例对引用类型属性的修改都会被其他的实例共享的问题
  2. 子类可以向父类传参

缺点:

  1. 无法复用父类的公共函数
  2. 每次子类构造实例都得执行一次父类函数

组合式继承(原型链继承和借用构造函数合并)

优点:

  1. 解决了每个实例对引用类型属性的修改都会被其他的实例共享的问题
  2. 子类可以向父类传参
  3. 可实现父类方法复用

缺点:

  1. 需执行两次父类构造函数,第一次是Child.prototype = new Parent(),第二次是Parent.call(this, name)造成不必要的浪费

原型式继承

复制传入的对象到创建对象的原型上,从而实现继承

缺点: 同原型链继承一样,每个实例对引用类型属性的修改都会被其他的实例共享

寄生式继承

我们可以使用Object.create来代替上述createObj的实现,原理基本上是一样的。寄生式继承其实就是在createObj的内部以某种形式来增强对象(这里的增强可以理解为添加对象的方法),最后返回增强之后的对象。

通过createEnhanceObj就可以在创建对象的时候,把对象方法也通过此种方式继承。缺点: 同借用构造函数一样,无法复用父类函数,每次创建对象都会创建一遍方法

寄生组合式继承

不需要为了子类的原型而多new了一次父类的构造函数,如Child.prototype = new Parent() 只需要复制父类原型的一个副本给子类原型即可

优点: 不必为了指定子类型的原型而调用父类型的构造函数

ES6继承

ES6支持通过类来实现继承,方法比较简单,代码如下

前端开发,必知ES5、ES6的7种继承
未经允许不得转载:一点博客-青梅煮码-共享博客 » 前端开发,必知ES5、ES6的7种继承
分享到:
赞(1) 打赏

评论抢沙发

  • 昵称 (必填)
  • 邮箱 (必填)
  • 网址

觉得文章有用就打赏一下文章作者

支付宝扫一扫打赏

微信扫一扫打赏