当前位置: 首页 > news >正文

前端需要理解的设计模式知识

设计模式的原则:1. 单一职责原则(一个对象或方法只做一件事) 2. 最少知识原则(尽可能少的实体或对象间互相作用) 3. 开放封闭原则(软件实体具有可扩展且不可修改)

设计模式是通过代码设计经验总结出的解决问题的一系列套路。

1 单例模式

保证只有一个实例且提供全局访问点。

优点是避免频繁创建和销毁实例,减少内存占用。缺点是不适合需动态扩展对象或创建多个相似对象的场景。

应用于:1. 第三方库的引入 2. 弹窗 3. 购物车 4.全局状态管理(vuex) 5. 连接数据库的线程池。

JavaScript单线程,不涉及同步锁的问题。

模式实现:

惰性弹窗:

 

2 发布-订阅模式

基于一个事件(主题)通道,接收对象subscriber通过自定义事件订阅主题,被激活的对象publisher通过发布主题通知订阅该主题的subscriber。常规是订阅后,发布才通知,也可订阅后,获取之前发布的通知。

优点是时间解耦(实现异步)、空间解耦,弱化对象实体间的引用关系,事件中心可更细粒度处理。缺点是复杂场景不易追踪维护和理解,事件中心等额外时间内存开销。

应用:1. JQuery的on 2. vue的响应式 3. vue父子组件通信$on / $emit

模式实现:

 

相关文章:

前端需要理解的设计模式知识

设计模式的原则:1. 单一职责原则(一个对象或方法只做一件事) 2. 最少知识原则(尽可能少的实体或对象间互相作用) 3. 开放封闭原则(软件实体具有可扩展且不可修改) 设计模式是通过代码设计经验总…...

1、攻防世界第一天

1、网站目录下会有一个robots.txt文件,规定爬虫可以/不可以爬取的网站。 2、URL编码细则:URL栏中字符若出现非ASCII字符,则对其进行URL编码,浏览器将该请求发给服务端;服务端会可能会先对收到的url进行解码&#xff0…...

分布式事务(7):SpringCloud2.0整合LCN

目前LCN版本已经升级为4.0了,但是官方没有SpringCloud2.0的demo案例。 因为LCN本身是开源的,有些大神对LCN框架源码做修改,可以支持SpringCloud2.0版本。 下载地址:https://download.csdn.net/download/u013938578/88251904 1 下载LCN服务端源码 https://download.csdn.…...

机器学习实战14-在日本福岛核电站排放污水的背景下,核电站对人口影响的分析实践

大家好,我是微学AI,今天给大家介绍一下机器学习实战14-在日本福岛核电站排放污水的背景下,核电站对人口影响的分析实践。 近日,日本政府举行内阁成员会议,决定于2023年8月24日启动福岛核污染水排海。当地时间2023年8月24日13时&am…...

4G智慧电力物联网:建设高效智能,引领电力行业革新!

随着4G与物联网技术的快速发展为电力行业提供了更高效、可靠、智能化的解决方案。本文中智联物联将为大家分享智慧电力系统中的一些关键的物联网技术和通讯设备,如工业4G路由器、分布式发电站、数据采集传输、远程监控管理以及变电站监测。 光伏发电站是电力行业中重…...

安防视频监控平台EasyCVR视频集中存储平台接入RTSP设备出现离线情况的问题解决方案

安防视频监控/视频集中存储/云存储/磁盘阵列EasyCVR平台可拓展性强、视频能力灵活、部署轻快,可支持的主流标准协议有国标GB28181、RTSP/Onvif、RTMP等,以及支持厂家私有协议与SDK接入,包括海康Ehome、海大宇等设备的SDK等。平台既具备传统安…...

达梦数据库分区表介绍

概述 本文将对达梦数据库分区表概念、创建、维护进行介绍。 1.分区表概念 1.1 分区表使用场景 近几年,随着移动支付快速发展,银行交易系统中【移动小微支付场景】使用越来越多,系统中流水账单表数据量巨大,往往上TB。 为了提高…...

Python爬虫库之urllib使用详解

一、Python urllib库 Python urllib 库用于操作网页 URL,并对网页的内容进行抓取处理。 Python3 的 urllib。 urllib 包 包含以下几个模块: urllib.request - 打开和读取 URL。 urllib.error - 包含 urllib.request 抛出的异常。 urllib.parse - 解…...

