# 适配器模式

适配器模式（Adapter）：将一个类（对象）的接口（方法或者属性）转化成另外一个接口，以满足用户需求，使类（对象）之间接口的不兼容问题通过适配器得以解决。

简单来说, 适配器就像我们生活中用的转换插头. 在编程中, 适配器就是为两个代码库所写的代码兼容运行而书写的额外代码。有了这样的适配器，你就不需要特意地重写以前的功能代码了。你只需要让用以前的代码库所写的代码适配新代码库就可以了。

假如说有一个 A 框架, 现在想让它适配 Jquery:

// 定义框架
var A = A || {};
// 通过ID获取元素
A.g = function(id){
　　return document.getElementById(id)
}
// 为元素绑定事件
A.on = function(id, type, fn){
　　// 如果传递参数是字符串则以id处理，否则以元素对象处理
　　var dom = typeof id === 'string' ? this.g(id) : id;
　　// 标准DOM2级添加事件方式
　　if(dom.addEventListener){
　　　　dom.addEventListener(type, fn, false);
　　// IE DOM2级添加事件方式
　　}else if(dom.attachEvent){
　　　　dom.attachEvent('on' + type, fn);
　　// 简易添加事件方式
　　}else{
　　　　dom['on' + type] = fn;
　　}
}

首先 g 方法是通过 id 获取元素，所以通过 $（jQuery的简写名称）方法获取 jQuery 对象然后通过 get 获取第一个成员即可，不过 on 方法有些复杂，我们不能直接替换，因为 jQuery 和我们的 A 库在通过 id 获取元素时是有区别的，jQuery的 id 前面要加 #。

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);
}

除此之外, 另一个例子是将数组适配成对象:

function arrToObjAdapter(arr){
　　return {
　　　　name : arr[0],
　　　　type : arr[1],
　　　　title : arr[2],
　　　　data : arr[3]
　　}
}
var arr = ['JavaScript','book','前段编程语言', '8月1日'];
var adapterData = arrToObjAdapter(arr);
console.log(adapterData)　　// {name: "JavaScript", type: "book", title: "前段编程语言", data: "8月1日"}

在前后端开发时, 适配器它解决了前后端的数据依赖，前端程序不再为后端传递的数据所束缚，如果后端因为架构改变导致传递的数据结构发生变化，我们只需要写个适配器就可以放心了。