<!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. osx上使用'cd'命令跳转到别名(alias)目录

    在mac上使用windows的共享目录时,在terminal中时法使用cd的,会提示"xxx 不是目录",经过一番的查找,发现了Mac Terminal 'cd' to folde ...

  2. leetcode 实现strStr()

    实现strStr()函数. 给定一个 haystack 字符串和一个 needle 字符串,在 haystack 字符串中找出 needle 字符串出现的第一个位置 (从0开始).如果不存在,则返回 ...

  3. Devexpress Winform初学笔记

    作为一个软件开发人员来说,得有自己的博客,可以用来ZB,哈哈!玩笑话..... 写博客并不仅仅是用来ZB的,他可以用来记录你在技术道路上探索遇到的坎,当然也有提高逼格的次然因素啦!小弟刚入博客园不久, ...

  4. Ubuntu 安装java 1.8

    1.下载java 1.8 地址: ​ http://www.oracle.com/technetwork/java/javase/downloads/jdk8-downloads-2133151.ht ...

  5. Maven新建项目产生Could not calculate build plan: Plugin org.apache.maven.plugins:maven-resource

    需要 打开并修改conf/settings.xml,添加如下内容: <!-- 设置本地仓库位置--> <localRepository>F:\maven\repository& ...

  6. Cookie背景了解

    Cookie的复数形态是Cookies, 英文的意思是小甜饼,小饼干. 类型为小型文本文件, 指某些网站为了辨别用户身份储存在用户本地中断上的数据. 是前网景公司的员工 卢-蒙特利在1993年3月发明 ...

  7. 【OCP-12c】2019年CUUG OCP 071考试题库(74题)

    74.View the exhibit and examine the structure of ORDERS and CUSTOMERS tables. ORDERS Name     Null?  ...

  8. Java - io输入输出流 --转换流

    转换流  转换输出流 OutputStreamWriter: 说明: /* * OutputStreamWriter 这个类的作用 * 就是指定输出流的编码格式 * 这个类的构造方法 需要传递 一个输 ...

  9. Service由浅到深——AIDL的使用方式

    前言 最近有很多朋友问我这个AIDL怎么用,也许由于是工作性质的原因,很多人都没有使用过aidl,所以和他们讲解完以后,感觉对方也是半懂不懂的,所以今天我就从浅到深的分析一下这个aidl具体是怎么用的 ...

  10. lamp-linux3

    LAMP编程之Linux(3) 一.权限管理 1.权限介绍(重点) 在Linux中分别有读.写.执行权限: 读权限: 对于文件夹来说,读权限影响用户是否能够列出目录结构 对于文件来说,读权限影响用户是 ...