文档章节

javaScript设计模式系列(五) 桥接模式

Say_-no
 Say_-no
发布于 2017/07/24 15:09
字数 524
阅读 2
收藏 0

前言

桥接模式可以用来降低,类和对象之间的耦合度。这个模式也尝尝与其他模式混合使用,所以本文只是举一个单纯啊的桥接模式的例子,综合使用以后会逐步的讲解。

正文

GoF的定义,桥接模式的作用在于将“抽象与其实现隔离开来,以便二者独立的变化”。

现看一个简单的例子,在解释下我对这句画的理解。

现在想要在动物园的查询中心,点击一个动物的图标,就可以查询这个动物的信息。

//点击某个动物的图标
someAnimalIcon.onclick = function(){
  var id = this.id;
  //自定义的一个发起请求的方法,使用到这动物的id
  asynRequest("GET",'zoom.url?id='+id,function(req){
    console.log(req)
  })
}

看起来这个逻辑很完美,但是很容发现,我们只能在浏览器中使用这个方法,因为他被绑定在一个点击事件下,并在点击后获取并使用点击元素的id,可是我们希望任何时候懂可以使用这个方法获取动物的信息,而且如果想做测试的时候,或是在非浏览器环境中运行,那只能祝你好运了,所以这样修改看上去更加的合理。

function getAnimalInfo(id,callback){
    asynRequest("GET",'zoom.url?id='+id,function(req){
      callback(req);
    })
}
function getAnimalInfoBridge(e){
  var id = this.id;
  getAnimalInfo(id,function(AnimalInfo){
     console.log(AnimalInfo);
  })
}
someAnimalIcon.onclick = getAnimalInfoBridge;

最后解释一下最开始的那句话:抽象与其实现隔离开来,以便二者独立的变化。

个人的简单理解是,简单想一下,你在浏览器端写的一个方法,如果不依赖浏览器端的操作(比如给定一个id,而不是获取id后在执行),是否可以执行,如果可以,其实就是实现(方法),抽象(触发条件)已经隔离开。

© 著作权归作者所有

Say_-no
粉丝 1
博文 6
码字总数 9308
作品 0
昆明
私信 提问
《JavaScript设计模式与开发实践》最全知识点汇总大全

系列文章: 《JavaScript设计模式与开发实践》基础篇(1)—— this、call 和 apply 《JavaScript设计模式与开发实践》基础篇(2)—— 闭包和高阶函数 《JavaScript设计模式与开发实践》模式...

嗨呀豆豆呢
01/04
0
0
《JavaScript设计模式与开发实践》原则篇(2)—— 最少知识原则

最少知识原则(LKP)说的是一个软件实体应当尽可能少地与其他实体发生相互作用。这 里的软件实体是一个广义的概念,不仅包括对象,还包括系统、类、模块、函数、变量等。 单一职责原则指导我们...

嗨呀豆豆呢
2018/12/30
0
0
JavaScript设计模式总结

之前看过《JavaScript设计模式与开发实践》这本书,对书中的设计模式和一些相关案例也有了一定的了解,同时把这些设计模式的应用对应在在一些其他的项目中,进行了一些整理,如下仅供参考: ...

jefferyE
03/26
0
0
你需要了解的23种JavaScript设计模式

为什么要学习设计模式? 在许多访谈中,你可能会遇到很多面向对象编程中的接口,抽象类,代理和以及其他与设计模式相关的问题。 一旦了解了设计模式,它会让你轻松应对任何访谈,并可以在你的...

java高级架构牛人
2018/06/02
18
0
《JavaScript设计模式与开发实践》模式篇(12)—— 装饰者模式

在传统的面向对象语言中,给对象添加功能常常使用继承的方式,但是继承的方式并不灵活, 还会带来许多问题:一方面会导致超类和子类之间存在强耦合性,当超类改变时,子类也会随之 改变;另一方...

嗨呀豆豆呢
2018/12/25
0
0

没有更多内容

加载失败,请刷新页面

加载更多

springboot2.0 maven打包分离lib,resources

springboot将工程打包成jar包后,会出现获取classpath下的文件出现测试环境正常而生产环境文件找不到的问题,这是因为 1、在调试过程中,文件是真实存在于磁盘的某个目录。此时通过获取文件路...

陈俊凯
今天
6
0
BootStrap

一、BootStrap 简洁、直观、强悍的前端开发框架,让web开发更加迅速、简单 中文镜像网站:http://www.bootcss.com 用于开发响应式布局、移动设备优先的WEB项目 1、使用boot 创建文件夹,在文...

wytao1995
今天
10
0
小知识:讲述Linux命令别名与资源文件的区别

别名 别名是命令的快捷方式。为那些需要经常执行,但需要很长时间输入的长命令创建快捷方式很有用。语法是: alias ppp='ping www.baidu.com' 它们并不总是用来缩短长命令。重要的是,你将它...

老孟的Linux私房菜
今天
8
0
《JAVA核心知识》学习笔记(6. Spring 原理)-5

它是一个全面的、企业应用开发一站式的解决方案,贯穿表现层、业务层、持久层。但是 Spring 仍然可以和其他的框架无缝整合。 6.1.1. Spring 特点 6.1.1.1. 轻量级 6.1.1.2. 控制反转 6.1.1....

Shingfi
今天
8
0
Excel导入数据库数据+Excel导入网页数据【实时追踪】

1.Excel导入数据库数据:数据选项卡------>导入数据 2.Excel导入网页数据【实时追踪】:

东方墨天
今天
11
1

没有更多内容

加载失败,请刷新页面

加载更多

返回顶部
顶部