美文网首页
[搬运整理] JS继承的4种方法

[搬运整理] JS继承的4种方法

作者: 玛丽莲做梦 | 来源:发表于2019-12-05 12:24 被阅读0次

(放一放,有空重新整理)

继承前,首先当然要有一个父类(Father)

// 父类 Father
    function Father(name = "father") {
        // 属性
        this.name = name;
        // 实例方法
        this.sleep = function () {
            console.log(this.name + '在睡觉');
        }
    }
    // 原型方法
    Father.prototype.look = function (lookType) {
        console.log(this.name + "在看" + lookType);
    }

  • 1 - 原型继承

核心:将父类的实例作为子类的原型(并不是把父类中的属性和方法克隆一份一模一样的给子类,而是让子类和父类之间增加了原型链接)。
特点:子类原型会继承父类中所有的属性和方法,不管是公有的还是私有的。子类的实例也是父类的实例。

 /* 原型继承 */
    function Son(name, age) {
        this.name = name;
        this.age = age;
    }
    Son.prototype = new Father()   // 相当于重写 Son 原型
    Son.prototype.constructor = Son   // 必要!把 Son 原型上的 constructor 重新指向Son

    let son = new Son("son", 11)
    console.log(son.name);   // son
    console.log(son.age);   // 11
    son.sleep();   // son在睡觉
    son.look("TV");   // son在看TV
  • 2 - call 继承(构造继承)

核心:在子类的内部调用父类,通过 call 改变父类中的 this 指向,使用父类的构造函数来增强子类实例,相当于将父类的实例属性复制给子类。
特点:可以继承父类的属性和实例方法,但是无法继承原型中的方法。子类的实例只是例子的实例,并不是父类的实例。

/* call 继承(原型继承) */
    function Son(name, age) {
        Father.call(this)
        this.name = name
        this.age = age
    }

    let son = new Son("son", 11)
    console.log(son.name);   // son
    console.log(son.age);   // 11
    son.sleep()   // son在睡觉
    son.look("TV")   // 报错 - son.look is not a function
  • 3 - 冒充对象继承

核心:定义一个中间对象来完成子类对父类方法对拷贝
特点:因为是子类是将父类对属性和方法全部拷贝,所以每个子类都有父类方法(实例方法和原型方法)。

/* 冒充对象继承 */
    function Son(name, age) {
        let temp = new Father()
        for (let k in temp) {
            this[k] = temp[k]
        }
        this.name = name
        this.age = age
        temp = null
    }

    let son = new Son("son", 11)
    console.log(son.name);   // son
    console.log(son.age);   // 11
    son.sleep()   // son在睡觉
    son.look("TV")   // son在看TV
  • 4 - 组合继承

核心:结合原型继承和构造继承
特点:即是子类实例,也是父类继承。且函数可复用,不会造成方法过载。

/* 组合继承 */
    function Son(name, age) {
        Father.call(this)
        this.name = name;
        this.age = age;
    }

    Son.prototype = new Father()
    Son.prototype.constructor = Son

    let son = new Son("son", 11)
    console.log(son.name);   // son
    console.log(son.age);   // 11
    son.sleep()   // son在睡觉
    son.look("TV")   // son在看TV

相关文章

  • [搬运整理] JS继承的4种方法

    (放一放,有空重新整理) 继承前,首先当然要有一个父类(Father) 1 - 原型继承 核心:将父类的实例作为子...

  • 我碰到的前端面试题(js)

    1.js实现继承有哪几种方法? 方法一:原型链继承 方法二: 构造函数继承 方法三: 组合继承 2.this指向问...

  • js面向对象(2)

    4.js里面的继承

  • 面向对象继承复习

    js基础的面向对象的继承 构造函数继承 这种方法的缺陷是只会继承构造函数上的实例属性,并不会继承原型对象上的属性,...

  • JS 继承的多种方法

    一、原型链 学过java的同学应该都知道,继承是java的重要特点之一,许多面向对象的语言都支持两种继承方式:接口...

  • JS继承的方法

    JS继承的方法有六种: 1、原型链继承 2、构造继承 3、实例继承 4、拷贝继承 5、组合继承 6、寄生组合继承

  • 浅析JS继承方法

    JS 实现继承的方法有:1.原型链继承2.构造函数继承3.组合继承(原型链继承 + 构造函数继承)4.原型式继承(...

  • js原型继承的几种方法

    1. 原型链继承 利用原型链来实现继承,父类的一个实例作为子类的原型 原理: 子类的原型对象指向 父类的实例, 当...

  • JS基础整理(2)—定义类和继承的几种方法

    1. 创建类 1.1. 简单的类 类指一组对象从同一个原型对象继承属性,原型对象是类的核心特征。定义一个原型对象,...

  • JS高级 03

    JS实现继承的方式 1.属性拷贝 2.原型式继承 3.原型链继承 4.借用构造函数继承|伪对象继承|经典点继承 5...

网友评论

      本文标题:[搬运整理] JS继承的4种方法

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