什么是“寄生组合式继承”?
通过借用构造函数来继承属性,通过原型链的混成形式来继承方法。构造函数 + 原型链。
寄生组合式继承是引用类型最理想的继承范式。
寄生组合式继承的基本模式
function inheritPrototype(subType, superType) {
//创建对象
var prototype = Object(superType.prototype);
//增强对象
prototype.constructor = subType;
//制定对象
subType.prototype = prototype;
}
函数内部的过程:
第一步,创建超类原型的一个副本;
第二步,创建的副本添加constructor属性,从而弥补因重写原型而失去的默认的constructor属性;
第三步,将新创建的对象(即副本)赋值给子类型的原型。
实例
function SuperType(name) {
this.name = name;
this.colors = ["red", "blue", "green"];
}
SuperType.prototype.sayName = function() {
alert(this.name);
};
function SubType(name, age) {
SuperType.call(this, name);
this.age = age;
}
inheritPrototype(SubType, SuperType);
SubType.prototype.sayAge = function() {
alert(this.age);
};
YUI的寄生组合式继承
//定义
function extend(subClass,superClass){
var F = function(){};
F.prototype = superClass.prototype;
subClass.prototype = new F(); //创建超类的一个副本,本质是执行对给定对象的浅复制
subClass.prototype.constructor = subClass; //原来constructor指向superClass,现在改指成subClass本身
subClass.superclass = superClass.prototype;//加多了个属性指向父类本身以便调用父类函数
if(superClass.prototype.constructor == Object.prototype.constructor) {//新创建的属性对象会指向Object,因此要重写指向本身
superClass.prototype.constructor = superClass;
}
}
//应用
function Person(name) {
this.name = name;
}
Person.prototype.sayName = function() {
alert(this.name);
};
function Chinese(name,job) {
Person.call(this, name);
this.job = job;
}
extend(Chinese, Person);
Chinese.prototype.sayJob = function() {
alert(this.job);
};
var c = new Chinese("MirrorAvatar", "coder");
alert(c.sayName()); //MirrorAvatar
参考资料:
- 《JavaScript高级程序设计》
- JS类式继承
相关推荐
《YUI使用文档》汉语版是一份详细的YUI学习材料,它涵盖了这个JavaScript库的核心功能和使用方法。YUI,全称Yahoo! User Interface Library,是Yahoo开发的一个开放源代码的JavaScript库,旨在帮助开发者创建交互式...
**YUI-EXT使用详解** YUI-EXT是基于Yahoo! User Interface Library (YUI)的一个扩展库,专为构建富互联网应用程序(RIA)而设计。YUI-EXT提供了许多高级组件,如表格、菜单、窗口、表单、布局管理器等,极大地丰富...
YUI3也考虑到了移动设备的兼容性,提供了响应式设计的支持。例如,“querystring”模块用于解析和序列化查询字符串,这对于适应不同屏幕尺寸和设备类型的应用来说是必不可少的。 8. **国际化支持** “i18n”模块...
2. **响应式设计**:YUI提供了响应式设计工具,如Grids布局系统,能根据屏幕尺寸自动调整页面布局,适应各种设备。 3. **事件处理**:YUI的事件系统强大,支持事件绑定、解绑、事件冒泡等,使得用户交互编程简单易行...
例如,例子中可能用到了“yui-button”来创建交互式的按钮,或者使用“yui-menu”构建导航菜单,这些组件大大简化了开发工作,提升了用户体验。 在实际开发中,YUI的调试工具也非常实用。YUI Logger可以帮助开发者...
9. **响应式设计**:YUI3.6支持响应式布局,帮助开发者构建适应不同设备和屏幕尺寸的应用。 10. **国际化与本地化**:提供多语言支持,便于实现应用的全球化。 在压缩包中的示例,你可以看到如何实际应用这些功能...
2. **响应式设计支持**:在YUI 3.0.0中,雅虎增强了对响应式设计的支持,提供了多种工具和组件,如Grids布局系统,帮助开发者创建适应不同屏幕尺寸和设备的网页。 3. **事件系统**:YUI 3.0.0提供了一个强大的事件...
--charset <charset> 指定读取输入文件使用的编码 --line-break <column> 在指定的列后插入一个 line-bread 符号 -v, --verbose 显示info和warn级别的信息 -o <file> 指定输出文件。默认输出是控制台。 ...
是一组工具和控件,用JavaScript写成, 为的是用DOM 脚本,DHTML和AJAX等技术创建丰富的网页交互式应用程序。 YUI 基于BSD协议,对所有的使用方式都是免费的。YUI 项目包括YUI 库和两个创建时工具: YUI Compressor ...
YUI是一个开源的JavaScript库,它包含了丰富的工具和组件,用于创建交互式、高性能的Web应用。这个表单验证器是YUI库中的一个关键部分,用于确保用户在提交表单时输入的数据符合预设的规则和格式,从而提高数据质量...
- **Event需要的引入**:通常需要先引入YUI的Event模块才能使用这些工具。 - **Event工具集提供的方法**:包括`YAHOO.util.Event.addListener`, `YAHOO.util.Event.removeListener`, `YAHOO.util.Event.on`, `...
四、YUI的使用与学习 学习YUI,首先需要掌握JavaScript基础知识,然后通过官方文档了解YUI的模块化结构和API。官方文档详细且全面,包含了大量的示例代码,便于开发者快速上手。同时,社区资源丰富,有许多优秀的...
在"YUI js方法使用例子"中,我们可以通过以下步骤来体验YUI的强大功能: 1. **引入YUI**:在HTML文件中,通过`<script>`标签引入YUI库,可以选择性地加载所需模块。 ```html <script src="http://yui.yahooapis....
这个压缩包很可能是包含了一系列的代码示例,演示了如何在实际项目中使用YUI 3.0的各种组件和功能。 【描述】提到这是一个"Examples"集合,并提醒用户这不是"spring2.0中文参考手册.pdf",暗示了压缩包的内容与...
在YUI 3.10.3的压缩包中,它将指导用户如何开始使用这个库。 - **docs**:文档目录,可能包含了YUI 3.10.3的API参考、教程、最佳实践等详细文档,是开发者学习和查阅API的重要资源。 - **tests**:测试目录,通常...
描述中"Ajax源码(javascript)使用它可以构建更为动态和响应更灵敏的Web应用程序"指出,这个压缩包包含的是YUI中的AJAX源码,这些源码是用JavaScript编写的,可以帮助开发者创建具有高度交互性、无需刷新页面即可更新...
在使用yuicompressor时,开发者可以通过命令行或者集成到IDE(如IntelliJ IDEA,简称Idea)中来操作。对于Idea用户,可以通过安装第三方插件实现yuicompressor的集成,这样在编译项目时,可以直接对JavaScript和CSS...
9. **响应式设计支持**:YUI3包含了一些工具,如Resize Utility,帮助开发者实现响应式设计,使应用在不同设备和屏幕尺寸上都能良好运行。 10. **可定制性**:YUI3允许开发者根据项目需求选择需要的模块,通过构建...
YUI安装文档.doc 提供了详细的安装和使用指南,包括如何配置环境、运行工具以及解决常见问题的方法。对于初次使用者来说,这份文档是了解和上手YUI打包工具的重要参考资料。 yuicompressor-2.4.7.jar 和 yui...
YUI 2 is a JavaScript and CSS library with more than 30 unique components including low-level DOM utilities and high-level user-interface widgets. Currently at version 2.9.0, YUI 2 is robust, proven, ...