JavaScript类的继承方法小结【组合继承分析】


Posted in Javascript onJuly 11, 2018

本文实例讲述了JavaScript类的继承方法。分享给大家供大家参考,具体如下:

在JavaScript 里,被继承的函数称为超类型(父类,基类也行,其他语言叫法),继承的函数称为子类型(子类,派生类)。继承也有之前问题,比如字面量重写原型会中断关系,使用引用类型的原型,并且子类型还无法给超类型传递参数。

为了解决引用共享和超类型无法传参的问题,我们采用一种叫借用构造函数的技术,或者成为对象冒充(伪造对象、经典继承)的技术来解决这两种问题。

function aObj(){
  this.name = ['小红','小强'];
  }
}
aObj.prototype.showname = ()=>{
  alert(this.name)
}
function bObj(){
  aObj.call(this); //只针对构造函数本身的继承 还需要继承原型
}

借用构造函数虽然解决了函数本身的继承,但没有继承原型链。所以,我们需要原型链+借用构造函数的模式,这种模式称为组合继承。

方法一:

bObj.prototype = aObj.prototype;

缺点:引用类型,在操作对象原型时候,直接改变堆内存中对象的方法

方法二:

bObj.prototype = new aObj();

这种继承借助原型并基于已有的对象创建新对象,同时还不必因此创建自定义类型,但是构造函数两次继承,不是很好

方法三:

bObj.prototype = Object.create(aObj.prototype);
bObj.prototype.constructor = bObj

使用a原型对象及其属性去创建一个新的对象,并将这个对象的constructor指向B函数本身,不存在重复继承的问题

方法四:

for (var i in aObj.prototype) {
  bObj.prototype[i] = aObj.prototype[i];
}

将a的原型链遍历给b对象,实现原型的深度拷贝,双方互不影响

希望本文所述对大家JavaScript程序设计有所帮助。

Javascript 相关文章推荐
用jQuery简化JavaScript开发分析
Feb 19 Javascript
javascript判断非数字的简单例子
Jul 18 Javascript
javascript实现网页中涉及的简易运动(改变宽高、透明度、位置)
Nov 29 Javascript
创建基于Bootstrap的下拉菜单的DropDownList的JQuery插件
Jun 02 Javascript
浅谈angularjs中响应回车事件
Apr 24 Javascript
webstorm添加vue.js支持的方法教程
Jul 05 Javascript
如何以Angular的姿势打开Font-Awesome详解
Apr 22 Javascript
JavaScript设计模式之代理模式简单实例教程
Jul 03 Javascript
vue2.0 路由模式mode="history"的作用
Oct 18 Javascript
bootstrap下拉分页样式 带跳转页码
Dec 29 Javascript
vue中组件的3种使用方式详解
Mar 23 Javascript
jQuery AJAX应用实例总结
May 19 jQuery
React中嵌套组件与被嵌套组件的通信过程
Jul 11 #Javascript
JSON数据中存在单个转义字符“\”的处理方法
Jul 11 #Javascript
JS实现动态生成html table表格的方法分析
Jul 11 #Javascript
vue监听键盘事件的快捷方法【推荐】
Jul 11 #Javascript
vue移动端实现红包雨效果
Jun 23 #Javascript
vue实现学生录入系统之添加删除功能
Jul 11 #Javascript
微信小程序实现红包雨功能
Jul 11 #Javascript
You might like
php操作SVN版本服务器类代码
2011/11/27 PHP
php+mysql实现数据库随机重排实例
2014/10/17 PHP
php判断输入是否是纯数字,英文,汉字的方法
2015/03/05 PHP
PHP实现分布式memcache设置web集群session同步的方法
2018/04/10 PHP
laravel excel 上传文件保存到本地服务器功能
2019/11/14 PHP
js关闭子窗体刷新父窗体实现方法
2012/12/04 Javascript
BOOTSTRAP时间控件显示在模态框下面的bug修复
2015/02/05 Javascript
Clipboard.js 无需Flash的JavaScript复制粘贴库
2015/10/02 Javascript
13个PHP函数超实用
2015/10/21 Javascript
学习javascript面向对象 理解javascript原型和原型链
2016/01/04 Javascript
angular.js分页代码的实例
2016/07/27 Javascript
浅谈Web页面向后台提交数据的方式和选择
2016/09/23 Javascript
JavaScript的事件机制详解
2017/01/17 Javascript
Vue 2.0 服务端渲染入门介绍
2017/03/29 Javascript
Angular中管道操作符(|)的使用方法
2017/12/15 Javascript
Nuxt.js之自动路由原理的实现方法
2018/11/21 Javascript
VUE2.0 ElementUI2.0表格el-table自适应高度的实现方法
2018/11/28 Javascript
探索浏览器页面关闭window.close()的使用详解
2020/08/21 Javascript
Python保存MongoDB上的文件到本地的方法
2016/03/16 Python
python 垃圾收集机制的实例详解
2017/08/20 Python
Python PyQt4实现QQ抽屉效果
2018/04/20 Python
python程序运行进程、使用时间、剩余时间显示功能的实现代码
2019/07/11 Python
Python3.0 实现决策树算法的流程
2019/08/08 Python
python微信公众号开发简单流程实现
2020/03/09 Python
python爬虫用mongodb的理由
2020/07/28 Python
pip install命令安装扩展库整理
2021/03/02 Python
CSS3 特效范例整理
2011/08/22 HTML / CSS
HTML5中FileReader接口使用方法实例详解
2017/08/26 HTML / CSS
澳大利亚家具和家居用品在线:BROSA
2017/11/02 全球购物
预备党员思想汇报范文
2014/01/11 职场文书
绩效管理实施方案
2014/03/19 职场文书
本科生自荐信
2014/06/18 职场文书
考试作弊检讨书
2015/01/27 职场文书
博物馆观后感
2015/06/05 职场文书
火锅店的开业营销方案范本!
2019/07/05 职场文书
磁贴还没死, 微软Win11可修改注册表找回Win10开始菜单
2021/11/21 数码科技