【JavaScript设计模式】适配器模式

适配器模式

适配器模式的目的是为了解决对象之间的接口不兼容的问题，通过适配器模式可以不更改源代码的情况下，让两个原本不兼容的对象在调用时正常工作。

适配器模式的作用很像一个转接口. 本来iphone的充电器是不能直接插在电脑机箱上的, 而通过一个usb转接口就可以了.

比如你现在正在用一个自定义的js库. 里面有个根据id获取节点的方法$id().有天你觉得jquery里的$实现得更酷, 但你又不想让你的工程师去学习新的库和语法. 那一个适配器就能让你完成这件事情.

$id = function( id ){
  return jQuery( '#' + id )[0];
}

举例：

var googleMap = {
  show: function () {
    console.log('开始渲染谷歌地图');
  }
};
var baiduMap = {
  display: function () {
    console.log('开始渲染百度地图');
  }
};

var renderMap = function (map) {
  if (map.show instanceof Function) {
    map.show();
  }
};



//解决百度地图中展示地图的方法名与谷歌地图中展示地图的方法名不一样的问题
var baiduMapAdapter = {
  show: function () {
    return baiduMap.display();

  }
};

renderMap(googleMap); // 输出：开始渲染谷歌地图
renderMap(baiduMapAdapter); // 输出：开始渲染百度地图

原有data 中的数据不满足当前的要求，通过计算属性的规则来适配成我们需要的格式，对原有数据并没有改变，只改变了原有数据的表现形式

对比

适配器模式主要用来解决两个已有接口之间不匹配的问题，它不考虑这些接口是怎样实现的，也不考虑它们将来可能会如何演化。适配器模式不需要改变已有的接口，就能够使它们协同作用。

装饰者模式和代理模式也不会改变原有对象的接口，但装饰者模式的作用是为了给对象增加功能。装饰者模式常常形成一条长的装饰链，而适配器模式通常只包装一次。代理模式是为了控制对对象的访问，通常也只包装一次。

适配器与代理模式相似

• 适配器模式： 提供一个不同的接口（如不同版本的插头）
• 代理模式： 提供一模一样的接口

外观模式的作用倒是和适配器比较相似，有人把外观模式看成一组对象的适配器，但外观模式最显著的特点是定义了一个新的接口。