<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>Javascript高级语法11-桥梁模式</title>
</head>
<body>
<script>
/*桥梁模式:把将抽象与实现隔离开来,以便两者单独的变化。
* 这种模式对于javascript中常见的事件驱动编程有很大好处。
*/ //自己的类库
function addEvent(obj,type,fn){
if(obj.addEventListener){
obj.addEventListener(type,fn,false);
}else if(obj.attachEvent){
obj["e"+type+fn]=fn;
obj[type+fn] = function(){
obj["e"+type+fn]();
}
obj.attachEvent("on"+type,obj[type+fn]);
}else{
obj["on"+type] = obj["e"+type+fn];
}
} function demo1(){
//一个页面选择宠物的例子
button.addEvent(element,"click",getPetByName);
function getPetByName(e){
var id = this.id;
asyncRequest("GET","pet.action?id="+id,function(pet){
console.log("request pet" + pet.responseText)
})
}
/*上面的做法是你在页面有一个按钮,单击会出发后面请求
* 如果要进行单元测试:1.用户登录 2.找到你的这个页面 3.单击按钮
* 如果需要进行效能层次上的单元测试,是很难进行并发测试的。
*/
//第二种做法 用简单的桥梁模式来解决
function getPetByName(id,callback){
var id = this.id;
asyncRequest("GET","pet.action?id="+id,function(pet){
callback(pet);
})
}
//定义一个桥梁将抽象和实现相互联系在一起
addEvent(element,"click",getPetByNameBridge);
function getPetByNameBridge(){
getPetByName(this.id,function(pet){
console.log("request pet" + pet.responseText);
})
}
/*这种做法使API和展现层完全分离
* API和展现层可以灵活变动。
* 这个模式在Extjs项目开发时候非常的常用。
*
* 桥梁模式的其他用途:
* 特权函数:当你的接口过于复杂的时候,把原本复杂的接口用桥梁的模式抽取出一大部分函数整合起来
* 使之客户端更容易的调用。
*/ }
// demo1();//demo1是伪代码 demo2是实例 function demo2(){
// 特权函数
var p= function(){
var add=function(){
//进行复杂的数学操作
}
//这是一个信息全封闭的类,它的内部进行复杂的业务操作
//建立一个特权函数,让它调用起来更方便
this.bridge = function(){
return {
bridgeAdd:function(){
//执行前
add(3,3)
//执行后
}
}
}
} //桥梁还可以把多个类进行桥接(链接)
var class1 = function(a,b){
this.a = a;
this.b = b;
}
var class2 = function(c,d){
this.c = c;
this.d = d;
}
var bridgeClass = function(){
this.one = new class1(1,2);
this.two = new class2(3,4);
}
/*问,这个理念不是门面模式吗?
* 不是,他的目的是在于class1和class2能独立的修改,使之完全松耦合。
* 而门面模式的意义在于调用的方便。
*/ } </script>
</body>
</html>

