javascript设计模式-桥接模式(5)

桥接模式是一种既能把两个对象连接在一起,又能避免二者间的强耦合的方法。通过“桥”把彼此联系起来,同时又允许他们各自独立变化。主要作用表现为将抽象与现实隔离开来,以便二者独立化

事件监听回调机制

/*
// classic 

$(function(){

// 1前台业务逻辑
var inp = document.getElementById('inp');
// 用事件注册的方式 在元素上添加事件
BH.EventUtil.addHandler(inp,'click',sendReq);
//--------------------------------------------------
// 2后台业务逻辑
function sendReq(){// 处理后台的函数
    //ajax 
    //1 后台服务器的地址
    //2 是一个对象或者一个字符串(参数)
    //$.post('URL',{msg:this.value},function(result){
        // CallBack....
    //});
    alert('发送了指定的数据到后台:' + this.value);
}
});         
*/



// 利用桥模式 分开俩个业务逻辑单元
$(function(){

// 1前台业务逻辑 : 这一段代码处理前台的事件注册和绑定的
var inp = document.getElementById('inp');
// 用事件注册的方式 在元素上添加事件
BH.EventUtil.addHandler(inp,'click',bridgeHadler);

// 利用桥模式分开                  
function bridgeHadler(){
    var msg = this.value;
    sendReq(msg);
}

// 2后台业务逻辑  :这一段代码处理后台发送请求的
function sendReq(msg){// 处理后台的函数
    //ajax 
    //1 后台服务器的地址
    //2 是一个对象或者一个字符串(参数)
    //$.post('URL',{msg:this.value},function(result){
        // CallBack....
    //});
    alert('发送了指定的数据到后台:' + msg);
}

//单元测试的时候
sendReq('我也是数据..');
}); 

特权函数

// 桥模式:特权函数
var PublicClass = function(){
    //private variable
    var name = '张三';
    // getter 访问私用成员变量 // 特权函数
    this.getName = function(){
        return name ; 
    };
};

var p1 = new PublicClass();
alert(p1.getName());


var PublicClass = function(){
// 私用化的变量
var privateMethod = function(){
    alert('执行了一个很复杂的操作...');
};
// 单元测试这个很复杂的函数
//privateMethod();

// 通过特权函数去访问这个私用的独立单元
this.bridgeMethod = function(){
    return privateMethod();
}
};

var p1 = new PublicClass();
p1.bridgeMethod();

桥接组织多个单元

用桥把多个单体组织在一起,使每个单元都能独立化,可以实现自己的变化

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

var Class2 = function(d,e){
    this.d = d ; 
    this.e = e ; 
};

var BridgeCalss = function(a,b,c,d,e){
    this.class1 = new Class1(a,b,c);
    this.class2 = new Class2(d,e);
};

你可能感兴趣的:(javaScript)