带你理解JavaScript的几种原型继承方法

其实JavaScript的原型最好的用法就是运用在面向对象编程的继承中,今天就来给大家讲一下,几种常用的原型继承运用方法。

原型继承

原型继承:每一个构造函数都有prototype原型属性,通过构造函数创建出来的对象都继承自该原型属性。所以可以通过更改构造函数的原型属性来实现继承。
在JavaScript中,继承的方式有多种,可以一个对象继承另一个对象,也可以通过原型继承的方式进行继承。

接下来给大家演示讲解一下几种继承方式:

1.简单混入继承

直接遍历一个对象,将所有的属性和方法加到另一对象上。
在这里插入图片描述
缺点:只能一个对象继承自另一个对象,代码复用太低了。

2.混入式原型继承

混入式原型继承其实与上面的方法类似,只不过是将遍历的对象添加到构造函数的原型上。
在这里插入图片描述
面向对象思想封装一个原型继承
我们可以利用面向对象的思想,将面向过程进行封装。
在这里插入图片描述
3.替换式原型继承

替换式原型继承,在上面已经举过例子了,其实就是将一个构造函数的原型对象替换成另一个对象。
在这里插入图片描述
之前我们就说过,这样做会产生一个问题,就是替换的对象会重新开辟一个新的空间。

替换式原型继承时的bug

替换原型对象的方式会导致原型的constructor的丢失,constructor属性是默认原型对象指向构造函数的,就算是替换了默认原型对象,这个属性依旧是默认原型对象指向构造函数的,所以新的原型对象是没有这个属性的。
在这里插入图片描述
解决方法:手动关联一个constructor属性
在这里插入图片描述
4.Object.create()方法实现原型继承

当我们想把对象1作为对象2的原型的时候,就可以实现对象2继承对象1。前面我们了解了一个属性:proto,实例出来的对象可以通过这个属性访问到它的原型,但是这个属性只适合开发调试时使用,并不能直接去替换原型对象。

所以这里介绍一个新的方法:Object.create()。

语法:var obj1 = Object.create(原型对象);

示例代码:让空对象obj1继承对象obj的属性和方法
在这里插入图片描述
兼容性:由于这个属性是ECMAScript5的时候提出来的,所以存在兼容性问题。
利用浏览器的能力检测,如果存在Object.create则使用,如果不存在的话,就创建构造函数来实现原型继承。
在这里插入图片描述

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

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

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

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

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

抵扣说明:

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

余额充值