JavaScript设计模式-11.桥梁模式的更多相关文章

  1. 再起航,我的学习笔记之JavaScript设计模式11(外观模式)

    经过一段时间的学习与分享,我们对创建型设计模式已经有了一定的认识,未来的一段时间里我们将展开新的篇章,开始迈入结构性设计模式的学习. 结构性设计模式与创建型设计模式不同,结构性设计模式更偏向于关注如何 ...

  2. JavaScript设计模式之----组合模式

    javascript设计模式之组合模式 介绍 组合模式是一种专门为创建Web上的动态用户界面而量身制定的模式.使用这种模式可以用一条命令在多个对象上激发复杂的或递归的行为.这可以简化粘合性代码,使其更 ...

  3. 从ES6重新认识JavaScript设计模式(三): 建造者模式

    1 什么是建造者模式? 建造者模式(Builder)是将一个复杂对象的构建层与其表示层相互分离,同样的构建过程可采用不同的表示. 建造者模式的特点是分步构建一个复杂的对象,可以用不同组合或顺序建造出不 ...

  4. JavaScript设计模式之策略模式(学习笔记)

    在网上搜索“为什么MVC不是一种设计模式呢?”其中有解答:MVC其实是三个经典设计模式的演变:观察者模式(Observer).策略模式(Strategy).组合模式(Composite).所以我今天选 ...

  5. 再起航,我的学习笔记之JavaScript设计模式08(建造者模式)

    我的学习笔记是根据我的学习情况来定期更新的,预计2-3天更新一章,主要是给大家分享一下,我所学到的知识,如果有什么错误请在评论中指点出来,我一定虚心接受,那么废话不多说开始我们今天的学习分享吧! 前几 ...

  6. 再起航,我的学习笔记之JavaScript设计模式09(原型模式)

    我的学习笔记是根据我的学习情况来定期更新的,预计2-3天更新一章,主要是给大家分享一下,我所学到的知识,如果有什么错误请在评论中指点出来,我一定虚心接受,那么废话不多说开始我们今天的学习分享吧! 我们 ...

  7. 再起航,我的学习笔记之JavaScript设计模式14(桥接模式)

    桥接模式 桥接模式(Bridge): 在系统沿着多个维度变化的同时,又不增加其复杂度并已达到解耦 从定义上看桥接模式的定义十分难以理解,那么我们来通过示例来演示什么是桥接模式. 现在我们需要做一个导航 ...

  8. 再起航,我的学习笔记之JavaScript设计模式15(组合模式)

    组合模式 组合模式(Composite): 又称部分-整体模式,将对象组合成树形结构以表示"部分整体"的层次结构.组合模式使得用户对单个对象和组合对象的使用具有一致性. 如果有一个 ...

  9. 再起航,我的学习笔记之JavaScript设计模式17(模板方法模式)

    模板方法模式 由模板方法模式开始我们正式告别结构型设计模式,开始行为型设计模式的学习分享 行为型设计模式用于不同对象之间职责划分或算法抽象,行为型设计模式不仅仅涉及类和对象,还涉及类或对象之间的交流模 ...

随机推荐

  1. CodeForces - 669D——(思维题)

    Little Artem is fond of dancing. Most of all dances Artem likes rueda — Cuban dance that is danced b ...

  2. 读<走出软件作坊>有感

    1.成功的人都是在不可能完成任务的情况下完成的,成功的人也从来不会抱怨客观条件多么糟糕. 2.公司给你的资源,永远小于你做事需要的资源,这就是现实,就这么多人,就这样的素质,必须在现状中想出做事的办法 ...

  3. java中父类的静态方法不能被重写

    Java中父类的静态方法确实不能被重写的,但是有的人可能去做实验发现在子类中去重写父类static方法时,并没什么问题.这里我来具体解释下. public class Parent { public ...

  4. [leetcode] 13. Remove Duplicates from Sorted List

    这个题目其实不难的,主要是我C++的水平太差了,链表那里绊了好久,但是又不像用python,所以还是强行上了. 题目如下: Given a sorted linked list, delete all ...

  5. java性能分析工具 jconsole.exe

    通过 Java visualMv结合 jconsole.exe   工具即可查看如图所示(Jconsole在JDK文件夹内,非JRE文件夹) 在Java Visualvm工具里面安装JTA插件,分析线 ...

  6. vue实现首页导航切换不同路由的方式(二)【使用vuex实现的】

    <nav> <!-- 导航栏 --> <div class="indexNavOut"> <div class="indexNa ...

  7. Mysql部署

    1. 下载 Mysql 版本为: mysql-5.6.43-linux-glibc2.12-x86_64.tar.gz (注意:下载二进制文件)  存放位置: /usr/local 2. 检查机器上 ...

  8. Solr中的概念:分析器(analyzer)、字符过滤器(character filter)、分词器(Tokenizer)、词元过滤器(Token Filter)、 词干化(Stemming)

    文本中包含许多文本处理步骤,比如:分词,大写转小写,词干化,同义词转化和许多的文本处理. 文本分析既用于索引时对一文本域的处理,也用于查询时查询字符串的文本处理.文本处理对搜索引擎的搜索结果有着重要的 ...

  9. C#语言各个版本特性(二)

    二.排序Product 1.按名称对产品进行排序,以特定顺序显示一个列表的最简单方式就是先将列表排序,再遍历并显示其中的项. C#1.1 使用IComparer对ArrayList进行排序 produ ...

  10. UWP多线程枚举安全的List

    最近在做windows runtime下APP开发的工作.在Service层请求返回后,往往会通过回调的形式来通知UI更新数据.多个线程操作经常出现foreach抛出异常:System.Invalid ...