JavaScript中的适配器

适配器模式是一种常用的设计模式，其主要目的是将一个类的接口转换成客户希望的另一个接口。适配器模式的关键在于将一个接口转换成另一个接口，让原本不兼容的两个接口能够协同工作。

## 1. 什么是适配器模式

适配器模式是一种结构性设计模式，其主要作用是将一个类的接口转换成客户希望的另一个接口。适配器模式可以使原本不兼容的两个接口能够协同工作。

适配器模式通常用于以下情况：

- 在使用一个已有的类时，发现其接口不符合需求，需要将其接口转换成符合需求的接口。
- 在创建一个新的类时，需要与现有的类的接口进行兼容。

## 2. 实现适配器模式的步骤

实现适配器模式的步骤如下：

1. 确定客户端所需要的接口。
2. 创建适配器类，并实现客户端所需要的接口。
3. 将原本不兼容的类的接口转换成适配器类的接口。

## 3. 适配器模式的示例

假设我们有一个圆形类和一个正方形类，它们都有一个 `draw` 方法，但是它们的接口不同。圆形类的 `draw` 方法接受一个半径参数，而正方形类的 `draw` 方法接受一个边长参数。现在我们希望创建一个画图工具，它能够画出圆形和正方形。

下面是圆形类和正方形类的代码：

```javascript
class Circle {
  constructor(radius) {
    this.radius = radius;
  }
  
  draw() {
    console.log(`Drawing a circle with radius ${this.radius}`);
  }
}

class Square {
  constructor(side) {
    this.side = side;
  }
  
  draw() {
    console.log(`Drawing a square with side ${this.side}`);
  }
}
```

我们需要一个适配器类，将圆形类和正方形类的接口转换成画图工具所需要的接口。下面是适配器类的代码：

```javascript
class ShapeAdapter {
  constructor(shape) {
    this.shape = shape;
  }
  
  draw() {
    if (this.shape instanceof Circle) {
      console.log(`Drawing a circle with radius ${this.shape.radius}`);
    } else if (this.shape instanceof Square) {
      console.log(`Drawing a square with side ${this.shape.side}`);
    }
  }
}

```

使用适配器模式，我们可以这样使用画图工具：

```javascript
const circle = new Circle(5);
const square = new Square(10);

const circleAdapter = new ShapeAdapter(circle);
const squareAdapter = new ShapeAdapter(square);

circleAdapter.draw(); // Output: Drawing a circle with radius 

适配器模式的实现方法有多种，下面介绍一种基于类的实现方式。

首先，我们需要定义一个适配器类，该类需要实现一个目标接口，并且内部包含一个待适配的对象。下面是一个示例：

```javascript
class Adapter {
  constructor(adaptee) {
    this.adaptee = adaptee;
  }
  request() {
    const result = this.adaptee.specificRequest();
    // 对结果进行处理，适配成目标接口需要的形式
    return result;
  }
}
```

在适配器类中，我们将待适配的对象传递给了适配器的构造函数，并将其保存在 `adaptee` 属性中。然后，我们实现了目标接口 `request()`，在该方法中调用了待适配对象的特殊接口 `specificRequest()`，并将其返回值进行适配成目标接口需要的形式后返回。

下面是待适配对象的实现示例：

```javascript
class Adaptee {
  specificRequest() {
    return "特殊请求的结果";
  }
}

```

在这个示例中，`Adaptee` 类实现了一个特殊接口 `specificRequest()`，该接口返回一个特殊请求的结果。

最后，我们来看一下适配器模式的使用示例：

```javascript
const adaptee = new Adaptee();
const adapter = new Adapter(adaptee);
const result = adapter.request();
console.log(result);
```

在这个示例中，我们先创建了一个待适配的对象 `adaptee`，然后将其传递给了适配器的构造函数，创建了一个适配器 `adapter`。最后，我们调用了适配器的 `request()` 方法，得到了一个适配后的结果，并将其打印到控制台上。

适配器模式的实现方式还有很多种，例如基于对象的实现方式、基于函数的实现方式等。但无论采用何种实现方式，适配器模式的核心思想都是将不兼容的接口进行适配，使其能够协同工作。