适配器模式(Adaper):将一个类(对象)的接口(方法或者属性)转化成另外一个接口,以满足用户的需要,使类(对象)之间接口的不兼容问题通过适配器得以解决。实际上就是为两个代码库所写的代码兼容允许而书写额外的代码。

例如一个A框架想要适配JQuery对象

A.g = function(id){
    //通过JQuery获取JQuery对象,然后返回第一个成员
    return $(id).get(0)
}
A.on = function(id,type,fn){
    //如果传递参数是字符串则以id处理,否则以元素对象处理
    var dom = typeof id === 'string' ? $('#'+id) : $(id);
    dom.on(type,fn)
}

适配器还有很多用途,例如传递多个参数时,记住这些参数的顺序是困难的,所以经常以一个参数对象方式传入,如果有一些参数没有传入,一些参数有默认值等,可以使用适配器来适配传入这个参数对象。

数据适配

var arr = ['JavaScript','book','前端编程语言','8月1日'];
//每个数组成员代表的意义不同,通常将其适配成对象形式
var obj = {
    name:'',
    type:'',
    title:'',
    time:''
}
//进行适配
function arrToObjAdapter(arr){
    return {
        name:arr[0],
        type:arr[1],
        title:arr[2],
        time:arr[3]
    }
}
var adapterData = arrToObjAdapter(arr);
console.log(adapterData) //{ name:'JavaScript',type:'book',title:'前端编程语言',time:'8月1日'}

解决前后端的数据依赖,前端程序不再为后端传递的数据所束缚,如果后端因框架改变导致传递的数据结构发生变化,使用适配器可以保证返回的数据是可用的安全的数据。

//为简化模型,使用Jquery的ajax方法 理想数据是一个一维数组
function ajaxAdapter(data){
    return [data['key1'],data['key2'],data['key3']]
}
$.ajax({
    url : 'xxx.php',
    success: function(data,status){
        if(data){
            //使用适配后的数据
            doSomething(ajaxAdapter(data));
        }
    }
})