js基础-继承

继承

其基本思想是利用原型让一个引用类型继承另一个引用类型的属性和方法。

首先了解下原型链

了解原型链之前先知道,每个实例对象(object)都有一个私有属性(称之为__proto__)指向它的原型对象(prototype),该原型对象也有一个自己的原型对象(为__proto__) ,层层向上直到一个对象的原型对象为 null

分析如下:

构造函数(Super) 有一个原型对象 prototype,
Super的原型对象prototype 包含一个指向构造函数的指针,
Super的实例(new Super())包含一个指向Super原型对象的内部指针

构造函数(Sub) 有一个原型对象 prototype,
Sub的原型对象prototype 包含一个指向构造函数的指针,
Sub的实例(new Sub()) 包含一个指向Sub原型对象的内部指针

现在,让Sub的原型对象prototype 等于Super 的实例(new Super())
Sub.prototype = new Super()

此时:本来Super的实例包含一个指向Super原型对象的内部指针,现在用Sub的原型替换Super的实例,得到Sub的原型对象 包含一个指向Super的原型对象的指针
Sub.prototype.__proto__ = Super.prototype

其中 让Sub的原型对象prototype 等于Super 的实例(new Super()) 就是所谓的继承

原型链是这样的:

ins_sb.__proto__ = Sub.prototype
Sub.prototype.__proto__ = Super.prototype
Super.prototype.__proto__ = Super

理解如下代码:

function SuperType() {
    this.property = true
}
SuperType.prototype.getSuperValue = function () {
    return this.property
}

function SubType() {
    this.subproperty = false
}
// ⚠️注意
SubType.prototype = new SuperType()

SubType.prototype.getSubValue = function () {
    return this.subproperty
}

var instance = new SubType()

console.log(instance.getSuperValue()) // true

在上述代码中,我们没有使用SubType默认提供的原型,而是给它换了一个新原型,这个新原型就是SuperType的实例。

于是,新原型不仅具有作为一个SuperType的实例所拥有的全部属性和方法,而且其内部还有一个指针,指向SuperType的原型,SubType的原型又指向SuperTYpe的原型。

其结果就是:instance指向SubType的原型,SubType的原型又指向SuperType的原型。这就是原型链~

好了,再理一下为何getSuperValue()方法在SuperType.prototype中,但是property则位于SubType.property中?

这是因为property是实例属性,而getSuperValue则是一个原型方法。既然SubType.property现在是SuperType的实例,那property 就当然位于SubType.property中了

  • 0
    点赞
  • 0
    收藏
    觉得还不错? 一键收藏
  • 0
    评论

“相关推荐”对你有帮助么?

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值