javascript-桥接模式
桥接模式
1.在系统沿着多个维度变化的同时,又不增加其复杂度并以达到解耦
2.最主要特点:将实现层(如元素绑定的事件)与抽象层(如修饰页面UI逻辑)解耦分离,使两部分独立变化
3.避免需求的改变造成对象内部的修改,体现了面向对象对拓展的开发及修改的关闭原则
demo实例:创建一个对象桥接method,实现为对象拓展方法的功能
提取共同点(抽象层)
Object.prototype.addMethod = function(name,fn){
this[name] = fn;
}
创建类并实例化对象(实现层)
function Box(x,y,z){
this.x=x;
this.y=y;
this.z=z;
}
var box=new Box(20,10,10);
为对象拓展方法(桥接方法)
box.addMethod("init",function(){
console.log("盒子的长度为:"+this.x+" , 宽度为:"+this.y+" , 高度为:"+this.z);
});
box.addMethod("getWidth",function(){
console.log(this.y);
});
测试代码
box.init();
box.getWidth();
控制台显示

javascript-桥接模式的更多相关文章
- 【读书笔记】读《JavaScript设计模式》之桥接模式
桥接模式(Bridge)将抽象部分与它的实现部分分离,使它们都可以独立地变化. 一.使用场景 使用场景一:事件监控 对于前端而言,最典型的使用场景——事件监控.如—— addEvent(element ...
- 再起航,我的学习笔记之JavaScript设计模式14(桥接模式)
桥接模式 桥接模式(Bridge): 在系统沿着多个维度变化的同时,又不增加其复杂度并已达到解耦 从定义上看桥接模式的定义十分难以理解,那么我们来通过示例来演示什么是桥接模式. 现在我们需要做一个导航 ...
- Javascript设计模式理论与实战:桥接模式
桥接模式将抽象部分与实现部分分离开来,使两者都可以独立的变化,并且可以一起和谐地工作.抽象部分和实现部分都可以独立的变化而不会互相影响,降低了代码的耦合性,提高了代码的扩展性. 基本理论 桥接模式定义 ...
- 深入理解JavaScript系列(44):设计模式之桥接模式
介绍 桥接模式(Bridge)将抽象部分与它的实现部分分离,使它们都可以独立地变化. 正文 桥接模式最常用在事件监控上,先看一段代码: addEvent(element, 'click', getBe ...
- JavaScript面试系列:JavaScript设计模式之桥接模式和懒加载
我写的程序员面试系列文章 Java面试系列-webapp文件夹和WebContent文件夹的区别? 程序员面试系列:Spring MVC能响应HTTP请求的原因? Java程序员面试系列-什么是Jav ...
- [设计模式] javascript 之 桥接模式
桥接模式说明 定义:分离抽象化与实现化,使之可以自由独立的变化: 说明:由于软件环境需求原因,使得类型抽象具有多种实现以自身变化定义等情况,这使得我们要分离抽象实现与具体实现,使得抽象化与实现化解耦, ...
- javascript设计模式-桥接模式
在系统中,某些类由于自身逻辑,具有两个或两个以上维度的变化,如何使得该类型可以沿多个方向变化,但又不引入额外的复杂度,这就是桥接模式要解决的问题. 定义:桥接模式(Bridge),将抽象部分与它的实现 ...
- JavaScript设计模式(4)-桥接模式
桥接模式 在设计一个 Js API 时,可用来弱化它与使用它的类和对象之间的耦合 1. 事件监听器的回调函数 function getBeerById(id, callback) { asyncReq ...
- javascript设计模式----桥接模式、组合模式、装饰者模式、享元模式
http://blog.csdn.net/painsonline/article/details/7215087 桥接模式:http://www.cnblogs.com/TomXu/archiv ...
- 《javascript设计模式》笔记之第八章:桥接模式
个人理解:桥接模式就是更进一步地封装已有api,通过这个封装连接你的输入和底层api(初步理解,以后加深理解有不同体会之后可能要修改) 一:示例:事件监听器 下面这个示例就演示了通过一座桥(也就是一个 ...
随机推荐
- 使用FileSystemWatcher监控文件夹及文件
引言 这一周主要精力集中学习一个同事开发的本地文件搜索项目上,其中客户端添加共享文件时主要是使用FileSystemWatcher 监控文件,并在各种事件发生时向服务器发送消息. 解决方法 FileS ...
- 使用Microsoft Roslyn提取C#和VB.NET源代码中的字符串常量
Microsoft Roslyn是微软.NET“编译器即服务(Compiler as a Service)”的主要产品,它提供了开放的编译器API,并为源代码产生.分析和重构提供了新一代的语言对象模型 ...
- SqlServer 分页查询
1.not in方法 select top 10 from books where id not in (select top 30 id from books) 2.row_number()函数 ...
- css实现小三角(原理)
效果图如图1所示:(简单示范,有点丑,莫介意) PS:兼容IE,FF , chrome ,360安全浏览器 先讲下原理吧,如图2所示: 这个div的样式如下所示: div{ width: 0px; h ...
- MongoDb gridfs-ngnix文件存储方案
在各类系统应用服务端开发中,我们经常会遇到文件存储的问题. 常见的磁盘文件系统,DBMS传统文件流存储.今天我们看一下基于NoSQL数据库MongoDb的存储方案.笔者环境 以CentOS ...
- 关系型数据库与NOSQL
本文转载自: http://www.cnblogs.com/chay1227/archive/2013/03/17/2964020.html(只作转载, 不代表本站和博主同意文中观点或证实文中信息) ...
- AngularJS学习笔记(1) - AngularJS入门
什么是AngularJS? AngularJS是建立在jQuery的一个轻量级版本之上的MVC框架.MVC将业务逻辑代码和视图.模型相分离.AngularJS提供的所有功能都可以通过使用JavaScr ...
- ASP.NET Core 运行原理剖析2:Startup 和 Middleware(中间件)
ASP.NET Core 运行原理剖析2:Startup 和 Middleware(中间件) Startup Class 1.Startup Constructor(构造函数) 2.Configure ...
- 一款简洁大气的jquery日期日历插件
本jquery插件名为manhuaDate,暂时只支持jquery 1.9.0以下版本,比如jquery-1.8.3.min.js 查看效果网址:http://keleyi.com/a/bjad/em ...
- [深入学习Web安全](5)详解MySQL注射
[深入学习Web安全](5)详解MySQL注射 0x00 目录 0x00 目录 0x01 MySQL注射的简单介绍 0x02 对于information_schema库的研究 0x03 注射第一步—— ...