前端设计模式之【工厂模式】

文章目录

  • 前言
  • 什么时候不用
  • 介绍
  • 工厂模式的流程
  • 例子
  • 优点
  • 缺陷
  • 后言

前言

hello world欢迎来到前端的新世界


😜当前文章系列专栏:前端设计模式
🐱‍👓博主在前端领域还有很多知识和技术需要掌握,正在不断努力填补技术短板。(如果出现错误,感谢大家指出)🌹
💖感谢大家支持!您的观看就是作者创作的动力

什么时候不用

当被应用到错误的问题类型上时,这一模式会给应用程序引入大量不必要的复杂性.除非为创建对象提供一个接口是我们编写的库或者框架的一个设计上目标,否则我会建议使用明确的构造器,以避免不必要的开销。

由于对象的创建过程被高效的抽象在一个接口后面的事实,这也会给依赖于这个过程可能会有多复杂的单元测试带来问题。

介绍

前端中的工厂模式是一种创建对象的设计模式,它可以让我们封装创建对象的细节,我们使用工厂方法而不是直接调用 new 关键字来创建对象,使得代码更加清晰、简洁和易于维护。在前端开发中,工厂模式通常用于创建多个相似但稍有不同的对象,比如创建一系列具有相同样式和行为的按钮或者表单。

工厂模式的流程

  +------------------+|   Client         |+------------------+||  requestsV+------------------+|   Factory        |+------------------+||  selectsV
+---------------------+
| Concrete Factory   |
+---------------------+||  createsV
+---------------------+
| Concrete Product   |
+---------------------+||  returnsV+------------------+|   Client         |+------------------+
  • 客户端(Client)向工厂对象发出请求。
  • 工厂对象(Factory)根据客户端的请求选择合适的具体工厂。
  • 具体工厂(Concrete Factory)创建所需的具体产品(Concrete Product)对象。
  • 工厂将创建的对象返回给客户端。

例子

class Product {constructor(name) {this.name = name}init() {console.log('init')}fun() {console.log('fun')}
}class Factory {create(name) {return new Product(name)}
}// use
let factory = new Factory()
let p = factory.create('p1')
p.init()
p.fun()

场景

  • 如果你不想让某个子系统与较大的那个对象之间形成强耦合,而是想运行时从许多子系统中进行挑选的话,那么工厂模式是一个理想的选择
  • 将new操作简单封装,遇到new的时候就应该考虑是否用工厂模式;
  • 需要依赖具体环境创建不同实例,这些实例都有相同的行为,这时候我们可以使用工厂模式,简化实现的过程,同时也可以减少每种对象所需的代码量,有利于消除对象间的耦合,提供更大的灵活性

优点

  • 创建对象的过程可能很复杂,但我们只需要关心创建结果。
  • 构造函数和创建者分离, 符合“开闭原则”
  • 一个调用者想创建一个对象,只要知道其名称就可以了。
  • 扩展性高,如果想增加一个产品,只要扩展一个工厂类就可以。

缺陷

增加了类的数量引入工厂模式会增加代码的复杂度,因为需要定义接口、具体工厂和具体产品等额外的类,从而增加了类的数量。

不易于扩展如果需要添加新的产品类型,就需要修改工厂类的逻辑,这违反了开闭原则(对扩展开放,对修改关闭)。

难以理解对于简单的项目,引入工厂模式可能会增加不必要的复杂性,使代码难以理解。

静态工厂方法不易被继承如果使用静态工厂方法来创建对象,则无法通过继承改变所创建的产品类型。

增加了代码的抽象程度工厂模式引入了额外的抽象层,使得代码更加抽象,可能增加理解和调试的难度。

后言

创作不易,要是本文章对广大读者有那么一点点帮助 不妨三连支持一下,您的鼓励就是博主创作的动力

本文来自互联网用户投稿,该文观点仅代表作者本人,不代表本站立场。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如若转载,请注明出处:http://www.mzph.cn/news/141801.shtml

如若内容造成侵权/违法违规/事实不符,请联系多彩编程网进行投诉反馈email:809451989@qq.com,一经查实,立即删除!

相关文章

