JavaScript 基础:继承

栏目: JavaScript · 发布时间: 6年前

内容简介:今天,我们要讲的是 JS 继承的知识,包括 原型继承, 构造函数继承, 组合继承及其优化, 寄生式组合继承。子类的原型对象设置为父类的实例:这样:每个子类实例就会继承父类实例的属性,但由于继承的属性在子类的原型上,所以继承的属性在不同实例之间都是共享的,没有隔离。

今天,我们要讲的是 JS 继承的知识,包括 原型继承, 构造函数继承, 组合继承及其优化, 寄生式组合继承。

原型继承

子类的原型对象设置为父类的实例:

function C1 (){}
function C2 (){}
C2.prototype = new C1();
C2.prototype.constructor = C2;

这样:每个子类实例就会继承父类实例的属性,但由于继承的属性在子类的原型上,所以继承的属性在不同实例之间都是共享的,没有隔离。

构造函数继承

子类的构造函数内部,执行了父类的构造函数:

function C1 (){}
function C2 (...args){
    C1.call(this, ...args);
}

这样:每个子类实例的继承属性就隔离了,但继承不到父类的原型方法;

组合继承

结合以上两种

function C1 (){}
function C2 (...args){
    C1.call(this, ...args);
}
C2.prototype = new C1();
C2.prototype.constructor = C2;

这样:继承的私有属性隔离,继承的原型方法可以公用,但是执行了两次父类的构造函数,第二次是多余的。

组合继承优化

结合前两种方法,但把子类的原型对象指向父类的原型对象,而不是实例。

function C1 (){}
function C2 (...args){
    C1.call(this, ...args);
}
C2.prototype = C1.prototype;
C2.prototype.constructor = C2;

这样:就避免执行了两次父类的构造函数,但破坏了父类的原型对象的 constructorC1.proptotype.constructor ,本来应该指向 C1 的,现在指向 C2 了。

寄生组合继承

将子类的原型对象设置为一个新的对象,该对象的 __proto__ 指向父类的原型。

function C1 (){}
function C2 (...args){
    C1.call(this, ...args);
}
C2.prototype = Object.create(C1.prototype);
C2.prototype.constructor = C2;

这样就完美了!


以上就是本文的全部内容,希望本文的内容对大家的学习或者工作能带来一定的帮助,也希望大家多多支持 码农网

查看所有标签

猜你喜欢:

本站部分资源来源于网络,本站转载出于传递更多信息之目的,版权归原作者或者来源机构所有,如转载稿涉及版权问题,请联系我们

The Art of Computer Programming, Volume 2

The Art of Computer Programming, Volume 2

Knuth, Donald E. / Addison-Wesley Professional / 1997-11-04 / USD 79.99

Finally, after a wait of more than thirty-five years, the first part of Volume 4 is at last ready for publication. Check out the boxed set that brings together Volumes 1 - 4A in one elegant case, and ......一起来看看 《The Art of Computer Programming, Volume 2》 这本书的介绍吧!

SHA 加密
SHA 加密

SHA 加密工具

Markdown 在线编辑器
Markdown 在线编辑器

Markdown 在线编辑器

HSV CMYK 转换工具
HSV CMYK 转换工具

HSV CMYK互换工具