js继承与实现（总结）

之前说要将js继承写完全，好像时间和能力不太允许，所以，将笔记分享给大家，与大家一同学习，一起进步！

【转】  幻天芒 ：https://www.cnblogs.com/humin/p/4556820.html的博客，感谢大佬的分享！

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);

};

 

1、原型链继承

核心： 将父类的实例作为子类的原型

function Cat(){

}

Cat.prototype = new Animal();

Cat.prototype.name = 'cat';

var cat = new Cat();

console.log(cat.name);

console.log(cat.eat('fish'));

console.log(cat.sleep());

console.log(cat instanceof Animal); //true

console.log(cat instanceof Cat); //true

特点：

非常纯粹的继承关系，实例是子类的实例，也是父类的实例

父类新增原型方法/原型属性，子类都能访问到

简单，易于实现

缺点：

要想为子类新增属性和方法，必须要在new Animal()这样的语句之后执行，不能放到构造器中无法实现多继承

创建子类实例时，无法向父类构造函数传参

2、构造继承

核心：使用父类的构造函数来增强子类实例，等于是复制父类的实例属性给子类（没用到原型）

function Cat(name){

  Animal.call(this);

  this.name = name || 'Tom';

}

var cat = new Cat();

console.log(cat.name);

console.log(cat.sleep());

console.log(cat instanceof Animal); // false

console.log(cat instanceof Cat); // true

特点：

创建子类实例时，可以向父类传递参数

可以实现多继承（call多个父类对象）

缺点：

实例并不是父类的实例，只是子类的实例

只能继承父类的实例属性和方法，不能继承原型属性/方法

无法实现函数复用，每个子类都有父类实例函数的副本，影响性能

3、实例继承

function Cat(name){

  var instance = new Animal();

  instance.name = name || 'Tom';

  return instance;

}

var cat = new Cat();

console.log(cat.name);

console.log(cat.sleep());

console.log(cat instanceof Animal); // true

console.log(cat instanceof Cat); // false

特点：

不限制调用方式，不管是new 子类()还是子类(),返回的对象具有相同的效果

缺点：

实例是父类的实例，不是子类的实例

不支持多继承

4、组合继承

function Cat(name){

Animal.call(this);

  this.name = name || 'Tom;

}

Cat.prototype=new Animal();

var cat = new Cat();

console.log(cat.name);

console.log(cat.sleep());

console.log(cat instanceof Animal); // true

console.log(cat instanceof Cat); // true

特点：

弥补了方式2 的缺陷

缺点：

生成了两个实例，消耗内存；

= name || 'Tom;

}

Cat.prototype=new Animal();

var cat = new Cat();

console.log(cat.name);

console.log(cat.sleep());

console.log(cat instanceof Animal); // true

console.log(cat instanceof Cat); // true

特点：

弥补了方式2 的缺陷

缺点：

生成了两个实例，消耗内存；