谈谈js的继承

JS的继承

前一阵时间一个去面试的朋友问我js的继承一共有多少种?分别怎么实现的?我脑子一蒙,想了想说三四种吧,原型链、构造函数。。还有混合的怎么实现来着?于是乎我意识到了,我需要稳固一下基础知识了,哈哈。

1、原型链继承

这种继承应该很容易理解,通过原型链的赋值,从而实现继承

1
2
3
4
5
6
7
8
9
10
11
12
13
14
function animal(name) {
    this.name = name || "未知"
}
animal.prototype.eat = function(food) {
  console.log(this.name + '正在吃：' + food);
};
function dog(){
  
}
dog.prototype = new animal();
这种继承方式的特点是当父级发生改变时,子集随之也改变

2、构造函数继承

构造函数继承其实就是在父类的构造函数中复制一份,给子类用(call、apply)

1
2
3
4
5
6
7
function animal(name) {
        this.name = name || "未知"
}
function cat(name){
    animal.call(this)
    this.name = name || "未知"  
}

这种继承方式有一个比较致命的问题就是子类只可以继承父类的实例,而不能继承父类的prototype

3、实例继承

这种方式的继承不多说了。。。

1
2
3
4
5
6
7
8
9
function animal(name) {
            this.name = name || "未知"
}
function Cat(name){
  var instance = new Animal();
  instance.name = name || 'Tom';
  return instance;
}

4、混合继承

这种方法的继承使我们所推荐的,其实就是构造函数继承加上原型链继承

1
2
3
4
5
6
7
8
9
function animal(name) {
            this.name = name || "未知"
}
function Cat(name){
  Animal.call(this);
  this.name = name || 'Tom';
}
Cat.prototype = new Animal();