JS 继承

作者: 练习时长2年半的个人练习生 | 来源:发表于2018-03-26 14:04 被阅读0次

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

    // Test Code

    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()这样的语句之后执行,不能放到构造器中

    无法实现多继承

    来自原型对象的引用属性是所有实例共享的(详细请看附录代码: 示例1

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

    2、构造继承

    核心:使用父类的构造函数来增强子类实例,等于是复制父类的实例属性给子类(没用到原型)

    function Cat(name){

           Animal.call(this);

           this.name = name || 'Tom';

    }

    // Test Code

    var cat = new Cat();

    console.log(cat.name);

    console.log(cat.sleep());

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

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

    特点:

    解决了1中,子类实例共享父类引用属性的问题

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

    可以实现多继承(call多个父类对象)

    缺点:

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

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

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

    相关文章

      网友评论

          本文标题:JS 继承

          本文链接:https://www.haomeiwen.com/subject/lukrcftx.html