js实现继承的几种方式

  • 原型链继承
  • 借用构造函数来继承
  • 构造函数+原型链 组合继承
  • 寄生组合式继承
  • 原型式继承
  • 寄生式继承
  • class+extends继承

(1)原型链继承

核心:创建父类实例对象作为子类原型
优点:可以访问父类原型上的方法或属性,实现了方法复用
缺点:创建子类实例时,不能传父类的参数(比如name),
子类实例共享了父类构造函数的属性值,
js实现继承的几种方式_第1张图片
js实现继承的几种方式_第2张图片

(2)构造函数继承

核心:在子构造函数中调用父构造函数
优点:解决了原型继承的缺点 (使用构造函数来继承可以传父类的参数,可以解决子类共享父类构造函数中属性的问题)
缺点:子类无法访问父类原型中的方法和属性。(这个原型链继承可以解决)
js实现继承的几种方式_第3张图片

(3)构造函数+原型链 组合继承

核心:使用原型链实现对原型属性和方法的继承,而通过构造函数来实现对实例属性的继承。
缺点:调用了两次父类构造函数,会存在多一份的父类实例属性。
js实现继承的几种方式_第4张图片
js实现继承的几种方式_第5张图片

(4)寄生组合式继承

组合继承(3)无论什么情况下都会调用两次父类的构造函数。 寄生组合式继承就解决了上述问题,被认为是最理想的继承范式。
js实现继承的几种方式_第6张图片

(5)原型式继承

采用原型式继承并不需要定义一个类,传入参数obj,生成一个继承obj对象的对象。
优点:采用原型式继承并不需要定义一个类,传入参数obj,生成一个继承obj对象的对象。当只想单纯地让一个对象与另一个对象保持类似的情况下,原型式继承是完全可以胜任的。
缺点:不是类式继承,而是原型式基础,缺少了类的概念
js实现继承的几种方式_第7张图片

(6)寄生式继承

创建一个仅仅用于封装继承过程的函数,然后在内部以某种方式增强对象,最后返回对象。
优点:原型式继承的扩展(其实就是在原型式继承得到对象的基础上,在内部再以某种方式来增强对象,然后返回)
缺点:依旧没有类的概念
js实现继承的几种方式_第8张图片

(7)class+extends继承

js实现继承的几种方式_第9张图片
js实现继承的几种方式_第10张图片
js实现继承的几种方式_第11张图片
js实现继承的几种方式_第12张图片
js实现继承的几种方式_第13张图片
js实现继承的几种方式_第14张图片
js实现继承的几种方式_第15张图片

你可能感兴趣的:(JavaScript)