「这是我参与11月更文挑战的第7天，活动详情查看：2021最后一次更文挑战」。
序言
适配器模式，在了解之前我完全不知道这是一种设计模式，因为实在是太常用了，业务应用场景之广。更多时候我会把它称之为适配层，在团队协作工作中，处处可以见到他的身影。
什么是适配器模式
适配器模式（Adapter Pattern）是指将一个类的接口转换成客户期望的另一个接口，使原本的接口不兼容的类可以一起工作，属于结构型设计模式。
适配器模式适用于以下场景：
- 数据对象中的 key 和插件中定义的变量对应不上时，可以使用适配器模式作为中间层，使模板能够正确读取数据。
- 对接 JsSdk 时，多个 SDK 定义的方法不同，但是我们定义一个统一的方法想要调用他们，就得用适配器模式。
- 生活中也有很多地方有用到该设计模式：
手机充电实际上使用的是 12V 直流电，但是我们电源线是插在 220V 的交流电源上。我们不能把 220V 的交流电源直接改成符合要求的 12V 直流电源，因为不便于运输，也没法让手机直接使用 220V 的交流电，因为其元器件无法承担。 220V 交流电源和笔记本本质上是无法直接放到一起工作的，那么就需要电源适配器的辅助。它能够利用 220V 交流电源获取电能，并转换成 12V 直流电输出给笔记本。 这就是适配器模式，将一个类的接口转换成客户希望的另外一个接口。适配器模式使得原本由于接口不兼容而不能一起工作的那些类可以一起工作。
适配器模式中的角色
- Target（目标）：客户的目标接口，可以是一个抽象类或接口，也可以是具体类。
- Adaptee（适配者）：被适配的角色，是一个已有接口，但不符合客户要求。
- Adapter（适配器）：将已有接口转换成目标接口
我们以一个实例来感受一下，假设我们要完成家用电 12V 和 220V 的转换，我们用如下案例
interface PowerTarget {
output12V(): string;
}
class PowerAdaptee {
output220V() {
return '220V 交流电';
}
}
const adapt = (input) => {
// TODO 具体转换逻辑
console.log(`${input} 被转换成 12V 直流电`);
return '12V 直流电';
};
class PowerAdapter extends PowerAdaptee implements PowerTarget {
public output12V() {
const input = this.output220V();
console.log(`电源适配器开始工作，获取：${input}`);
const output = adapt(input);
console.log(`电源适配器工作完成，输出：${output}`);
return output;
}
}
const target: PowerTarget = new PowerAdapter();
target.output12V();
实际上实现也很简单，就是明确适配目标，和了解适配者以后，坐中间的转换层，然后当适配者来了，用适配器转换完成后，在给适配目标。
实际业务案例
有一天，我在开发一个信息弹窗组件，我在组件中定义好了各种属性变量，该组件会在多个页面使用，用来展示用户信息。但是由于后端没有沟通好，接口返回数据中，用户信息对应的 key 值不同，使得我组件无法做出匹配，例如：name 在 A接口里面是nikeName ，在B接口中是 userName。那么我们可以：
translate(data){
let translateData = {}
translateData.name = data.nikeName || data.userName
return translateData
}
我们可以根据业务做出自己的调整，重要的是这种中间适配层的思想应用
