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设计模式--桥梁模式--引入的更多相关文章

  1. JavaScript设计模式--桥梁模式--XHR连接队列

    针对该模式的例子现在不是很理解,写下来慢慢熟悉. 们要构建一个队列,队列里存放了很多ajax请求,使用队列(queue)主要是因为要确保先加入的请求先被处理.任何时候,我们可以暂停请求.删除请求.重试 ...

  2. JavaScript设计模式 - 代理模式

    代理模式是为一个对象提供一个代用品或占位符,以便控制对它的访问 代理模式的用处(个人理解):为了保障当前对象的单一职责(相对独立性),而需要创建另一个对象来处理调用当前对象之前的一些逻辑以提高代码的效 ...

  3. javascript设计模式——组合模式

    前面的话 在程序设计中,有一些和“事物是由相似的子事物构成”类似的思想.组合模式就是用小的子对象来构建更大的对象,而这些小的子对象本身也许是由更小的“孙对象”构成的.本文将详细介绍组合模式 宏命令 宏 ...

  4. javascript 设计模式-----策略模式

    在<javascript设计模式>中,作者并没有向我们介绍策略模式,然而它却是一种在开发中十分常见的设计模式.最常见的就是当我们遇到一个复杂的表单验证的时候,常常需要编写一大段的if和el ...

  5. 说说设计模式~桥梁模式(Bridge)

    返回目录 在软件系统中,某些类型由于自身的逻辑,它具有两个或多个维度的变化,那么如何应对这种“多维度的变化”?如何利用面向对象的技术来使得该类型能够轻松的沿着多个方向进行变化,而又不引入额外的复杂度? ...

  6. JavaScript设计模式 - 迭代器模式

    迭代器模式是指提供一种方法顺序访问一个聚合对象中的各个元素,而又不需要暴露该对象的内部表示. 迭代器模式可以把迭代的过程从业务逻辑中分离出来,在使用迭代器模式之后,即使不关心对象的内部构造,也可以按顺 ...

  7. Java设计模式—桥梁模式

    终于又碰到了一个简单点的模式了. 桥梁模式也叫做桥接模式,定义如下:                将抽象和实现解耦,使得两者可以独立地变化. 这句话也太难理解了,桥梁模式是为了解决类继承的缺点而设计 ...

  8. 设计模式--桥梁模式C++实现

    1定义 将抽象和实现解耦,使得两者可以独立变化 2类图 3实现 #pragma once #include<iostream> using namespace std; class Imp ...

  9. JavaScript设计模式-组合模式(表单应用实现)

    书读百遍其义自见 <JavaScript设计模式>一书组合模式在表单中应用,我问你答答案. 注:小编自己根据书中的栗子码的答案,如有错误,请留言斧正. 另:如有转载请注明出处,谢谢啦 &l ...

随机推荐

  1. PhpStorm编辑器

    PhpStorm编辑文字过程中发现其有二种方式, 可以通过按“Insert”键进行转换. 第一种是直接在光标后面修改 第二种是直接在光标处修改 很多编辑器也有类似的输入转换,包括Mac的命令台

  2. 教你如何写一个 Yii2 扩展

    前言 把一系列相关联的功能使用模块开发,好处多多,维护起来很方便,模块还可以单独发布出去,让下一个项目之间使用,真是方便. 下面我就写一个开发扩展的简单教程. Gii gii 自带帮助我们生成一个基本 ...

  3. Mysql的空值与NULL的区别

    Mysql数据库是一个基于结构化数据的开源数据库.SQL语句是MySQL数据库中核心语言.不过在MySQL数据库中执行SQL语句,需要小心两个陷阱. 陷阱一:空值不一定为空 空值是一个比较特殊的字段. ...

  4. 基于WebServices简易网络聊天工具的设计与实现

    基于WebServices简易网络聊天工具的设计与实现 Copyright 朱向洋 Sunsea ALL Right Reserved 一.项目内容 本次课程实现一个类似QQ的网络聊天软件的功能:服务 ...

  5. Spiral Matrix螺旋遍历矩阵

    假定有: [ [ 1, 2, 3 ], [ 4, 5, 6 ], [ 7, 8, 9 ] ] 这样一个数组矩阵,现要求对其进行顺时针方向螺旋形从外至内地遍历,即输出: [1,2,3,6,9,8,7,4 ...

  6. django 之admin后台管理

    数据库 from django.db import models from django.contrib.auth.models import User from django.contrib.aut ...

  7. WebSocket实现Web聊天室

    一.客户端: JS代码如下: /* * 这部分js将websocket封装起来 */ var websocket = null; //判断当前浏览器是否支持WebSocket if ('WebSock ...

  8. Spring Cloud之Feign客户端调用工具

    feign介绍 Feign客户端是一个web声明式http远程调用工具,提供了接口和注解方式进行调用. Spring Cloud 支持 RestTemplate  Fetin Feign客户端实际开发 ...

  9. mac iterm2 安装 lrzsz rz sz命令

    原文:https://blog.csdn.net/jack85986370/article/details/51382077 首先mac自带的终端是不支持lrzsz的,需要下载安装iterm2,下载地 ...

  10. EntityFramework 学习 一 Local Data

    DBSet的Local属性提供简单的从context上下文获取当前已经被跟踪的实体(实体不能被标记为Deleted状态) using System.Data.Entity; class Program ...