设计模式-适配器模式

简介

  • 适配器模式 (Adapter Pattern)是一种结构型设计模式,它允许不兼容的接口能够一起工作。这种模式通常用于使现有的类与其他类一起工作,而无需修改它们的源代码。在 JavaScript 中,适配器模式可以用来确保不同的类或对象之间能够通过一个统一的接口进行交互

概念

  • 设想你有两个组件或类,它们执行相似的功能但是接口不兼容。例如,一个组件可能使用 fetchData 方法,而另一个组件使用 getData 方法。如果你想在不修改这两个已存在的组件的情况下使它们能够互操作,你可以使用适配器模式。

    适配器模式主要涉及三个角色:

    • 目标接口(Target):客户期望使用的接口。它定义了客户希望如何调用某个功能。
    • 待适配的类(Adaptee):需要被适配的类,它有自己的接口和实现,但不符合目标接口。
    • 适配器(Adapter):实现或继承目标接口,并将目标接口的调用转到待适配的类的实现上。

示例

  • 假设你正在使用一个第三方库,它提供了一个 OldCalculator 类,具有一个 performOperation 方法。现在,你的应用使用了一个新的接口 NewCalculator,这个新接口期望调用的方法名为 calculateOldCalculator 不能直接用于新的应用,因为接口不匹配。

    OldCalculator 类(Adaptee):

    javascript 复制代码
    class OldCalculator {
      performOperation(x, y, operation) {
        switch (operation) {
          case 'add':
            return x + y;
          case 'sub':
            return x - y;
          default:
            return NaN;
        }
      }
    }

    NewCalculator 接口(Target):

    javascript 复制代码
    class NewCalculator {
      calculate() {
        throw new Error('This method should be implemented');
      }
    }

    适配器(Adapter):

    javascript 复制代码
    class CalculatorAdapter extends NewCalculator {
      constructor() {
        super();
        this.oldCalc = new OldCalculator();
      }
    
      calculate(x, y, operation) {
        return this.oldCalc.performOperation(x, y, operation);
      }
    }

    使用适配器

    javascript 复制代码
    // 创建适配器实例
    const adapter = new CalculatorAdapter();
    
    // 现在可以使用新接口调用旧组件的功能
    console.log(adapter.calculate(5, 3, 'add'));  // 输出: 8
    console.log(adapter.calculate(5, 3, 'sub'));  // 输出: 2

总结

  • 适配器模式使得你能够将不兼容的接口桥接到一起工作,而无需改动现有的代码。这提供了很大的灵活性和更简洁的集成方式。在 JavaScript 中,适配器通常是通过创建新的类(适配器),继承或组合目标类或接口,并在内部调用待适配类的方法来实现的。这样,适配器在外部表现为目标接口,而内部利用已存在的实现。这种模式在处理多个库和服务,尤其是在它们期望的接口不一致时,非常有用。
相关推荐
AI人工智能+电脑小能手2 天前
大白话说Java设计模式-28-模板方法模式(业务实战篇)
java·设计模式·模板方法模式·spring源码·订单系统·代码复用
leeyi2 天前
两个 Agent 怎么协作:Host-Worker 模式(第91篇-E77)
设计模式·agent·ai编程
AI人工智能+电脑小能手2 天前
大白话说Java设计模式-26-策略模式(业务实战篇)
java·spring·设计模式·策略模式·支付系统·算法切换
星火10243 天前
【Groovy翻译-进阶篇】Groovy 中的设计模式
后端·设计模式·groovy
AI人工智能+电脑小能手3 天前
大白话说Java设计模式-27-策略模式(源码剖析篇)
java·spring·设计模式·策略模式·源码分析·事务管理·comparator
SL_staff3 天前
风控规则如何从硬编码解耦?我们在 JVS-Rules 中的实践与思考
java·spring boot·设计模式
小此方3 天前
Linux加餐(一):藏在Linux中的设计模式(一)策略模式与日志
linux·设计模式·策略模式
To_OC3 天前
从一行入口代码啃透 NestJS:工厂模式、装饰器和依赖注入是怎么串起来的
后端·设计模式·nestjs
东方小月3 天前
从零开发一个 Coding Agent(十二):实现版本化 JSONL 与真实 CLI 入口
前端·设计模式·前端框架
程序员贺加贝3 天前
轻制造SaaS的生产闭环建模-BOM工单领料报工质检与入库
java·设计模式·架构