JS的设计模式（23种）-创建型模式

时间：2024-03-25 11:09:17

1. 单例模式（Singleton）

专业解释：

单例模式是一种确保在任何情况下一个类仅有一个实例，并提供全局访问点的设计模式。它主要用于控制对全局唯一资源的访问。

通俗理解：

就好比一座城市里只有一座供水站，不论你需要从哪里取水，都只能通过这个供水站来获取，而且全市人民共用的是同一座供水站。

示例代码（JavaScript）：

class Singleton {
  static instance = null;

  constructor() {
    if (!Singleton.instance) {
      Singleton.instance = this;
    }
    return Singleton.instance;
  }

  someSharedResource() {
    // 实现共享资源的方法
  }
}

const instance1 = new Singleton();
const instance2 = new Singleton();

console.log(instance1 === instance2); // 输出 true，表明它们是同一个实例

2. 抽象工厂模式（Abstract Factory）

专业解释：

抽象工厂模式提供一个接口用于创建一系列相关或相互依赖的对象，而无需指定具体类。客户端使用此接口选择所需的产品族中的产品对象。

通俗理解：

设想一个汽车工厂不仅能生产各种类型的车（如轿车、SUV等），还能生产配套的轮胎和内饰。客户只要告诉工厂要哪种类型的车，工厂就会相应地提供整套适合的汽车部件。

示例代码（JavaScript）：

// 抽象工厂
class AbstractCarFactory {
  createCar() {
    throw new Error('抽象方法，需要子类实现');
  }

  createTires() {
    throw new Error('抽象方法，需要子类实现');
  }

  createInterior() {
    throw new Error('抽象方法，需要子类实现');
  }
}

// 具体工厂
class LuxuryCarFactory extends AbstractCarFactory {
  createCar() { return new LuxuryCar(); }
  createTires() { return new PremiumTires(); }
  createInterior() { return new LeatherInterior(); }
}

// 产品类
class Car {}
class LuxuryCar extends Car {}
class Tires {}
class PremiumTires extends Tires {}
class Interior {}
class LeatherInterior extends Interior {}

// 使用
const factory = new LuxuryCarFactory();
const car = factory.createCar();
const tires = factory.createTires();
const interior = factory.createInterior();

3. 工厂模式（Factory Method）

专业解释：

工厂模式定义了一个创建对象的接口，但让子类决定实例化哪一个类。工厂方法使一个类的实例化延迟到其子类。

通俗理解：

比如你走进一家甜品店，向服务员说想要一杯饮料，具体是什么饮料由服务员决定（可能是咖啡或果汁）。服务员就是这里的“工厂”，负责根据你的需求生产出具体的饮料产品。

示例代码（JavaScript）：

class DrinkFactory {
  createDrink(type) {
    switch (type) {
      case 'coffee':
        return new Coffee();
      case 'juice':
        return new Juice();
      default:
        throw new Error('不支持的饮料类型');
    }
  }
}

class Coffee {}
class Juice {}

const factory = new DrinkFactory();
const coffee = factory.createDrink('coffee');
const juice = factory.createDrink('juice');

4. 建造者模式（Builder Pattern）

专业解释：

建造者模式将一个复杂对象的构建与它的表示分离，使得同样的构建过程可以创建不同的表示。客户端不需要知道内部组件的具体构建细节。

通俗理解：

就如同组装一台电脑，你可以选择不同配置的CPU、内存、硬盘等配件，最后由装机员按照你的配置清单来组装。组装过程（Builder）是固定的，但最终产出的电脑配置各异。

示例代码（JavaScript）：

class ComputerBuilder {
  constructor() {
    this.computer = {
      cpu: '',
      memory: '',
      hardDrive: ''
    };
  }

  setCPU(cpu) {
    this.computer.cpu = cpu;
    return this;
  }

  setMemory(memory) {
    this.computer.memory = memory;
    return this;
  }

  setHardDrive(hardDrive) {
    this.computer.hardDrive = hardDrive;
    return this;
  }

  build() {
    return this.computer;
  }
}

class DesktopComputerBuilder extends ComputerBuilder {
  // 可能会添加一些桌面电脑特有的配置方法
}

const builder = new DesktopComputerBuilder()
  .setCPU('Intel Core i7')
  .setMemory('16GB DDR4')
  .setHardDrive('1TB SSD');

const computer = builder.build();
console.log(computer);

5. 原型模式（Prototype Pattern）

专业解释：

原型模式是一种复制已有对象作为新对象的方式，通过克隆原型对象并对其稍作修改来创建新的对象，而不是重新初始化一个新对象。

通俗理解：

就如同制作陶艺，工匠可以根据一个基础模型（原型）快速复制出相似的作品，然后再针对每个复制品进行个性化装饰。

示例代码（JavaScript，利用内置的Object.create()方法实现简单原型克隆）：

function PrototypeObj(name) {
  this.name = name;
}

// 添加一个clone方法到原型上
PrototypeObj.prototype.clone = function() {
  let clone = Object.create(this);
  clone.name = this.name + '_copy';
  return clone;
};

let original = new PrototypeObj('Original');
let copy = original.clone();
console.log(copy.name); // 输出 "Original_copy"

相关文章