SpringCloud学习笔记(八)_使用Apollo做配置中心

由于Apollo支持的图形化界面相对于我们更加的友好,所以此次我们使用Apollo来做配置中心 本篇文章实现了使用Apollo配置了dev和fat两个环境下的属性配置。 Apollo官方文档https://github.com/ctripcorp/apollo/wiki 1.下载依赖 从https://github.com/ctripcorp/apo…...

jvs-rules(规则引擎)更新:新增功能介绍

jvs-rules更新内容 1.复合变量新增数据补充节点,实现请求回来的数据再以入参方式请求其他数据进行数据补充(例如通过参数A,请求回数据B,再以数据B为入参,请求回数据C) 2.规则流结束节点支持新增、新建、引…...

消息队列的消息异常处理

目录 1.如果消费端发生异常导致消息消费失败,补偿策略是什么 2.消息队列重试的话,如何保证消费的幂等性? 3.消息重发机制 1.如果消费端发生异常导致消息消费失败,补偿策略是什么 生产者发送消息失败: 设置mandato…...

APP上线为什么要提前部署安全产品呢?

一般平台刚上线或者日活跃量比较高的时候,很容易成为攻击者的目标,服务器如果遭遇黑客攻击,资源耗尽会导致平台无法访问,业务也无法正常开展,服务器一旦触发黑洞机制,就会被拉进黑洞很长一段时间&#xff0…...

SQL注入之HTTP头部注入

文章目录 cookie注入练习获取数据库名称获取版本号 base64注入练习获取数据库名称获取版本号 user-agent注入练习获取数据库名称获取版本号 cookie注入练习 向服务器传参三大基本方法:GPC GET方法,参数在URL中 POST,参数在body中 COOKIE,参数…...

软考高级系统架构设计师系列论文九十七:论软件三层结构的设计

软考高级系统架构设计师系列论文九十七:论软件三层结构的设计 一、软件结构相关知识点二、摘要三、正文四、总结一、软件结构相关知识点 软考高级系统架构设计师:软件架构设计系列二二、摘要 随着中间件与Web技术的发展,三层或多层分布式应用体系越来越流行。在这种体系结构…...

【C++心愿便利店】No.2---函数重载、引用

文章目录 前言🌟一、函数重载🌏1.1.函数重载概念🌏1.2.C支持函数重载的原理 -- 名字修饰 🌟二、引用🌏2.1.引用的概念🌏2.2.引用特性🌏2.3.常引用🌏2.4.使用场景🌏2.5.传…...

掌握Six Sigma:逐步解锁业务流程优化的秘密之匙

一、Six Sigma方法简介 1. Six Sigma的起源和概念 Six Sigma起源于1980年代的摩托罗拉公司。当时的摩托罗拉在面临激烈的全球竞争和持续的质量问题时,发明了这种系统的管理方法,并通过实施,获得了显著的成绩。 所谓的“Six Sigma”&#x…...

Python中使用print()时如何实现不换行

平时刷题的时候大家可能会发现打印字符的时候需要你不换行才能得到正确答案,那么如何实现的。下面直接看例子。 使用print()函数时其实还有个默认的参数end,来看看具体怎么回事 list [a,b,c] for i in list:print(i)打印结果: 这是不加参…...

WordPress使用子主题插件 Child Theme Wizard,即使主题升级也能够保留以前主题样式

修改WordPress网站样式,主题升级会导致自己定义设置的网站样式丢失,还需要重新设置,很繁琐工作量大,发现在WordPress 中有Child Theme Wizard子主题插件,使用Child Theme Wizard子主题插件,即使主题升级&am…...

人员跌倒检测识别预警

人员跌倒检测识别预警系统通过pythonopencv深度学习网络模型架构,人员跌倒检测识别预警系统实时监测老人的活动状态,通过图像识别和行为分析算法,对老人的姿态、步态等进行检测和识别,一旦系统检测到跌倒事件,立即发出…...

C#,《小白学程序》第二课:数组与排序

1 文本格式 /// <summary> /// 《小白学程序》第二课&#xff1a;数组与排序 /// </summary> /// <param name"sender"></param> /// <param name"e"></param> private void button2_Click(object sender, EventArgs …...

