设计模式之桥接模式

设计模式之桥接模式

0.前言                                                                                                 

   看设计模式比较痛苦，一则是自己经验尚浅，不能体会到使用这些设计模式的益处；二则是不能很好把握使用这些设计模式的时机。所以这一部分看得断断续续，拖拖拉拉，为了了却这快心病，决定最近一口气看完几种常见的设计模式。今天就从桥接模式开始吧。

1.使用情况                                                                     

   最常用于事件监控上，也通过桥接联接多个类

   1.1、事件监控   

//错误的方式
 　　//这个API根据事件监听器回调函数的工作机制，事件对象被作为参数传递给这个函数。本例中并没有使用这个参数，而只是从this对象获取ID。
 　　addEvent(element,'click',getBeerById);
 　　function(e){
    　　var id =this.id;
    　　asyncRequest('GET','beer.url?id='+ id,function(resp){
       　　//Callback response
      　　 console.log('Requested Beer: '+ resp.responseText);
    　　});
 　　}
 
 　　//好的方式
 　　//从逻辑上分析，把id传给getBeerById函数式合情理的，且回应结果总是通过一个毁掉函数返回。这么理解，我们现在做的是针对接口而不是实现进行编程，用桥梁模式把抽象隔离开来。
 　　function getBeerById(id,callback){
    　　asyncRequest('GET','beer.url?id='+ id,function(resp){
       　　callback(resp.responseText)
    　　});
 　　}
 　　addEvent(element,'click',getBeerByIdBridge);
 　　function getBeerByIdBridge(e){
    　　getBeerById(this.id,function(beer){
       　　console.log('Requested Beer: '+ beer);
    　　});
 　　}

      1.2、联接多个类     

var  Class1 = function(a,b,c){
       this.a = a;
       this.b = b;
       this.c = c;  
}
var Class2 = function(d){
      this.d = d;  
}

var BridgeClass = function(a,b,c,d){
      this.one = new Class1(a,b,c);
      this.two = new Class2(d);
}
这里使用桥接模式是为了让Class1、Class2能够独立于BridgeClass而发生改变。

2.桥接的利与弊                                                                                        

   2.1利：弱化了代码之间的耦合，将抽象和其实现分离，便于二者独立变化、让API更加健壮，有利于分层，提高组件的模块化程度；提高可拓性。

   2.3弊：增加开发成本，在性能方面可能会有所降低。

3.个人理解                                                                  

   1.桥接模式可以将抽象和其实现分离，方便他们独立变化；

   2.主要应用情况是事件监听，将事件处理函数的抽象部分与实现部分分离,也就是抽像部分只是提供一个接口，具体的实现由桥接函数来实现；

   3.好处：弱化了代码之间的耦合，有利于代码拓展

   4.举例：     

var  forEach = function（arr,fn）{
     var result = [];
      for(var i=0;len= arr.length){
            result.push(fn.call(this,i,arr[i]));
       }
       return result;
}    

function  deal(){
　　var arr = [1,2,3,4,5];
   var b = forEach(arr,function(i,n){
       return n*n;
   }) 
}

 

 

 

 

 

分类: javascript理论

标签: javascript, 桥接