js设计模式(3)---桥接模式
0.前言
看设计模式比较痛苦,一则是自己经验尚浅,不能体会到使用这些设计模式的益处;二则是不能很好把握使用这些设计模式的时机。所以这一部分看得断断续续,拖拖拉拉,为了了却这快心病,决定最近一口气看完几种常见的设计模式。今天就从桥接模式开始吧。
1.使用情况
最常用于事件监控上,也通过桥接联接多个类
1.1、事件监控
//错误的方式
//这个API根据事件监听器回调函数的工作机制,事件对象被作为参数传递给这个函数。本例中并没有使用这个参数,而只是从this对象获取ID。
addEvent(element,'click',getBeerById);
function(e){
var id =this.id;
asyncRequest('GET','beer.url?id='+ id,function(resp){
//Callback response
console.log('Requested Beer: '+ resp.responseText);
});
} //好的方式
//从逻辑上分析,把id传给getBeerById函数式合情理的,且回应结果总是通过一个毁掉函数返回。这么理解,我们现在做的是针对接口而不是实现进行编程,用桥梁模式把抽象隔离开来。
function getBeerById(id,callback){
asyncRequest('GET','beer.url?id='+ id,function(resp){
callback(resp.responseText)
});
}
addEvent(element,'click',getBeerByIdBridge);
function getBeerByIdBridge(e){
getBeerById(this.id,function(beer){
console.log('Requested Beer: '+ beer);
});
}
1.2、联接多个类
var Class1 = function(a,b,c){
this.a = a;
this.b = b;
this.c = c;
}
var Class2 = function(d){
this.d = d;
}
var BridgeClass = function(a,b,c,d){
this.one = new Class1(a,b,c);
this.two = new Class2(d);
}
这里使用桥接模式是为了让Class1、Class2能够独立于BridgeClass而发生改变。
2.桥接的利与弊
2.1利:弱化了代码之间的耦合,将抽象和其实现分离,便于二者独立变化、让API更加健壮,有利于分层,提高组件的模块化程度;提高可拓性。
2.3弊:增加开发成本,在性能方面可能会有所降低。
3.个人理解
1.桥接模式可以将抽象和其实现分离,方便他们独立变化;
2.主要应用情况是事件监听,将事件处理函数的抽象部分与实现部分分离,也就是抽像部分只是提供一个接口,具体的实现由桥接函数来实现;
3.好处:弱化了代码之间的耦合,有利于代码拓展
4.举例:
var forEach = function(arr,fn){
var result = [];
for(var i=0;len= arr.length){
result.push(fn.call(this,i,arr[i]));
}
return result;
}
function deal(){
var arr = [1,2,3,4,5];
var b = forEach(arr,function(i,n){
return n*n;
})
}
js设计模式(3)---桥接模式的更多相关文章
- JS设计模式——8.桥接模式
桥接模式的用途 在实现API的时候,桥接模式非常有用. 在设计一个JavaScript API的时候,可以用这个模式来弱化它与使用它的类和对象之间的耦合. 示例:事件监听器 桥接模式最常见和实际的应用 ...
- JS设计模式——5.单体模式
JS设计模式——5.单体模式 http://www.cnblogs.com/JChen666/p/3610585.html 单体模式的优势 用了这么久的单体模式,竟全然不知!用它具体有哪些好处呢? ...
- 乐在其中设计模式(C#) - 桥接模式(Bridge Pattern)
原文:乐在其中设计模式(C#) - 桥接模式(Bridge Pattern) [索引页][源码下载] 乐在其中设计模式(C#) - 桥接模式(Bridge Pattern) 作者:webabcd 介绍 ...
- java面试题之----jdbc中使用的设计模式(桥接模式)
1.JDBC(JavaDatabase Connectivity) JDBC是以统一方式访问数据库的API. 它提供了独立于平台的数据库访问,也就是说,有了JDBC API,我们就不必为访问Oracl ...
- php设计模式之桥接模式
php设计模式之桥接模式 一.概述 桥接模式:将两个原本不相关的类结合在一起,然后利用两个类中的方法和属性,输出一份新的结果. 其实就是讲不相关的东西通过类(本例中是SendInfo)结合在一起,从而 ...
- js设计模式——7.备忘录模式
js设计模式——7.备忘录模式 /*js设计模式——备忘录模式*/ // 备忘类 class Memento { constructor(content) { this.content = conte ...
- js设计模式——6.模板方法模式与职责链模式
js设计模式——6.模板方法模式与职责链模式 职责链模式
- js设计模式——5.状态模式
js设计模式——5.状态模式 代码演示 /*js设计模式——状态模式*/ // 状态(红灯,黄灯,绿灯) class State { constructor(color) { this.color = ...
- js设计模式——4.迭代器模式
js设计模式——4.迭代器模式 代码演示 /*js设计模式——迭代器模式*/ class Iterator { constructor(container) { this.list = contain ...
随机推荐
- Linux服务器集群系统(四)--转
引用地址:http://www.linuxvirtualserver.org/zh/lvs4.html LVS集群的负载调度 章文嵩 (wensong@linux-vs.org) 2002 年 5 月 ...
- debian7 更换GCC版本
最近在编译qt,之前用的是debian6,gcc版本是gcc-4.4,当使用debian7时,编译遇到了很多跟debian6不一样的问题,debian7的默认gcc使用的是gcc-4.7,可能是编译器 ...
- Windows下memcache安装使用
Windows下Memcache安装 随着时间的推移,网上现在能找到的在 Windows下安装 Memcache 的文档大多已经过时.雪峰这里再简要介绍一下当下最新版的安装和配置方法. Memcach ...
- IOS UITableView Group&Section
UItableView 根据数据结构不同 会有不同样式 关键在两个代理 tableviewdelegate&tabledatasourse 下面代码是我实施的Group 在模拟器中 ios6. ...
- PHP常用文件函数和目录函数整理
一.常用文件函数库 1.basename(); -- 返回路径中的文件名部分. string basename ( string $path [, string $suffix ] ) //给出一个包 ...
- [经典算法] 排列组合-N元素集合的M元素子集
题目说明: 假设有个集合拥有n个元素,任意的从集合中取出m个元素,则这m个元素所形成的可能子集有那些? 题目解析: 假设有5个元素的集合,取出3个元素的可能子集如下: {1 2 3}.{1 2 4 } ...
- hdu 1228 A+B 字符串处理 超级大水题
中文意思不解释. 很水,我本来想用switch处理字符串,然后编译不通过...原来switch只能处理整数型的啊,我都忘了. 然后就有了很挫的一大串if代码了... 代码: #include < ...
- Oracle基础(八) 数据完整性
一.数据完整性 数据完整性要求数据库中的数据具有准确性.准确性是通过数据库表的设计和约束来实现的.为了实现数据完整性,数据库需要做两方面的工作: 确保每行的数据符合要求. 确保每列的数据符合要求. 为 ...
- linux 命令行发送邮件及附件
环境 本机安装sendmail了, 但是没有启动. 其他机器上有mail server, 并且已经把本机加到open relay列表中了, 可以通过该mail server发送邮件.做法如下:1. 安 ...
- CSS3--幽灵按钮特效(实例)
先预览效果 其中用到了CSS3的Transition属性:设置动画时间.效果:Transform属性:设置元素旋转.位移:box-sizing属性:以特定的方式定义某个区域的特定元素: 制作小三角方法 ...