从WWDC看苹果产品发展的规律

WWDC 是苹果公司一年一度面向全球开发者的盛会&#xff0c;其主题演讲展现了苹果在产品设计、技术路线、用户体验和生态系统构建上的核心理念与演进脉络。我们借助 ChatGPT Deep Research 工具&#xff0c;对过去十年 WWDC 主题演讲内容进行了系统化分析&#xff0c;形成了这份…...

Day131 | 灵神 | 回溯算法 | 子集型 子集

Day131 | 灵神 | 回溯算法 | 子集型 子集 78.子集 78. 子集 - 力扣&#xff08;LeetCode&#xff09; 思路&#xff1a; 笔者写过很多次这道题了&#xff0c;不想写题解了&#xff0c;大家看灵神讲解吧 回溯算法套路①子集型回溯【基础算法精讲 14】_哔哩哔哩_bilibili 完…...

(二)TensorRT-LLM | 模型导出(v0.20.0rc3)

0. 概述 上一节 对安装和使用有个基本介绍。根据这个 issue 的描述&#xff0c;后续 TensorRT-LLM 团队可能更专注于更新和维护 pytorch backend。但 tensorrt backend 作为先前一直开发的工作&#xff0c;其中包含了大量可以学习的地方。本文主要看看它导出模型的部分&#x…...

Vue2 第一节_Vue2上手_插值表达式{{}}_访问数据和修改数据_Vue开发者工具

文章目录 1.Vue2上手-如何创建一个Vue实例,进行初始化渲染2. 插值表达式{{}}3. 访问数据和修改数据4. vue响应式5. Vue开发者工具--方便调试 1.Vue2上手-如何创建一个Vue实例,进行初始化渲染 准备容器引包创建Vue实例 new Vue()指定配置项 ->渲染数据 准备一个容器,例如: …...

【论文笔记】若干矿井粉尘检测算法概述

总的来说&#xff0c;传统机器学习、传统机器学习与深度学习的结合、LSTM等算法所需要的数据集来源于矿井传感器测量的粉尘浓度&#xff0c;通过建立回归模型来预测未来矿井的粉尘浓度。传统机器学习算法性能易受数据中极端值的影响。YOLO等计算机视觉算法所需要的数据集来源于…...

python爬虫:Newspaper3k 的详细使用(好用的新闻网站文章抓取和解析的Python库)

更多内容请见: 爬虫和逆向教程-专栏介绍和目录 文章目录 一、Newspaper3k 概述1.1 Newspaper3k 介绍1.2 主要功能1.3 典型应用场景1.4 安装二、基本用法2.2 提取单篇文章的内容2.2 处理多篇文档三、高级选项3.1 自定义配置3.2 分析文章情感四、实战案例4.1 构建新闻摘要聚合器…...

第一篇:Agent2Agent (A2A) 协议——协作式人工智能的黎明

AI 领域的快速发展正在催生一个新时代&#xff0c;智能代理&#xff08;agents&#xff09;不再是孤立的个体&#xff0c;而是能够像一个数字团队一样协作。然而&#xff0c;当前 AI 生态系统的碎片化阻碍了这一愿景的实现&#xff0c;导致了“AI 巴别塔问题”——不同代理之间…...

Java 二维码

Java 二维码 **技术&#xff1a;**谷歌 ZXing 实现 首先添加依赖 <!-- 二维码依赖 --><dependency><groupId>com.google.zxing</groupId><artifactId>core</artifactId><version>3.5.1</version></dependency><de…...

return this;返回的是谁

一个审批系统的示例来演示责任链模式的实现。假设公司需要处理不同金额的采购申请&#xff0c;不同级别的经理有不同的审批权限&#xff1a; // 抽象处理者&#xff1a;审批者 abstract class Approver {protected Approver successor; // 下一个处理者// 设置下一个处理者pub…...

【WebSocket】SpringBoot项目中使用WebSocket

1. 导入坐标 如果springboot父工程没有加入websocket的起步依赖&#xff0c;添加它的坐标的时候需要带上版本号。 <dependency><groupId>org.springframework.boot</groupId><artifactId>spring-boot-starter-websocket</artifactId> </dep…...