一起养成写作习惯！这是我参与「掘金日新计划 · 4 月更文挑战」的第6天，点击查看活动详情。

前言

记录自己学习设计模式，内容来自

《JavaScript设计模式与开发实践》

适配器模式

适配器模式的作用是解决两个软件实体间的接口不兼容的问题。使用适配器模式之后，原本由于接口不兼容而不能工作的两个软件实体可以一起工作。

适配器的别名是包装器(wrapper)，这是一个相对简单的模式。在程序开发中由许多这样的场景：当我们试图调用模块或者对象的某个接口时，却发现这个接口的格式并不符合目前的需求。这时候有两种解决办法，第一种时修改原来的接口实现，但如果原来的模块很复杂，或者我们拿到的模块是一段别人编写的经过压缩的代码，修改原接口就显得不太现实了。第二钟办法是创建一个适配器，将原接口转换为客户希望的另一个接口，客户只需要和适配器打交道。

现实中的适配器

插头转换器
USB转接口

适配器模式的应用

例如我们要渲染googleMap和baiduMap地图：

const googleMap = {
    show() {
        console.log('开始渲染谷歌地图')
    }
}
const baiduMap = {
    show() {
        console.log('开始渲染百度地图')
    }
}

const renderMap = function(map) {
    if (map.show instanceof Function) {
        map.show()
    }
}
renderMap(googleMap) // 输出：开始渲染谷歌地图
renderMap(baiduMap) // 输出：开始渲染百度地图

这段代码得顺利运行的关键是googleMap和baiduMap提供了一致的show方法，但第三方的接口方法并不在我们自己的控制范围之内，假如baiduMap提供的显示地图的方法不叫show而叫display呢？

假如baiduMap这个对象来源于第三方，正常情况下我们都不应该去改动它。此时我们可以通过增加baiduMapAdapter来解决问题：

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

const baiduMapAdapter = {
    show() {
        return baiduMap.display()
    }
}
const renderMap = function(map) {
    if (map.show instanceof Function) {
        map.show()
    }
}
renderMap(googleMap) // 输出：开始渲染谷歌地图
renderMap(baiduMap) // 输出：开始渲染百度地图

小结

适配器模式是一对相对简单的模式，有一些模式跟适配器模式结构非常相似，比如装饰者模式、代理模式和外观模式。这几种模式都属于"包装模式"，都是由一个对象来包装另一对象。区别它们的关键仍然是模式的意图。

适配器模式主要用来解决两个已有接口之间不匹配的问题，它不考虑这些接口是怎样实现的，也不烤炉它们将来可能会如何演化。
装饰者模式和代理模式也不会改变原来对象的接口，但装饰者模式的作用是为了给对象增加功能。装饰者模式常常形成一条长的装饰类，而适配器模式及通常只包装一次。代理模式是为了控制对对象的访问，通常也只包装一次。
外观模式的作用倒是和适配器比较相似，有人把外观模式堪称一组对象的适配器，但在外观模式最显著的特点是定义了一个新的接口

设计模式完整记录请看我的github

设计模式[十四] 适配器模式

前言

适配器模式

现实中的适配器

适配器模式的应用

小结