JS继承的多种方式

2020-04-04  本文已影响0人  南山码僧

1:原型链继承

推荐指数:🦍🦍

特点:

❀ 将父类的实例作为子类的原型继承

❀ 这样子类实例化出来的对象即子类的实例又是父类的实例

优点:

❀ 同时继承了父类原型和实例上的属性

❀ 简单,易于实现。

缺点:

❀ 给子类添加原型属时必须要在子类实例化完成后

❀ 子类实例化的时候不能像父类构造器中传参初始化属性

❀ 无法实现多继承

2:调用构造函数继承

推荐指数:🦍🦍

特点:

❀ 使用父类的构造函数来增强子类实例,相当于继承了父类的实例属性。

❀ 实例化出来的对象仅是子类的实例,并不是父类的实例。

优点:

❀ 可以向父类传参初始化属性值

❀ 可以实现多实例属性的继承,在需要增强子类实例的地方call多个父类。

缺点:

❀ 不能继承父类的原型属性。

❀ 无法实现构造函数的复用。

❀ 每个实例都保存了一份父类的实例副本,影响性能。

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

推荐指数:🦍🦍🦍🦍(多消耗了一点内存)

特点:

❀ 实例属性通过调用父类构造器来继承,原型上的属性通过原型链继承。

❀ 通过原型链继承后的子类实例即是父类的实例,也是子类的实例。

优点:

❀ 可以向父类传参初始化属性值。

❀ 通过构造函数调用继承可以实现实例属性的多继承。

❀ 解决了共享引用类型属性的问题。

❀ 函数可复用。

缺点:

❀ 调用了两次父类构造器,生成了两份实例。(事实上子类实例化的时候覆盖了原型上的那份实例)

4:寄生组合继承

推荐指数:🦍🦍🦍🦍🦍

特点:

❀ 构建一个空函数,然后将被继承函数原型上的属性存在空函数的原型上。

优点:

❀ 父类上的原型属性和实例属性分开继承。

寄生继承只继承了父类上的原型属性

调用构造器值继承了父类上的实例属性

❀ 避免了组合继承中两次调用构造器的问题。

缺点:

❀ 一点点复杂

6:ES6类继承(写过其他后端语言的孩子对于这种方式不要太熟悉)

推荐指数:🦍🦍🦍🦍🦍

关于类继承的方式还有很多组合方式,有机会再补充完整。

下边上一段最简单的类继承代码。因为我现在使用的脚手架缘故,所以是用TS写的。

上一篇下一篇

猜你喜欢

热点阅读