javascript模式——Mixin
Mixin是一种扩展收集功能的方式,能提高代码的复用率。
在javascript中,原型可以继承于其它对象的原型,并且可以为任意数量的实例定义属性。可以利用这一点来促进函数的复用。
下面一段代码就是将一些可以被复用的代码利用underscore.js里的_.extend对原型扩展,以实现高复用。
// 一些代码,可以被下面的类混入,
var controls = {
moveForward: function(){
console.log(this.name + ' move forward');
},
moveLeft: function(){
console.log(this.name + ' move left');
},
moveRight: function(){
console.log(this.name + ' move right');
}
} // Car类
function Car(){
this.name = 'car';
this.moveBackward = function(){
console.log(this.name + ' move backward');
}
} // Airplane类
function Airplane(){
this.name = 'airplane';
this.moveUp = function(){
console.log(this.name + ' move up');
}
this.moveDown = function(){
console.log(this.name + ' move down');
}
}
_.extend(Car.prototype, controls);
_.extend(Airplane.prototype, controls); var car = new Car()
car.moveRight(); var airplane = new Airplane()
airplane.moveLeft();
除了使用underscore.js里的方法进行对象扩展,我们也可以自己实现混入功能,像一些有独特需求的,比如指定混入的方法名等等。
// 一些代码,可以被下面的类混入,
var controls = {
moveForward: function(){
console.log(this.name + ' move forward');
},
moveLeft: function(){
console.log(this.name + ' move left');
},
moveRight: function(){
console.log(this.name + ' move right');
}
} // Car类
function Car(){
this.name = 'car';
this.moveBackward = function(){
console.log(this.name + ' move backward');
}
} function mixin( receivingClass, givingClass ) {
// only provide certain methods
if ( arguments[2] ) {
for ( var i = 2, len = arguments.length; i < len; i++ ) {
receivingClass[arguments[i]] = givingClass[arguments[i]];
}
}
} mixin(Car.prototype, controls, 'moveForward'); var car = new Car();
car.moveForward() // car move forward
car.moveLeft() // error:undefined is not a function
javascript模式——Mixin的更多相关文章
- 【读书笔记】读《JavaScript模式》 - 函数复用模式之现代继承模式
现代继承模式可表述为:其他任何不需要以类的方式考虑得模式. 现代继承方式#1 —— 原型继承之无类继承模式 function object(o) { function F() {}; F.protot ...
- javascript 模式(1)——代码复用
程序的开发离不开代码的复用,通过代码复用可以减少开发和维护成本,在谈及代码复用的时候,会首先想到继承性,但继承并不是解决代码复用的唯一方式,还有其他的复用模式比如对象组合.本节将会讲解多种继承模式以实 ...
- 【读书笔记】读《JavaScript模式》 - 函数复用模式之类式继承模式
实现类式继承的目标是通过构造函数Child()获取来自于另外一个构造函数Parent()的属性,从而创建对象. 1.类式继承模式#1 —— 默认方式(原型指向父函数实例) function Paren ...
- 初涉JavaScript模式系列 阶段总结及规划
总结 不知不觉写初涉JavaScript模式系列已经半个月了,没想到把一个个小点进行放大,竟然可以发现这么多东西. 期间生怕对JS的理解不到位而误导各位,读了很多书(个人感觉JS是最难的oo语言),也 ...
- 《javascript模式--by Stoyan Stefanov》书摘--汇总
<javascript模式--by Stoyan Stefanov>书摘--基本技巧 http://www.cnblogs.com/liubei/p/JavascriptModeLog1. ...
- 《JavaScript 模式》知识点小抄本(下)
介绍 最近开始给自己每周订个学习任务,学习结果反馈为一篇文章的输出,做好学习记录. 这一周(02.25-03.03)我定的目标是<JavaScript 模式>的第七章学习一遍,学习结果的反 ...
- 《JavaScript 模式》知识点小抄本(上)
介绍 最近开始给自己每周订个学习任务,学习结果反馈为一篇文章的输出,做好学习记录. 这一周(02.25-03.03)我定的目标是<JavaScript 模式>的第七章学习一遍,学习结果的反 ...
- 【javascript】javascript设计模式mixin模式
概述: Mixin是JavaScript中用的最普遍的模式,几乎所有流行类库都会有Mixin的实现.任意一个对象的全部或部分属性拷贝到另一个对象上. 一 .混合对象 二 .混合类
- 《JavaScript模式》第6章 代码复用模式
@by Ruth92(转载请注明出处) 第6章:代码复用模式 GoF 在其著作中提出的有关创建对象的建议原则: -- 优先使用对象组合,而不是类继承. 传统模式:使用类继承: 现代模式:"类 ...
随机推荐
- js的for in循环和java里的foreach循环的差别
js里的for in循环定义例如以下: for(var variable in obj) { ... } obj能够是一个普通的js对象或者一个数组.假设obj是js对象,那么variable在遍历中 ...
- Maven 工程下 Spring MVC 站点配置 (二) Mybatis数据操作
详细的Spring MVC框架搭配在这个连接中: Maven 工程下 Spring MVC 站点配置 (一) Maven 工程下 Spring MVC 站点配置 (二) Mybatis数据操作 这篇主 ...
- mysql跟踪提交的SQL语句
http://www.cnblogs.com/wuyifu/p/3328024.html
- PHP调用WCF小结
新工作第三周,做了3年多的.Net,突然急转弯做PHP,漂移过弯,速度180迈 由于数据的整合,在项目中不得不使用PHP调用WCF 一头的雾水,网上相关的资料少又少,在phpChina发个帖子,还没有 ...
- Direct2D 几何计算和几何变幻
D2D不仅可以绘制,还可以对多个几何图形对象进行空间运算.这功能应该在GIS界比较吃香. 这些计算包括: 合并几何对象,可以设置求交还是求并,CombineWithGeometry 边界,加宽边界,查 ...
- ckeditor 使用手册
CKEditor使用手册 在使用CKEditor过程中遇到了一些问题,现把它整理成手册,以便随时翻阅. 在页面<head>中引入ckeditor核心文件ckeditor.js <sc ...
- php in_array 和 str_replace
有这样的用法哦 $allow_state_array_invoc = array('store_invoice','invoiceno','invoicerec','invoiceing'); if ...
- lda模型的python实现
LDA(Latent Dirichlet Allocation)是一种文档主题生成模型,最近看了点资料,准备使用python实现一下.至于数学模型相关知识,某度一大堆,这里也给出之前参考过的一个挺详细 ...
- 无意发现vim里插入模式可以借助Alt键输入一些特殊字符
无意发现vim里插入模式可以借助Alt键输入一些特殊字符.如: Alt+w: ÷ Alt+:: » Alt+f : æ Alt+ . : ® Alt+ ? : ¯...
- gl.TexSubImage2D 使用遇到图片翻转的问题
这2天在用gl.TexSubImage2D把几张小图转拼接成大图,如果在渲染物体之前拼接好就没有问题,但在开始渲染物体后拼接就会有问题.后来我做了2件事情来找原因, 1. 用拼好的图来画一个正方形,大 ...