JavaScript设计模式--桥梁模式--引入
1.使用情况
(1)事件的监控
#1,利用页面的button来选择宠物的例子(思路)
button.addEvent(element,"click",getPetByBame);
function getPetByBame(e){
var id = this.id;
asyncRquest("GET",'pet.action?id='+id,function(pet){
consols.log("request pet"+pet.resopnseText)
})
}
#2,addEvent函数
/*obj:需要增加事件的对象
* type:事件名称
* fn:执行事件的函数
* */
function addEvent(obj,type,fn){//addEvent:为某个文档节点增加事件的方法
if(obj.addEventListener){//Mozilla中:
obj.addEventListener(type,fn,false);
}else if(obj.attachEvent){//IE中:
obj["e"+type+fn] = fn;
obj[type+fn] = function(){
obj["e"+type+fn]()
}
obj.attachEvent("on"+type,fn)
}
}
总结:该种方式对于单元测试很难进行
改进为用简单的桥梁模式来解决
#1,后台中的api
function getPetByBame(id,callBack){
sayncRquest("GET",'url?id='+id,function(pet){
callBack(pet)
})
#2,桥梁
//定义一个桥梁叫抽象和实现相互联系在一起
addEvent(element,"click",getPetByNameBridge)
function getPetByNameBridge(){
getPetByBame(this.id,function(pet){
consols.log("request pet"+pet.resopnseText);
})
}
总结:这种做法使API和展现层完全分离,API和展现层可以灵活的变动。
(2)特权函数
//特权函数
var privilege=function () {
//信息全封闭,内部业务逻辑复杂,做成一个特权函数,使调用方便
var complex=function (x,y) {
//复杂的数学处理
} this.bridge=function () { //提供公共接口,返回一个单体
return {
bridgeAdd:function () {
//处理前
complex(,);
//处理后
} }
}
}
(3)多个类的连接
//多个类的连接
var class1=function (a,b) {
this.a=a;
this.b=b;
}
var class2=function (e) {
this.e=e;
}
//桥梁的连接
var bridgeClass=function () {
this.one=new Class1(,);
this.two=new Class1();
}
//目的:两个类能独立的修改,而门面的意义在于调用方便
桥梁模式:

JavaScript设计模式--桥梁模式--引入的更多相关文章
- JavaScript设计模式--桥梁模式--XHR连接队列
针对该模式的例子现在不是很理解,写下来慢慢熟悉. 们要构建一个队列,队列里存放了很多ajax请求,使用队列(queue)主要是因为要确保先加入的请求先被处理.任何时候,我们可以暂停请求.删除请求.重试 ...
- JavaScript设计模式 - 代理模式
代理模式是为一个对象提供一个代用品或占位符,以便控制对它的访问 代理模式的用处(个人理解):为了保障当前对象的单一职责(相对独立性),而需要创建另一个对象来处理调用当前对象之前的一些逻辑以提高代码的效 ...
- javascript设计模式——组合模式
前面的话 在程序设计中,有一些和“事物是由相似的子事物构成”类似的思想.组合模式就是用小的子对象来构建更大的对象,而这些小的子对象本身也许是由更小的“孙对象”构成的.本文将详细介绍组合模式 宏命令 宏 ...
- javascript 设计模式-----策略模式
在<javascript设计模式>中,作者并没有向我们介绍策略模式,然而它却是一种在开发中十分常见的设计模式.最常见的就是当我们遇到一个复杂的表单验证的时候,常常需要编写一大段的if和el ...
- 说说设计模式~桥梁模式(Bridge)
返回目录 在软件系统中,某些类型由于自身的逻辑,它具有两个或多个维度的变化,那么如何应对这种“多维度的变化”?如何利用面向对象的技术来使得该类型能够轻松的沿着多个方向进行变化,而又不引入额外的复杂度? ...
- JavaScript设计模式 - 迭代器模式
迭代器模式是指提供一种方法顺序访问一个聚合对象中的各个元素,而又不需要暴露该对象的内部表示. 迭代器模式可以把迭代的过程从业务逻辑中分离出来,在使用迭代器模式之后,即使不关心对象的内部构造,也可以按顺 ...
- Java设计模式—桥梁模式
终于又碰到了一个简单点的模式了. 桥梁模式也叫做桥接模式,定义如下: 将抽象和实现解耦,使得两者可以独立地变化. 这句话也太难理解了,桥梁模式是为了解决类继承的缺点而设计 ...
- 设计模式--桥梁模式C++实现
1定义 将抽象和实现解耦,使得两者可以独立变化 2类图 3实现 #pragma once #include<iostream> using namespace std; class Imp ...
- JavaScript设计模式-组合模式(表单应用实现)
书读百遍其义自见 <JavaScript设计模式>一书组合模式在表单中应用,我问你答答案. 注:小编自己根据书中的栗子码的答案,如有错误,请留言斧正. 另:如有转载请注明出处,谢谢啦 &l ...
随机推荐
- 说说JSON和JSONP,也许你会豁然开朗,含jQuery用例(转载)
前言: 说到AJAX就会不可避免的面临两个问题,第一个是AJAX以何种格式来交换数据?第二个是跨域的需求如何解决?这两个问题目前都有不同的解决方案,比如数据可以用自定义字符串或者用XML来描述,跨域 ...
- Linux通过Shell对文件自动进行远程拷贝备份
在执行计划任务拷贝文件的时候,用scp命令需要输入密码,这里用公共密钥的方式实现密码的自动输入. 具体操作: 要求:把192.168.0.2机上的test.tar拷贝到192.168.0.3机器的上 ...
- Vue组件通信(传值)
先介绍一下什么是组件把: 创建组件的两种方式: 全局组件 // 组件就是vue的一个拓展实例 let component=Vue.extend({ data(){ return{ //与vue实例中的 ...
- mysql 的类型转换函数cast的用法
CAST(expr AS type), CONVERT(expr,type) , CONVERT(expr USING transcoding_name) CAST() ...
- UVA 1664 Conquer a New Region (并查集+贪心)
并查集的一道比较考想法的题 题意:给你n个点,接着给你n-1条边形成一颗生成树,每条边都有一个权值.求的是以一个点作为特殊点,并求出从此点出发到其他每个点的条件边权的总和最大,条件边权就是:起点到终点 ...
- C++(十)— 字符串进行插入、替换、查找、删除操作、substr
1.C++中对字符串进行插入.替换.删除操作 #include<iostream> #include<algorithm> #include<stdio.h> # ...
- mysql连接超时问题
前几天使用个脚本不停的查看redis队列中的事件.如果有则把事件取出来,然后进行一些数据库操作. 后来发现,每天的第一次有事件时都会到导致,找不到数据. 后来定位到问题,是mysql在连接长时间无活动 ...
- Selenium-使用firepath识别元素
利用firepath进行元素识别提前已经安装好firebug和firepath 比如,打开http://www.baidu.com 1.按下F12 2.点击如图的位置 3.选择元素,可以定位出元素的属 ...
- hdu-5635 LCP Array
LCP Array Time Limit: 4000/2000 MS (Java/Others) Memory Limit: 131072/131072 K (Java/Others)Total ...
- 【leetcode刷题笔记】Integer to Roman
Given an integer, convert it to a roman numeral. Input is guaranteed to be within the range from 1 t ...