1、模式定义
适配器模式，把一个类（对象）的接口（方法和属性）转化成另一个接口，以满足用户需求，以解决类（对象）之间的不兼容性问题。
2、生活中的适配器
两根垂直相交的水管在连接处的直角弯管，就是适配器。两孔插头被转化成三孔插头的电源设备，也是适配器。
所谓代码中的适配器，其实就是为两个不同的代码库所写的额外的兼容性代码。
3、适配器模式 举例
让某个库A适配jQuery库，实现如下：
// 适配器模式，让A框架适配jQuery
window.A = A = jQuery;
4、适配器模式 再举例
让指定的库B，适配jQuery，并用jQuery库中的方法，覆写B库中的某些方法。
// 库B的源码如下：
var B = B || {};
B.g = function(id){
return document.getElementById(id);
};
B.on = function(id,type,fn){
var dom = typeof if === 'string' ? this.g(id) : id;
if(dom.addEventListener){
dom.addEventListener(type,fn,false);
}else if(dom.attachEvent){
dom.attachEvent('on'+type,fn);
}else{
dom['on'+type] = fn;
}
}
// 适配器模式，把B框架转换成jQuery，并覆写B库的两个方法
window.B = B = jQuery;
B.g = function(id){
return $(id).get(0);
}
B.on = function(id,type,fn){
var dom = typeof id === 'string' ? $('#'+id) : $(id);
dom.on(type,fn);
}
事实上，对两种“血缘”比较相近的框架进行适配，相对是比较容易的。对两种“血缘”相差甚远的框架进行适配，是非常复杂的。因此，日常工作中，在使用适配器模式时，尽量以相似的框架为基础。
5、参数适配器
适配器模式，除了可用于两个或多个库之间适配外，还可以用于参数适配。当一个方法所接收的参数较多时，就可以用适配器来优化。示例代码如下：
// 一个需要接收多个参数的方法
function doSomeThing(name,title,age,color,size,price){};
// 适配器模式: 使用适配器来优化这个方法，用一个json对象作为适配参数
function doSomeThing(options){
var _adapter = {
name:'清荷',
title:'设计师',
age:24,
color:'yellow',
size:100,
price:50.9
}
for(var i in _adapter){
_adapter[i] = options[i] || _adapter[i];
}
};
6、使用适配器模式，对两种不同的数据结构进行适配
// 数组结构：
var arr = ['geekxia', '工程师', '男', 25];
// 使用适配器模式，把上述的数组结构转化成json结构
function arrToJsonAdapter(arr){
return {
name: arr[0],
job: arr[1],
gender: arr[2],
age: arr[3]
}
}
var geekxia = arrToJsonAdapter(arr);
console.log(geekxia);
7、适配器模式 用于处理服务端的响应数据
// 适配器模式：用于处理不确定的数据源，得到我们希望的数据格式
function ajaxAdapter(data){
return [data['k1'],data['k2'],data['k3'],data['k4']];
}
// 示例：用指定的数据格式，对服务端的响应数据进行适配
$.ajax({
url: 'data.php',
success: function(data,status){
if(data){
// 把服务端数据转化成我们希望的数据格式
var myData = ajaxAdapter(data);
// do something
}
}
});
像这样，通过适配器模式，我们可以把不确定的数据源转化成我们希望的数据格式，即使日后服务端的响应数据的数据格式（或字段名称）发生了变化，我们仍然只需要修改适配即可，而无须修改业务逻辑代码，这使得我们的代码更加容易维护。
完！！！
网友评论