外观模式——为复杂的子系统提供统一接口，优化代码结构！

2023-09-05 23:01:41

// 定义外观类
class Facade {
  constructor(subsystem1, subsystem2) {
    this.subsystem1 = subsystem1;
    this.subsystem2 = subsystem2;
  }

  // 提供一个统一的接口方法
  operation() {
    this.subsystem1.operation1();
    this.subsystem2.operation2();
  }
}

// 定义子系统类
class Subsystem1 {
  operation1() {
    console.log("SubSystem1: Operation1");
  }
}

class Subsystem2 {
  operation2() {
    console.log("SubSystem2: Operation2");
  }
}

// 测试外观类
const facade = new Facade(new Subsystem1(), new Subsystem2());
facade.operation();

输出

外观模式是一种创造型设计模式，旨在优化代码结构，降低系统耦合度。它通过为一组复杂的子系统接口提供一个更高级的统一接口来实现这一点。外观模式简化了对子系统接口的访问，使上层代码能够更方便地与子系统进行交互。

外观模式的优点主要体现在以下几个方面：

降低了子系统之间的依赖关系。外观模式将子系统封装在一个统一的接口之后，上层代码只需要与外观类进行交互，而无需了解子系统的具体实现细节。这降低了子系统之间的依赖关系，提高了代码的可维护性和可扩展性。
简化了上层代码的开发。外观模式提供了一个统一的接口，上层代码只需要与这个接口进行交互，而无需关心子系统的具体实现细节。这简化了上层代码的开发，提高了代码的可读性和可维护性。
提高了系统的可扩展性。外观模式将子系统封装在一个统一的接口之后，当需要扩展系统时，只需要修改外观类的实现，而无需修改上层代码。这提高了系统的可扩展性，使系统能够更轻松地适应新的需求。

JavaScript中的外观模式实现

在JavaScript中，外观模式可以通过以下步骤实现：

定义外观类。外观类负责提供统一的接口，并封装子系统类的具体实现细节。
定义子系统类。子系统类负责实现具体的功能，并与外观类进行交互。
在外观类中使用子系统类来实现统一接口的方法。
在上层代码中使用外观类提供的统一接口来访问子系统功能。

以下是一个外观模式的JavaScript实现示例：

// 定义外观类
class Facade {
  constructor(subsystem1, subsystem2) {
    this.subsystem1 = subsystem1;
    this.subsystem2 = subsystem2;
  }

  // 提供一个统一的接口方法
  operation() {
    this.subsystem1.operation1();
    this.subsystem2.operation2();
  }
}

// 定义子系统类
class Subsystem1 {
  operation1() {
    console.log("SubSystem1: Operation1");
  }
}

class Subsystem2 {
  operation2() {
    console.log("SubSystem2: Operation2");
  }
}

// 测试外观类
const facade = new Facade(new Subsystem1(), new Subsystem2());
facade.operation();