九九乘法表c 语言

下面是用C语言打印九九乘法表的示例代码&#xff1a; #include <stdio.h>int main() {int i, j;for (i 1; i < 9; i) {for (j 1; j < i; j) {printf("%d * %d %d\t", i, j, i * j);}printf("\n");}return 0; }这段代码使用嵌套的两个循环&…

Spring-事务

EnableTransactionManagement工作原理 开启Spring事务本质上就是增加了一个Advisor&#xff0c;在使用EnableTransactionManagement注解来开启Spring事务时&#xff0c;该注解代理的功能就是向Spring容器中添加了两个Bean Import(TransactionManagementConfigurationSelector…

10 分钟学会使用 Java 多线程

大家好&#xff0c;我是伍六七。 今天阿七来聊聊 Java 程序员们面试、工作中经常会碰到的线程池。它的概念、原理、使用以及可能会碰到的一个坑。 一、Java 线程池基本概念 1、线程池的 7 个核心参数 这是 Java 初中级程序员们面试必问的面试题了&#xff0c;我们来看&…

关于start-burp抓包夜神-系统证书导入

1、开启开发中模式 2、开启USB调试 3、开启端口监听并下载start-burp证书 4、证书在线格式转换 根据该网站【在线DER格式转pem CER格式转pem CRT格式转PEM证书格式--查错网】也可以搜索其它在线转换网站进行操作 新建一个文本文件重名为【9a5ba575.0】&#xff0c;将转换的内…

elemetui 解决同个页面,同时使用多个el-table表格组件导致的数据错乱

1、背景 在一个页面中&#xff0c;使用了饿了么框架的3个el-table表格&#xff0c;3个表格平级&#xff0c;只不过是根据条件判断渲染哪个表格。本来以为使用v-if就可以隔离&#xff0c;没想到还是出现了问题&#xff0c;因为3个表格中有几列绑定的字段一模一样&#xff0c;导…

Qt高级--(1)自定义导航栏

好久没有水博客&#xff0c;参考别人的写一个自定义的导航栏吧。用处挺多的&#xff0c;可以用来切换到不同的信息显示界面。 功能点 1.默认情况下&#xff0c;文字居中显示&#xff0c;不显示图标&#xff0c;不显示三角。 2.可设置文字左侧、顶部、右侧、底部边距&#xff…

2023项目总结,感悟、矛盾与规划

背景 本人自2020年加入某创新中心&#xff0c;已经三年多了&#xff0c;只能说是日月如梭、白驹过隙。家里小孩22年出生&#xff0c;现在也2岁了。房贷、户口等比较重要的几件事竟然在不知不觉中完成了&#xff0c;今天也是有时间把相关的项目做个总结。 项目总结 1、主要科研…

PHP7使用C++扩展开发

Windows 使用【php-sdk-binary-tools】工具在windows下编译dll扩展。 php-sdk-binary-tools&#xff1a;GitHub - microsoft/php-sdk-binary-tools: Tool kit for building PHP under Windows 编译过程&#xff1a;php mb扩展 windows7,php7.4自定义扩展的编写Windows篇-CSD…

20. 深度学习 - 多层神经网络

Hi&#xff0c;你好。我是茶桁。 之前两节课的内容&#xff0c;我们讲了一下相关性、显著特征、机器学习是什么&#xff0c;KNN模型以及随机迭代的方式取获取K和B&#xff0c;然后定义了一个损失函数&#xff08;loss函数&#xff09;&#xff0c;然后我们进行梯度下降。 可以…

屏幕截图软件 Snagit mac中文版软件特点

Snagit mac是一款屏幕截图和视频录制软件&#xff0c;它可以帮助用户快速捕捉屏幕上的任何内容&#xff0c;并将其编辑、标注和共享。 Snagit mac软件特点 多种截图模式&#xff1a;支持全屏截图、窗口截图、区域截图、延时截图等多种截图模式&#xff0c;满足不同用户的需求。…

python用pychart库,实现将经纬度信息在地图上显示

