ES6 实现之适配器模式 Adapter

4,983 阅读1分钟

概述

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

举个生活中的例子:港式插头转换器,港式的电器插头比大陆的电器插头体积要大一些。如果从香港买了一个 Mac book,我们会发现充电器无法插在家里的插座上,为此而改造家里的插座显然不方便,所以我们需要一个转换插头。

运用

通过上述例子,我们可以知道适配器模式有三个角色:

  • 目标角色(Target):大陆的电器插头
  • 源角色(Adaptee): 港式的电器插头
  • 适配器角色(Adapter): 把港式的电器插头转成更小大陆的电器插头,来适配大陆插座
目标角色实现
class Target {
    small(){
        throw new Error('This method must be overwritten!');
    }
}

由Target接口实现目标角色,用户期待更小的电器插头。

源角色实现
class Adaptee {
    big(){
        console.log("港式的电器插头可用咯~~");
    }
}

Adaptee 属于更大的港式的电器插头,这和用户所期望的不同。所以这里需要引入适配器,去转换成用户所期待的目标接口。

适配器实现
class Adapter extends Target {
    constructor(adaptee) {
        super();
        this.adaptee = adaptee;
    }
    small() {
        this.adaptee.big();
    }
}

Adapter 类继承了 Target,重写 small 函数,最后通过适配器,把港式big转成了大陆的small了。

测试一下
let adaptee=new Adaptee();
let adapter=new Adapter(adaptee);
adapter.small();
# 港式的电器插头可用咯~~

【第一次打广告:所有设计模式,请看 ES6 实现最实用的 22 种设计模式