js --适配器模式

---恢复内容开始---

定义：

是指讲一个接口转换成客户端希望 的另外一个接口，该模式使得原本不兼容的类可以一起工作。适配器模式的作用事解决两个软件实体间的接口不兼容的问题。

生活中的实例：

USB转接器，在以前的电脑上，PS2接口是连接鼠标，键盘等其他外部设备的标准接口。但随着技术的发展，越来越多的电脑开始放弃PS2 接口，转而仅支持USB接口。所以哪些过去生产的只拥有PS2接口的鼠标，键盘，游戏手柄等，需要一个USB的转换器接口才能继续正常工作，着就是PS2-USB适配器诞生的原因。

在程序开发的过程中，随着产品一次次的升级，我们发现有时候之前的接口不能满足现有的业务需求了，公司可能不会把大量的人力，精力放在一个维护中的项目上，那怎么办，能够在改动最小的前提下，让接口适用于新系统。这时候，就需要"适配器模式"，该模式也称为“亡羊补牢”的模式，因为没有人在项目设计之初就使用它。

适配器模式的三个角色：

- 目标角色（Target）：例如:USB接口

- 源角色（Adaptee）： 例如：PS2接口

- 适配器角色（Adapter）： 例如： PS2-USB适配器

例子：

Target.js

// 目标角色类 
export  class Target{
    constructor() {

    }
    usb() {
        console.log('usb接口')
    }
}

Adaptee.js

// 源目标角色是
export  class Adaptee {
    constructor() {

    }
    ps() {
        console.log('原目标是ps2')
    }
}

Adapter.js

// 适配器
import {Adaptee} from './Adaptee.js'
let adaptee = new Adaptee()

export  class Adapter {
    constructor() {

    }
    usb() {return adaptee.ps()
    }
}

客户端的实现：

import {Adapter} from '@/assets/Adapter.js'
let adapter = new Adapter()
  mounted() {
    adapter.usb() //原目标是ps2
  }

在适配器类中，定义与目标角色类相同的方法，但是在该方法中，调用原目标角色类中的方法，就可以实现原目标的方法。

数据格式转换的适配器

在前后端数据传递的时候经常会使用到适配器模式，如果后端的数据经常发生变化，比如在某些网站拉取的数据，后端有时无法控制数据的格式，所以，在使用数据前最好对数据进行 适配成我们可用的数据格式在使用。

新的数据格式如下：

var BeijingCity = {
    chaoyang: 11,
    haidian: 12,
    pinggu: 13
};

旧的数据格式如下：

var beijingCity = [
    {
        name: 'chaoyang',
        id: 11,
    }, {
        name: 'haidian',
        id: 12,
    }

    ];

使用适配器模式来进行数据格式的转换

var getBeijingCity = function(){
    var beijingCity = [
    {
        name: 'chaoyang',
        id: 11,
    }, {
        name: 'haidian',
        id: 12,
    }

    ];
    return beijingCity;
};
var render = function( fn ){
    console.log( '开始渲染北京市地图' );
    document.write( JSON.stringify( fn() ) );
};
var addressAdapter = function( oldAddressfn ){
    var address = {},
    oldAddress = oldAddressfn();
    for ( var i = 0, c; c = oldAddress[ i++ ]; ){
        address[ c.name ] = c.id;
    }
    return function(){
        return address;
    }
};
render( addressAdapter( getBeijingCity ) );

结果是：

{"chaoyang":11,"haidian":12}

使用场景：

1. 使用一个已经存在的对象，但其方法或属性接口不符合你的要求；
2. 你想创建一个可复用的对象，该对象可以与其它不相关的对象或不可见对象（即接口方法或属性不兼容的对象）协同工作；
3. 想使用已经存在的对象，但是不能对每一个都进行原型继承以匹配它的接口。对象适配器可以适配它的父对象接口方法或属性。

总结

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

 

标签：适配器,接口,js,PS2,模式,var,Adaptee
来源： https://www.cnblogs.com/mn6364/p/11069965.html