python使用pyecharts对给到的经纬度数据进行位置标注&#xff0c;下面是批量更新。给入数据&#xff0c;将地图生成。实验数据在下面附件。 from pyecharts import options as opts from pyecharts.charts import Geo import osfolder_path F:\\GPS file_names os.listdir(f…

数据结构和算法八股与手撕

数据结构和算法八股文 第一章 数据结构 1.1 常见结构 见http://t.csdnimg.cn/gmc3U 1.2 二叉树重点 1.2.1 各种树的定义 满二叉树&#xff1a;只有度为0的结点和度为2的结点&#xff0c;并且度为0的结点在同一层上 完全二叉树&#xff1a;除了最底层节点可能没填满外&…

【数据结构】经典单链表OJ题!!

学习完单链表&#xff0c;习题就成了最好的巩固方式 目录 1.链表分割:思路&#xff1a;代码实现&#xff1a; 2.随机链表的复制:思路1&#xff1a;代码实现&#xff1a;思路2&#xff1a;代码实现&#xff1a; 3.环形链表:3.1环形链表1:思路&#xff1a;代码实现&#xff1a; 3…

云原生之使用Docker部署home-page个人导航页

云原生之使用Docker部署home-page个人导航页 一、home-page个人导航页介绍二、本地环境介绍2.1 本地环境规划2.2 本次实践介绍 三、本地环境检查3.1 检查Docker服务状态3.2 检查Docker版本3.3 检查docker compose 版本 四、下载home-page镜像五、部署home-page导航页5.1 创建挂…

153. 寻找旋转排序数组中的最小值

153. 寻找旋转排序数组中的最小值 已知一个长度为 n 的数组&#xff0c;预先按照升序排列&#xff0c;经由 1 到 n 次 旋转 后&#xff0c;得到输入数组。例如&#xff0c;原数组 nums [0,1,2,4,5,6,7] 在变化后可能得到&#xff1a; 若旋转 4 次&#xff0c;则可以得到 [4,…

ChatGPT 宕机?OpenAI 将中断归咎于 DDoS 攻击

您的 ChatGPT 已关闭吗&#xff1f;您是否遇到 ChatGPT 问题&#xff0c;例如连接问题或遇到“长响应时出现网络错误”&#xff1f;– ChatGPT 遭受了一系列 DDoS 攻击&#xff0c;显然是由匿名苏丹组织策划的。 OpenAI 的 ChatGPT 是一款流行的人工智能聊天机器人&#xff0c;…

Shiro快速入门之三

一、前言 接Shiro快速入门之二&#xff0c;上篇侧重于介绍认证&#xff0c;这篇介绍一下Shiro的授权&#xff0c;先初始化5张表的数据。 注&#xff1a;创建三条权限记录&#xff0c;一个admin角色分配查询和添加用户权限&#xff0c;一个账户qingcai18036授予管理员角色。 二…

OpenMMlab导出yolov3模型并用onnxruntime和tensorrt推理

导出onnx文件 直接使用脚本 import torch from mmdet.apis import init_detector, inference_detectorconfig_file ./configs/yolo/yolov3_mobilenetv2_8xb24-ms-416-300e_coco.py checkpoint_file yolov3_mobilenetv2_mstrain-416_300e_coco_20210718_010823-f68a07b3.pth…

股市助手:实时股市快讯,真人语音播报,助您第一时间获取最新资讯(自己写的分享给需要的人)

文章目录 &#x1f4d6; 介绍 &#x1f4d6;&#x1f3e1; 使用环境 &#x1f3e1;&#x1f4d2; 使用方法 &#x1f4d2;&#x1f4dd; 软件设置&#x1f4dd; 软件运行 &#x1f4d6; 介绍 &#x1f4d6; 给大家分享一款自己写的软件《股市助手》&#xff0c;老规矩&#xff…

发现一款好用的制作企业杂志网站/强推

除了展示企业的信息&#xff0c;企业杂志还可以成为员工展示自我、表达情感的电子书。你可以鼓励员工分享他们的故事、他们的想法、他们的创新。这样&#xff0c;企业杂志就成为了一个充满活力和创新的空间。 那么如何制作一本企业杂志呢&#xff1f;给大家推荐一款实用的网站&…