美文网首页
JS继承七种方式

JS继承七种方式

作者: 蜻蜓路过风 | 来源:发表于2020-01-19 15:04 被阅读0次
function SuperClass() {
    this.x = 'I am super'
}
SuperClass.prototype.say = function() {
    console.log(this.x)
}
一:原型链继承,一般不用

缺点1:包含引用类型值时会改变
缺点2:无法在不影响所有原型对象时,向超类型的构造函数传递参数

function SubClass1() {
    this.y = 4
}
SubClass1.prototype = new SuperClass()
new SubClass1().say() // I am super
二:借用构造函数,一般不用
function SubClass2() {
    SuperClass.call(this)
}
new SubClass2().say() // not a function,说明无法复用原型链上的方法

SubClass2.prototype.subSay = function() {
    console.log(this.x)
}
new SubClass2().subSay() // I am super
三:组合继承,唯一缺点:调用了两次超类型构造函数
function SubClass3() {
    SuperClass.call(this)
    this.y = '4'
}
SubClass3.prototype = new SuperClass()
new SubClass1().say() // I am super
四:原型式继承,缺点是和原型链一样的
function create(obj) {
    function F() {}
    F.prototype = obj
    return new F();
}

const subClass4 = create(new SuperClass())
五:寄生式继承,即以工厂模式再次封装以增强对象
function parasitic(obj) {
    var clone = create(obj)
    // 增强对象
    clone.sayHi = function() {
        console.log(this.x + 'Hi')
    }
    return clone
}
六:寄生组合式继承,普遍认为最好
function inheritPrototype(SubClass6, SuperClass) {
    var prototype = create(obj)
    prototype.constructor = SuperClass
    SubClass6.prototype = prototype
}
七:Es6继承
class SuperClass {
    constructor() {
        this.x = 'I am super'
    }
    say() {
        console.log(this.x)
    }
}
class SubClass7 extends SuperClass {
    constructor() {
        super() // 必须调用超类构造函数,否则报错
        this.x = 'I am Sub'
    }
}

相关文章

  • JS继承七种方式

    一:原型链继承,一般不用 缺点1:包含引用类型值时会改变缺点2:无法在不影响所有原型对象时,向超类型的构造函数传递...

  • js 的继承的几种方式

    js 继承有6种方式的代码。 js继承的6种方式[https://www.cnblogs.com/Grace-zy...

  • js继承方式

    类式继承 构造函数继承 组合继承 类式继承 + 构造函数继承 原型式继承 寄生式继承 寄生组合式继承 寄生式继承 ...

  • JS继承方式

    js继承有多种继承方式,但最常用的是组合模式,代码例子如下 在这种方式下,把实例函数都保存在原型对象上,这样可...

  • js继承方式

    实现继承有两种常见方式: 混合式继承 最简单的继承就是将别的对象的属性强加到我身上,那么我就有这个成员了。 混合式...

  • js继承方式

    //Object.create(proObj)创建一个新的对象,但是还要把proObj作为这个对象的原型 //...

  • js继承方式

    1、原型链继承 缺点:复合类型数据改变会影响所有子函数2、构造函数继承 缺点:如果属性有公用函数,重复多了会浪费内...

  • js继承方式

    原型链继承 打印结果如下: 上面定义了一个 Parent 类并传了一个 name 值,而且在 Parent 的原型...

  • JS继承

    JS中的继承 许多OO语言都支持两种继承方式:接口继承和实现继承; 因为JS中没有类和接口的概念 , 所以JS不支...

  • 继承

    研究学习了js内部的继承方式,以及多种方式的优点和缺点 目前项目中的 以前项目中的 js中继承有多种方式 原型继承...

网友评论

      本文标题:JS继承七种方式

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