[js高手之路]寄生组合式继承的优势详解


Posted in Javascript onAugust 28, 2017

在之前javascript面向对象系列的文章里面,我们已经探讨了组合继承和寄生继承,回顾下组合继承:

function Person( uName ){
      this.skills = [ 'php', 'javascript' ];
      this.userName = uName;
    }
    Person.prototype.showUserName = function(){
      return this.userName;
    }
    function Teacher ( uName ){
      Person.call( this, uName );
    }
    Teacher.prototype = new Person();

    var oT1 = new Teacher( 'ghostwu' );
    oT1.skills.push( 'linux' );
    var oT2 = new Teacher( 'ghostwu' );
    console.log( oT2.skills ); //php,javascript
    console.log( oT2.showUserName() ); //ghostwu

组合继承有个缺点,父类的构造函数会被调用两次.

第11行,设置子类原型对象(prototype),调用了第一次

第9行,实例化对象的时候,又调用一次

构造函数的目的是为了复制属性,第9行肯定是不能少的,第11行的目的是为了获取到父类原型对象(prototype)上的方法,基于这个目的,有没有别的方法

可以做到 在不需要实例化父类构造函数的情况下,也能得到父类原型对象上的方法呢? 当然可以,我们可以采用寄生式继承来得到父类原型对象上的方法

function Person( uName ){
      this.skills = [ 'php', 'javascript' ];
      this.userName = uName;
    }
    Person.prototype.showUserName = function(){
      return this.userName;
    }
    function Teacher ( uName ){
      Person.call( this, uName );
    }

    function object( o ){
      var G = function(){};
      G.prototype = o;
      return new G();
    }

    function inheritPrototype( subObj, superObj ){
      var proObj = object( superObj.prototype ); //复制父类superObj的原型对象
      proObj.constructor = subObj; //constructor指向子类构造函数
      subObj.prototype = proObj; //再把这个对象给子类的原型对象
    }

    inheritPrototype( Teacher, Person );

    var oT1 = new Teacher( 'ghostwu' );
    oT1.skills.push( 'linux' );
    var oT2 = new Teacher( 'ghostwu' );
    console.log( oT2.skills ); //php,javascript
    console.log( oT2.showUserName() ); //ghostwu

其实,说白了寄生组合式继承就是一个借用构造函数 + 相当于浅拷贝父类的原型对象

以上这篇[js高手之路]寄生组合式继承的优势详解就是小编分享给大家的全部内容了,希望能给大家一个参考,也希望大家多多支持三水点靠木。

Javascript 相关文章推荐
JavaScipt基本教程之JavaScript语言的基础
Jan 16 Javascript
javascript 函数速查表
Feb 07 Javascript
使用JS CSS去除IE链接虚线框的三种方法
Nov 14 Javascript
解析offsetHeight,clientHeight,scrollHeight之间的区别
Nov 20 Javascript
js检验密码强度(低中高)附图
Jun 05 Javascript
jQuery插件slides实现无缝轮播图特效
Apr 17 Javascript
jquery与js实现全选功能的区别
Jun 11 jQuery
Node.JS更改Windows注册表Regedit的方法小结
Aug 18 Javascript
利用JavaScript的%做隔行换色的实例
Nov 25 Javascript
微信小程序使用Promise简化回调
Feb 06 Javascript
详解JS取出两个数组中的不同或相同元素
Mar 20 Javascript
JS实现简单日历特效
Jan 03 Javascript
ajax+node+request爬取网络图片的实例(宅男福利)
Aug 28 #Javascript
js排序与重组的实例讲解
Aug 28 #Javascript
利用ES6的Promise.all实现至少请求多长时间的实例
Aug 28 #Javascript
JS自定义函数实现时间戳转换成date的方法示例
Aug 27 #Javascript
JavaScript学习笔记之惰性函数示例详解
Aug 27 #Javascript
Vue实现typeahead组件功能(非常靠谱)
Aug 26 #Javascript
vue下跨域设置的相关介绍
Aug 26 #Javascript
You might like
德生1994机评
2021/03/02 无线电
PHP常用代码大全(新手入门必备)
2010/06/29 PHP
php中随机显示图片的函数代码
2011/06/23 PHP
php中fsockopen用法实例
2015/01/05 PHP
使用PHP连接数据库_实现用户数据的增删改查的整体操作示例
2017/09/01 PHP
ThinkPHP3.2.3框架实现执行原生SQL语句的方法示例
2019/04/03 PHP
PHP isset empty函数相关面试题及解析
2020/12/11 PHP
jquery ui dialog ie8出现滚动条的解决方法
2010/12/06 Javascript
自动刷新网页,自动刷新当前页面,JS调用
2013/06/24 Javascript
JQUERY实现左侧TIPS滑进滑出效果示例
2013/06/27 Javascript
node.js中的console.dir方法使用说明
2014/12/10 Javascript
Prototype框架详解
2015/11/25 Javascript
JS实现日期时间动态显示的方法
2015/12/07 Javascript
基于Node.js的强大爬虫 能直接发布抓取的文章哦
2016/01/10 Javascript
JavaScript使用简单正则表达式的数据验证功能示例
2017/01/13 Javascript
Jquery-data的三种用法
2017/04/18 jQuery
angularJS 发起$http.post和$http.get请求的实现方法
2017/05/18 Javascript
JavaScript闭包_动力节点Java学院整理
2017/06/27 Javascript
Vue 父子组件数据传递的四种方式( inheritAttrs + $attrs + $listeners)
2018/05/04 Javascript
轻量级富文本编辑器wangEditor结合vue使用方法示例
2018/10/10 Javascript
解决vue单页面修改样式无法覆盖问题
2019/08/05 Javascript
[01:18]一目了然!DOTA2DotA快捷操作对比第一弹
2014/07/01 DOTA
使用Python的Twisted框架实现一个简单的服务器
2015/04/16 Python
Python中线程的MQ消息队列实现以及消息队列的优点解析
2016/06/29 Python
python脚本执行CMD命令并返回结果的例子
2019/08/14 Python
Pytorch之parameters的使用
2019/12/31 Python
Python中使用Selenium环境安装的方法步骤
2021/02/22 Python
HTML5中input输入框默认提示文字向左向右移动的示例代码
2020/09/10 HTML / CSS
英国最大的在线蜡烛商店:Candles Direct
2019/03/26 全球购物
技术总监管理岗位职责
2014/03/09 职场文书
个人自我鉴定总结
2014/03/25 职场文书
数控机床专业自荐信
2014/05/19 职场文书
2015年清明节扫墓演讲稿
2015/03/18 职场文书
2015年法务工作总结范文
2015/05/23 职场文书
公司借条范本
2015/05/25 职场文书
2016年幼儿园教师师德承诺书
2016/03/25 职场文书