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

2024-06-20 02:58

本文主要是介绍[js高手之路]寄生组合式继承的优势,希望对大家解决编程问题提供一定的参考价值,需要的开发者们随着小编来一起学习吧!

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

 1         function Person( uName ){
 2             this.skills = [ 'php', 'javascript' ];
 3             this.userName = uName;
 4         }
 5         Person.prototype.showUserName = function(){
 6             return this.userName;
 7         }
 8         function Teacher ( uName ){
 9             Person.call( this, uName );
10         }
11         Teacher.prototype = new Person();
12 
13         var oT1 = new Teacher( 'ghostwu' );
14         oT1.skills.push( 'linux' );
15         var oT2 = new Teacher( 'ghostwu' );
16         console.log( oT2.skills ); //php,javascript
17         console.log( oT2.showUserName() ); //ghostwu

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

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

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

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

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

 1         function Person( uName ){
 2             this.skills = [ 'php', 'javascript' ];
 3             this.userName = uName;
 4         }
 5         Person.prototype.showUserName = function(){
 6             return this.userName;
 7         }
 8         function Teacher ( uName ){
 9             Person.call( this, uName );
10         }
11 
12         function object( o ){
13             var G = function(){};
14             G.prototype = o;
15             return new G();
16         }
17 
18         function inheritPrototype( subObj, superObj ){
19             var proObj = object( superObj.prototype ); //复制父类superObj的原型对象
20             proObj.constructor = subObj; //constructor指向子类构造函数
21             subObj.prototype = proObj; //再把这个对象给子类的原型对象
22         }
23 
24         inheritPrototype( Teacher, Person );
25 
26         var oT1 = new Teacher( 'ghostwu' );
27         oT1.skills.push( 'linux' );
28         var oT2 = new Teacher( 'ghostwu' );
29         console.log( oT2.skills ); //php,javascript
30         console.log( oT2.showUserName() ); //ghostwu

 

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

 

这篇关于[js高手之路]寄生组合式继承的优势的文章就介绍到这儿,希望我们推荐的文章对编程师们有所帮助!



http://www.chinasem.cn/article/1076915

相关文章

关于C++中的虚拟继承的一些总结(虚拟继承,覆盖,派生,隐藏)

1.为什么要引入虚拟继承 虚拟继承是多重继承中特有的概念。虚拟基类是为解决多重继承而出现的。如:类D继承自类B1、B2,而类B1、B2都继承自类A,因此在类D中两次出现类A中的变量和函数。为了节省内存空间,可以将B1、B2对A的继承定义为虚拟继承,而A就成了虚拟基类。实现的代码如下: class A class B1:public virtual A; class B2:pu

js+css二级导航

效果 <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN""http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"><html xmlns="http://www.w3.org/1999/xhtml"><head><meta http-equiv="Con

简鹿文件批量重命名:一款文件批量改名高手都在用的工具

作为 IT 行业的搬砖民工,互联网的数据量爆炸性增长,文件管理成为了一项日益重要的任务。"简鹿文件批量重命名"应运而生,旨在为用户提供一个高效、灵活的解决方案,以应对繁琐的文件命名、排序、创建及属性修改等挑战。 这款软件凭借其一键式操作、强大的自定义规则导入、以及全面的批量处理能力,极大地简化了文件管理流程,尤其适合处理大量文件的个人用户及企业环境,是提高工作效率、保持文件系统整洁的得力助手

js小题:通过字符串执行同名变量怎么做

在JavaScript中,你不能直接使用一个字符串来直接引用一个变量,因为JavaScript是一种静态类型语言(尽管它的类型在运行时可以变化),变量的名字在编译时就被确定了。但是,有几种方法可以实现类似的功能: 使用对象(或Map)来存储变量: 你可以使用一个对象来存储你的变量,然后使用字符串作为键来访问这些变量。 let myVars = { 'var1': 'Hello', 'var

图形编辑器基于Paper.js教程03:认识Paper.js中的所有类

先来认一下Paper的资源对象,小弟有哪些,有个整体的认识。认个脸。 在Paper.js的 官方文档中类大致有如下这些: 基类: ProjectViewItemPointToolSizeSegmentRectangleCurveCurveLocationMatrixColorStyleTweenToolEventGradientGradientStopEvent 二级或三级类 继承Ite

HTML文档插入JS代码的几种方法

在HTML文档里嵌入客户端JavaScript代码有4中方法: 1.内联,放置在< script>和标签对之间。 2.放置在由< script>标签的src属性指定的外部文件中。 3.放置在HTML事件处理程序中,该事件处理程序由onclick或onmouseover这样的HTML属性值指定。 4.放在一个URL里,这个URL使用特殊的“javascript:”协议。 在JS编程中,主张

第三十七章 添加和使用自定义标题元素 - 自定义标头的继承

文章目录 第三十七章 添加和使用自定义标题元素 - 自定义标头的继承自定义标头的继承示例 在 `SOAPHEADERS` 参数中指定支持的标头元素自定义标头的继承 第三十七章 添加和使用自定义标题元素 - 自定义标头的继承 自定义标头的继承 如果创建此Web 服务的子类,该子类将继承不特定于方法的标头信息 — 包含在 <request> 或 <response> 元素中的标头信

js 正则表达式出现问题

帮同事写个页面,出现正则表达式不管怎么改都没法匹配的情况。。。。 reg = /^sy[0-9]+$/i; if(rtx.match(reg) == null){ alert("请输入正确的RTX账号!"); return false; } 因为之前一直用的是 reg ="/^sy[0-9]+$/i"; 写PHP写习惯了。。外面多写了两个双引号……T.T 改

bootstrap和JS相关

下表列出了模态框中要用到事件。这些事件可在函数中当钩子使用。 bootstrap 显示隐藏div $('.show-info').click(function () {var show = $(this).data('show');if(show =='all'){$('#creative').show();$('#plan').show();$('#plan').attr('class','

sublime配置node.js

1、下载Nodejs插件,下载地址为: https://github.com/tanepiper/SublimeText-Nodejs(见本人网盘) 下载zip压缩包后解压,文件名改为Nodejs 2、打开Sublime Text3,点击菜单“Perferences” =>“Browse Packages”打开“Packages”文件夹,并将第1部的Nodejs文件夹剪切进来 3