设计模式：TypeScript中的简单工厂模式

​掌握简单的工厂模式，轻松处理对象的创建。

欢迎来到 TypeScript 设计模式系列，该系列介绍了使用 TypeScript 进行 Web 开发的一些有用的设计模式。

之前的文章如下：

•  TypeScript中的策略模式

• TypeScript 中的责任链模式

• 设计模式：TypeScript中的观察者模式

• 设计模式：TypeScript中的模板方法模式

设计模式对于 web 开发人员来说非常重要，掌握它们可以让我们写出更好的代码。在本文中，我将使用 TypeScript 来介绍简单工厂模式。

简单工厂模式也称为静态方法模式，因为在工厂类中定义了一个静态方法来创建对象。简单工厂允许用户在不知道特定参数的情况下创建所需的“产品”类，即用户可以在不知道产品的具体生产细节的情况下直接消费产品。

上图中我模拟了用户购买汽车的过程，Bytefer和Chris1993分别向SuperX工厂订购SuperX01和SuperX02车型，然后工厂确定用户选择的车型，生产完成后将汽车交付给用户。

让我们看看如何使用简单工厂来描述汽车工厂生产给定车型的过程。

为了更好地理解下面的代码，让我们先看看相应的 UML 图：

简单的工厂模式包括以下角色：

• Product(汽车)：抽象产品

• Concrete Product(SuperX01)：实体产品

• Factory(SuperXFactory)：负责实现创建所有实例的内部逻辑

接下来，我们定义一个抽象类Vehicle 和它的两个子类 SuperX01 和 SuperX02 来表示不同类型的车辆。

abstract class Vehicle {  abstract run(): void;}

class SuperX01 extends Vehicle {  run(): void {    console.log("SuperX01 start");  }}

class SuperX02 extends Vehicle {  run(): void {    console.log("SuperX02 start");  }}

然后，我们定义了  SuperXFactory  类来表示汽车制造厂。

class SuperXFactory {  public static produceSuperX(model: "X01" | "X02"): Vehicle {    if (model === "X01") {      return new SuperX01();    } else {      return new SuperX02();    }  }}

在  SuperXFactory  类中，我们定义了一个静态方法 produceSuperX 来生成实际的车辆。然后我们可以开始生产汽车：

const superX01 = SuperXFactory.produceSuperX("X01");const superX02 = SuperXFactory.produceSuperX("X02");

superX01.run();superX02.run();

当你成功运行上述代码时，终端将输出以下结果：

SuperX01 startSuperX02 start

最后，让我们总结一下简单工厂模式的使用场景：

• 工厂类负责创建更少的对象：由于创建的对象更少，工厂方法中的业务逻辑不会太复杂。

• 客户端只需要知道传递给工厂类的静态方法的参数，而不需要关心创建对象的细节。

除了简单的工厂模式，还有工厂方法和抽象的工厂设计模式，后续的文章中会继续介绍。

 欢迎关注公众号：文本魔术，了解更多