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 Dog() {

}

Dog.prototype = new Animal();  //将Animal的实例挂载到了Dog的原型链上

//或：

//Dog.prototype = Object.create(Animal.prototype)

Dog.prototype.name = 'dog';

 

var dog = new Dog();

console.log(dog.name); //dog

dog.eat('bone'); //dog正在吃:bone

dog.sleep(); //dog正在睡觉！

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

console.log(dog instanceof Dog); //true

特点：

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

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

简单

缺点：

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

无法实现继承多个

来自原型对象的所有属性被所有实例共享

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

构造继承：

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

function Cat(name) {

Animal.call(this);

this.name = name || 'Tom';

}

var cat = new Cat();

console.log(cat.name); //Tom

cat.sleep(); //Tom正在睡觉！

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

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

特点：

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

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

缺点：

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

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

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

实例继承

//核心：为父类实例添加新特性，作为子类实例返回

function Cat(name) {

var instance = new Animal();

instance.name = name || 'Tom';

return instance;

}

var cat = new Cat();

console.log(cat.name); //Tom

cat.sleep(); //Tom正在睡觉！

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

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

特点：

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

缺点：

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

不支持多继承