美文网首页
JS继承方式总结

JS继承方式总结

作者: 雪中一匹狼 | 来源:发表于2018-08-07 13:35 被阅读0次

1、构造函数绑定方式

function A(){
        this.a = 1;
}

function B(){
        A.apply(this, arguments);
        this.b = 2;    
}
var b = new B();
b.a; //1

优点:简单易懂
缺点:无法继承父类A的原型里的属性和方法

2、原型模式

function A(){
         this.a = 1;
}

A.prototype.aa = 11;

function B(){
        his.b = 2;
}

B.prototype = new A();

B.prototype.constructor = B;

var b = new B();

b.a; //1

b.aa; //11

优点:子类可以继承父类A的原型里的属性和方法

缺点:创建子类实例需要多次创建父类对象,消耗内存

3、直接继承prototype

function A(){
    this.a = 1;
}
A.prototype.aa = 11;

function B(){
    this.b = 2;
}

B.prototype = A.prototype;
B.prototype.constructor = B;

var b = new B();
b.a; //1
b.aa; //11

优点:子类可以继承父类A的原型里的属性和方法,无需创建父类对象

缺点:父类A的原型对象被修改,其constructor属性指向了子类B

4、原型链继承

function A(){
    this.a = 1;
}
A.prototype.aa = 11;

function B(){
    A.apply(this, arguments);
    this.b = 2;
}

B.prototype.__proto__ = A.prototype;
//或者
//Object.setPrototypeOf(B.prototype, A.prototype);

var b = new B();
b.a; //1
b.aa; //11

优点:具有上述其他方式的优点

缺点:需要高版本的浏览器支持

相关文章

  • JS继承方式总结

    1、构造函数绑定方式 优点:简单易懂缺点:无法继承父类A的原型里的属性和方法 2、原型模式 优点:子类可以继承父类...

  • 面向对象五

    面向对象高级二 总结 PHP 里的面向对象、继承方式 JS 里的继承方式 call(构造函数伪装) 和 proto...

  • JS继承

    羡慕java的继承,一个extend搞定开头总结一下JS继承的方式:原型链继承,借用构造函数继承,组合继承,原型式...

  • JS继承的几种方式

    关于Js继承的几种方式,总结一下,以便查看。 第一种 prototype 引用型原型继承 语言支持:js原生支持的...

  • JS继承方式总结 (转)

    借用构造函数继承 原型链式继承(借用原型链实现继承) 组合式继承 组合式继承优化1 组合式继承优化2 ES6中继承...

  • js实现继承方式总结

    1.原型链继承 将父类对象创建出来,赋给子类的原型对象 原型链继承的问题:1.所有父类的属性和方法都会被子类的所有...

  • js继承

    原文链接 js的继承有6种方式,大致总结一下它们各自的优缺点,以及它们之间的关系。 1.原型链 js的继承机制不同...

  • JS六种继承继承方式优缺点

    js的继承有6种方式,大致总结一下它们各自的优缺点,以及它们之间的关系。 1.原型链 js的继承机制不同于传统的面...

  • js 的继承的几种方式

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

  • js继承方式

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

网友评论

      本文标题:JS继承方式总结

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