【设计模式】01- 一文理解常用设计模式-“创建型模式”篇

一、前言

最近在复习设计模式，撰写、整理了内容和代码片段，和大家一起交流学习。

设计模式是软件设计中常见问题的典型解决方案。

二、模式分类

模式可以根据其意图或目的来分类。常见的设计模式包括：

创建型模式提供创建对象的机制，增加已有代码的灵活性和可复用性；

结构型模式介绍如何将对象和类组装成较大的结构，并同时保持结构的灵活和高效；

行为型模式负责对象间的高效沟通和职责委派；

本篇文章介绍创建型模式，后续会更新其他两类设计模式。

三、创建型模式概述

创建型模式主要用于对象的创建过程，它隐藏了对象的创建逻辑，使得代码更具灵活性和可维护性。

四、常见创建型模式（配合代码）

1、单例模式（Singleton Pattern）：

确保一个类只有一个实例，并提供一个全局访问点来访问这个实例。

// 单例模式示例
const Singleton = (function () {let instance;function createInstance() {const object = new Object({ name: 'Singleton Object' });return object;}return {getInstance: function () {if (!instance) {instance = createInstance();}return instance;}};}());// 使用示例const instance1 = Singleton.getInstance();const instance2 = Singleton.getInstance();console.log(instance1 === instance2); // 输出: true

代码运行结果

2、工厂模式（Factory Pattern）：

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

解释：工厂模式就像一个工厂，根据不同的需求生产不同的产品。你只需要告诉工厂你需要什么，工厂就会帮你创建出来。

// 工厂模式示例
function CarFactory() {this.createCar = function (type) {let car;if (type === 'sedan') {car = new Sedan();} else if (type === 'suv') {car = new SUV();}car.drive = function () {console.log(`Driving a ${this.constructor.name}`);};return car;};
}

function Sedan() {this.type = 'Sedan';
}

function SUV() {this.type = 'SUV';
}

// 使用示例
const factory = new CarFactory();
const sedan = factory.createCar('sedan');
const suv = factory.createCar('suv');

sedan.drive(); // 输出: Driving a Sedan
suv.drive();   // 输出: Driving a SUV

代码运行结果

3、抽象工厂模式（Abstract Factory Pattern）：

提供一个创建一系列相关或相互依赖对象的接口，而无需指定它们具体的类。

简单理解：就像一个超级工厂，能生产不同品牌的汽车系列产品。

// 抽象工厂模式示例
// 抽象工厂
function AbstractCarFactory() {this.createEngine = function () {throw new Error('This method must be overridden!');};this.createWheel = function () {throw new Error('This method must be overridden!');};
}

// 具体工厂：丰田工厂
function ToyotaFactory() {AbstractCarFactory.call(this);this.createEngine = function () {return new ToyotaEngine();};this.createWheel = function () {return new ToyotaWheel();};
}

// 具体工厂：本田工厂
function HondaFactory() {AbstractCarFactory.call(this);this.createEngine = function () {return new HondaEngine();};this.createWheel = function () {return new HondaWheel();};
}

// 丰田发动机
function ToyotaEngine() {this.start = function () {console.log('Toyota engine started');};
}

// 丰田车轮
function ToyotaWheel() {this.rotate = function () {console.log('Toyota wheel rotating');};
}
// 本田发动机
function HondaEngine() {this.start = function () {console.log('Honda engine started');};
}

// 本田车轮
function HondaWheel() {this.rotate = function () {console.log('Honda wheel rotating');};
}

// 使用示例
const toyotaFactory = new ToyotaFactory();
const toyotaEngine = toyotaFactory.createEngine();
const toyotaWheel = toyotaFactory.createWheel();

toyotaEngine.start(); // 输出: Toyota engine started
toyotaWheel.rotate(); // 输出: Toyota wheel rotating

const hondaFactory = new HondaFactory();
const hondaEngine = hondaFactory.createEngine();
const hondaWheel = hondaFactory.createWheel();

hondaEngine.start(); // 输出: Honda engine started
hondaWheel.rotate(); // 输出: Honda wheel rotating

代码运行结果

4、建造者模式（Builder Pattern）：

将一个复杂对象的构建与表示分离，使得同样的构建过程可以创建不同的表示。

简单理解：就像建造房子，有不同的建造步骤，最终可以建成不同风格的房子。

// 建造者模式示例
// 产品类：汽车
function Car() {this.wheels = null;this.engine = null;this.color = null;
this.showInfo = function () {console.log(`Car with ${this.wheels} wheels, ${this.engine} engine and ${this.color} color`);};
}

// 建造者类
function CarBuilder() {this.car = new Car();
this.setWheels = function (wheels) {this.car.wheels = wheels;return this;};
this.setEngine = function (engine) {this.car.engine = engine;return this;};
this.setColor = function (color) {this.car.color = color;return this;};
this.build = function () {return this.car;};
}

// 使用示例
const builder = new CarBuilder();
const car = builder.setWheels(4).setEngine('V8').setColor('Red').build();

car.showInfo(); // 输出: Car with 4 wheels, V8 engine and Red color

代码运行结果

5、原型模式（Prototype Pattern）：

用原型实例指定创建对象的种类，并且通过拷贝这些原型创建新的对象。

简单理解：就像复印文件，有一个原始文件作为模板，然后可以复印出很多份一样的文件。

// 原型模式示例
const carPrototype = {brand: 'Unknown',model: 'Unknown',start: function () {console.log(`Starting the ${this.brand} ${this.model}`);},clone: function () {const clone = Object.create(this);return clone;}
};

// 使用示例
const car1 = carPrototype.clone();
car1.brand = 'Toyota';
car1.model = 'Corolla';

const car2 = carPrototype.clone();
car2.brand = 'Honda';
car2.model = 'Civic';

car1.start(); // 输出: Starting the Toyota Corolla
car2.start(); // 输出: Starting the Honda Civic

代码运行结果