千家信息网

js如何实现组合继承

发表于:2024-10-27 作者:千家信息网编辑
千家信息网最后更新 2024年10月27日,这篇文章将为大家详细讲解有关js如何实现组合继承,小编觉得挺实用的,因此分享给大家做个参考,希望大家阅读完这篇文章后可以有所收获。父类代码如下:// 定义一个动物类function Animal (n
千家信息网最后更新 2024年10月27日js如何实现组合继承

这篇文章将为大家详细讲解有关js如何实现组合继承,小编觉得挺实用的,因此分享给大家做个参考,希望大家阅读完这篇文章后可以有所收获。

父类代码如下:

// 定义一个动物类function Animal (name) {  // 属性  this.name = name || 'Animal';  // 实例方法  this.sleep = function(){    console.log(this.name + '正在睡觉!');  }}// 原型方法Animal.prototype.eat = function(food) {  console.log(this.name + '正在吃:' + food);};

组合继承

核心:通过调用父类构造,继承父类的属性并保留传参的优点,然后通过将父类实例作为子类原型,实现函数复用

function Cat(name){  Animal.call(this);  this.name = name || 'Tom';}Cat.prototype = new Animal();// 组合继承也是需要修复构造函数指向的。Cat.prototype.constructor = Cat;// Test Codevar cat = new Cat();console.log(cat.name);console.log(cat.sleep());console.log(cat instanceof Animal); // trueconsole.log(cat instanceof Cat); // true

特点:

  • 弥补了方式2的缺陷,可以继承实例属性/方法,也可以继承原型属性/方法

  • 既是子类的实例,也是父类的实例

  • 不存在引用属性共享问题

  • 可传参

  • 函数可复用

缺点:

  • 调用了两次父类构造函数,生成了两份实例(子类实例将子类原型上的那份屏蔽了)

关于"js如何实现组合继承"这篇文章就分享到这里了,希望以上内容可以对大家有一定的帮助,使各位可以学到更多知识,如果觉得文章不错,请把它分享出去让更多的人看到。

0