设计模式之工厂模式

设计模式,工厂,模式 · 浏览次数 : 5

小编点评

**定义** 在父类中提供一个创建对象的方法，允许子类决定实例化对象的类型。 **工厂模式** 工厂模式是一种设计模式，其核心思想是在设计中，将不同的生产过程委托给专门的生产线，以提高代码可读性和可维护性。 **流程** 1. 客户直接找对应的生产线。 2. 前台向生产线提供需求。 3. 生产线根据需求构建产品并将其交付给客户。 **示例** ``` // 使用工厂模式创建一个生产线 const productionLine = factory.createProductionLine(); // 客户只需要找工厂前台，工厂前台会通知对应的生产线，并将生产好的产品交付给客户 ``` **代码示例** ``` // factory.js export function createProductionLine() { return { build: function() { // 生产线构建过程 }, deliver: function(customer) { // 生产线将产品交付给客户 } }; } ``` **总结** 1. 单一职责原则：每个生产线只负责生产自己的产品。 2. 开闭原则：允许在需要时添加新的产品线。 3. 拦截并调度的作用：可以拦截并处理生产线请求，例如处理库存或订单处理等。

正文

1. 定义

在父类中提供一个创建对象的方法，允许子类决定实例化对象的类型

2. 口语化举例

工厂里组装台灯，流程、配件等有多种方式，每种台灯有自己的生产线

现在，需要某一种台灯，一种方式是直接去找这个台灯的生产线生成，这会令人烦恼，因为寻找是一件无聊而繁琐的事情

另一种方式是成立一个工厂前台，需要什么台灯就只需要给前台说明，前台会告诉对应的生产线，并将生产好的台灯交付给你

这流程就简单多了，不管是谁来，他都只需和前台联系，然后工厂就会给他对应的产品，这就是工厂模式

（下面的描述会沿用这个上述这个场景）

3. 图表示例

未使用工厂模式之前，客户直接找对应的生产线

graph LR 生产线A --> 客户A --> 生产线A 生产线A --> 客户B --> 生产线A 生产线B --> 客户A --> 生产线B 生产线B --> 客户B --> 生产线B 生产线C --> 客户A --> 生产线C 生产线C --> 客户B --> 生产线C

使用工厂模式之后，客户只需找工厂前台，工厂前台接受需求并给出产品

graph LR 生产线A --> 工厂前台生产线B --> 工厂前台 --> 客户A --> 工厂前台生产线C --> 工厂前台 --> 客户B --> 工厂前台

4. 源码示例

广为人知，Vue使用虚拟DOM，虚拟DOM的节点称为VNode

参考Vue官方文档：渲染函数 & JSX | Vue.js (vuejs.org)，创建一个VNode只需要一个h()函数

然而这个VNode是很复杂的，它具有众多的参数、类型，最后它会返回一个VNode

它的调用过程大致如下：

graph LR h函数 --> createVNode函数 --> _createVNode函数 --> createBaseVNode函数

VNode有多种，但是你只需调用h()函数即可获得各种VNode

5. 总结

5.1 设计原则

单一职责原则

每个生产线只负责生产自己的产品，前台只负责通知调度，职责明确
开闭原则

要添加新的产品线只需告诉前台即可

5.2 适用场景

无法预知对象确切类别及其依赖关系时，可使用工厂方法

无法确定每次具体生产什么，所以前台来协商客户并告知工厂生产线
构建能扩展的软件库或框架的内部组件，可使用工厂方法

前台的存在使得要添加新的产品线只需告诉前台即可
复用现有对象来节省系统资源，而不是每次都重新创建对象，可使用工厂方法

前台具有拦截并调度的作用，如果要生产的产品有库存，前台可以直接交付给客户，无需再告诉生产线

6. 参考资料

[1] 工厂方法设计模式 (refactoringguru.cn)

[2] 渲染函数 & JSX | Vue.js (vuejs.org)