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

前端开发设计模式——责任链模式

目录

一、定义和特点

1. 定义

2. 特点

二、实现方式

定义抽象处理者(Handler)类

创建具体处理者(ConcreteHandler)类

构建责任链

以下是一个用 JavaScript 实现的示例:

三、应用场景

1. 表单验证

2. 请求处理管道

3. 事件处理

四、优点

解耦请求发送者和接收者

增强系统的灵活性和可扩展性

提高代码的可维护性

五、缺点

可能会导致请求处理的延迟

调试和错误处理可能会比较复杂

六、注意事项

确保责任链的合理性

处理请求的终止条件

错误处理和日志记录


一、定义和特点

1. 定义

        责任链模式是一种行为设计模式,它允许多个对象依次处理同一个请求。每个对象都有机会处理请求,如果一个对象不能处理请求,它会将请求传递给下一个对象,直到有一个对象能够处理请求或者请求到达链的末尾

2. 特点

  • 请求的发送者和接收者之间解耦,发送者不需要知道请求最终由哪个对象处理。
  • 可以动态地组合和调整处理对象的顺序,增加了系统的灵活性。
  • 处理请求的过程可以根据需要进行扩展和修改,而不影响其他部分的代码。

二、实现方式

1. 定义抽象处理者(Handler)类

        包含一个指向下一个处理者的引用和一个处理请求的抽象方法。

        抽象方法通常接受一个请求参数,并返回一个处理结果或者将请求传递给下一个处理者。

2. 创建具体处理者(ConcreteHandler)类

        继承抽象处理者类,实现处理请求的具体逻辑。

        在具体处理者类中,如果能够处理请求,则返回处理结果;如果不能处理请求,则调用下一个处理者的处理方法。

3. 构建责任链

        创建具体处理者对象,并将它们按照一定的顺序连接起来,形成一个责任链。

        可以通过在每个具体处理者的构造函数中传入下一个处理者的引用来构建责任链。

4. 以下是一个用 JavaScript 实现的示例:

class Handler {constructor() {this.nextHandler = null;}setNextHandler(handler) {this.nextHandler = handler;return handler;}handle(request) {if (this.nextHandler) {return this.nextHandler.handle(request);}return null;}
}class ConcreteHandler1 extends Handler {handle(request) {if (request === 'request1') {return `ConcreteHandler1 handled ${request}`;} else {return super.handle(request);}}
}class ConcreteHandler2 extends Handler {handle(request) {if (request === 'request2') {return `ConcreteHandler2 handled ${request}`;} else {return super.handle(request);}}
}// 使用责任链
const handler1 = new ConcreteHandler1();
const handler2 = new ConcreteHandler2();handler1.setNextHandler(handler2);console.log(handler1.handle('request1'));
console.log(handler1.handle('request2'));
console.log(handler1.handle('request3'));

三、应用场景

1. 表单验证

        可以将不同的验证规则封装成一个个具体处理者,按照一定的顺序组成责任链。当用户提交表单时,请求依次经过各个验证处理者,如果有一个验证不通过,则停止验证并返回错误信息。

2. 请求处理管道

        在前端框架中,可以使用责任链模式来构建请求处理管道。例如,一个 HTTP 请求可能需要经过身份验证、权限检查、数据处理等多个步骤,可以将这些步骤封装成不同的处理者,组成责任链进行处理。

3. 事件处理

        当一个事件发生时,可以将不同的事件处理逻辑封装成具体处理者,组成责任链进行处理。例如,在一个网页中,当用户点击按钮时,可以依次经过多个事件处理者,执行不同的操作。

四、优点

1. 解耦请求发送者和接收者

  • 发送者不需要知道请求最终由哪个对象处理,只需要将请求发送到责任链的第一个处理者即可。
  • 接收者之间也相互独立,只需要关注自己能否处理请求,不需要关心其他处理者的存在。

2. 增强系统的灵活性和可扩展性

  • 可以动态地添加、删除或调整处理者的顺序,而不影响其他部分的代码。
  • 新的处理者可以很容易地加入到责任链中,实现对请求处理的扩展。

3. 提高代码的可维护性

  • 每个处理者只负责自己的处理逻辑,代码结构清晰,易于维护和修改。
  • 当需要修改请求处理逻辑时,只需要修改相应的处理者即可,不会影响其他处理者。

五、缺点

1. 可能会导致请求处理的延迟

  • 由于请求需要依次经过多个处理者,可能会导致处理时间较长,特别是当责任链较长时。
  • 在一些对性能要求较高的场景下,可能需要考虑优化责任链的长度或者采用其他设计模式。

2. 调试和错误处理可能会比较复杂

  • 当请求在责任链中传递时,如果出现错误,可能需要跟踪整个责任链才能找到问题所在。
  • 调试责任链模式的代码可能会比较困难,因为需要了解每个处理者的具体逻辑和责任链的结构。

六、注意事项

1. 确保责任链的合理性

  • 责任链的长度应该适中,避免过长导致性能问题。
  • 处理者的顺序应该合理安排,确保请求能够按照正确的顺序被处理。

2. 处理请求的终止条件

  • 在责任链中,应该有一个明确的终止条件,当请求无法被处理时,应该返回一个适当的结果或者错误信息。
  • 避免请求在责任链中无限传递,导致系统出现死循环或性能问题。

3. 错误处理和日志记录

  • 应该对责任链中的错误进行适当的处理和记录,以便于调试和维护。
  • 可以在每个处理者中添加错误处理逻辑,或者在责任链的末尾添加一个专门的错误处理处理者。

相关文章:

前端开发设计模式——责任链模式

目录 一、定义和特点 1. 定义 2. 特点 二、实现方式 定义抽象处理者(Handler)类 创建具体处理者(ConcreteHandler)类 构建责任链 以下是一个用 JavaScript 实现的示例: 三、应用场景 1. 表单验证 2. 请求处…...

JavaWeb--MySQL

1. MySQL概述 首先来了解一下什么是数据库。 数据库:英文为 DataBase,简称DB,它是存储和管理数据的仓库。 像我们日常访问的电商网站京东,企业内部的管理系统OA、ERP、CRM这类的系统,以及大家每天都会刷的头条、抖音…...

Python | Leetcode Python题解之第564题数组嵌套

题目&#xff1a; 题解&#xff1a; class Solution:def arrayNesting(self, nums: List[int]) -> int:ans, n 0, len(nums)for i in range(n):cnt 0while nums[i] < n:num nums[i]nums[i] ni numcnt 1ans max(ans, cnt)return ans...

Spring Boot教程之Spring Boot简介

Spring Boot 简介 接下来一段时间&#xff0c;我会持续发布并完成Spring Boot教程 Spring 被广泛用于创建可扩展的应用程序。对于 Web 应用程序&#xff0c;Spring 提供了 Spring MVC&#xff0c;它是 Spring 的一个广泛使用的模块&#xff0c;用于创建可扩展的 Web 应用程序。…...

Qwen2-VL:发票数据提取、视频聊天和使用 PDF 的多模态 RAG 的实践指南

概述 随着人工智能技术的迅猛发展&#xff0c;多模态模型在各类应用场景中展现出强大的潜力和广泛的适用性。Qwen2-VL 作为最新一代的多模态大模型&#xff0c;融合了视觉与语言处理能力&#xff0c;旨在提升复杂任务的执行效率和准确性。本指南聚焦于 Qwen2-VL 在三个关键领域…...

【安全科普】NUMA防火墙诞生记

一、我为啥姓“NUMA” 随着网络流量和数据包处理需求的指数增长&#xff0c;曾经的我面对“高性能、高吞吐、低延迟”的要求&#xff0c;逐渐变得心有余而力不足。 多CPU技术应运而生&#xff0c;SMP&#xff08;对称多处理&#xff09;和NUMA&#xff08;非一致性内存访问&a…...

机器学习day2-特征工程

四.特征工程 1.概念 一般使用pandas来进行数据清洗和数据处理、使用sklearn来进行特征工程 将任意数据&#xff08;文本或图像等&#xff09;转换为数字特征&#xff0c;对特征进行相关的处理 步骤&#xff1a;1.特征提取&#xff1b;2.无量纲化&#xff08;预处理&#xf…...

Python数据分析NumPy和pandas(三十五、时间序列数据基础)

时间序列数据是许多不同领域的结构化数据的重要形式&#xff0c;例如金融、经济、生态学、神经科学和物理学。在许多时间点重复记录的任何内容都会形成一个时间序列。许多时间序列是固定频率的&#xff0c;也就是说&#xff0c;数据点根据某些规则定期出现&#xff0c;例如每 1…...

Python 小高考篇(6)常见错误及排查

目录 TypeError拼接字符串和数字错误示范正确示范 数字、字符串当成函数错误示范 给函数传入未被定义过的参数错误示范 传入的参数个数不正确错误示范 字符串相乘错误示范正确示范 量取整数的长度错误示范正确示范 格式化字符串时占位符个数不正确错误示范 给复数比较大小错误示…...

k8s上部署redis高可用集群

介绍&#xff1a; Redis Cluster通过分片&#xff08;sharding&#xff09;来实现数据的分布式存储&#xff0c;每个master节点都负责一部分数据槽&#xff08;slot&#xff09;。 当一个master节点出现故障时&#xff0c;Redis Cluster能够自动将故障节点的数据槽转移到其他健…...

C++的类和对象

在C中&#xff0c;类&#xff08;class&#xff09;和对象&#xff08;object&#xff09;是面向对象编程&#xff08;OOP&#xff09;的核心概念。以下是它们的详细介绍&#xff1a; 1. 类&#xff08;Class&#xff09; 定义&#xff1a; 类是用来定义一个新的数据类型&…...

自动驾驶系列—深入解析自动驾驶车联网技术及其应用场景

&#x1f31f;&#x1f31f; 欢迎来到我的技术小筑&#xff0c;一个专为技术探索者打造的交流空间。在这里&#xff0c;我们不仅分享代码的智慧&#xff0c;还探讨技术的深度与广度。无论您是资深开发者还是技术新手&#xff0c;这里都有一片属于您的天空。让我们在知识的海洋中…...

机器学习(1)

一、机器学习 机器学习&#xff08;Machine Learning, ML&#xff09;是人工智能&#xff08;Artificial Intelligence, AI&#xff09;的一个分支&#xff0c;它致力于开发能够从数据中学习并改进性能的算法和模型。机器学习的核心思想是通过数据和经验自动优化算法&#xff…...

深入理解 Redis跳跃表 Skip List 原理|图解查询、插入

1. 简介 跳跃表 ( skip list ) 是一种有序数据结构&#xff0c;通过在每个节点中维持多个指向其他节点的指针&#xff0c;从而达到快速访问节点的目的。 在 Redis 中&#xff0c;跳跃表是有序集合键的底层实现之一&#xff0c;那么这篇文章我们就来讲讲跳跃表的实现原理。 2. …...

Halcon HImage 与 Qt QImage 的相互转换(修订版)

很久以前&#xff0c;我写过一遍文章来介绍 HImage 和 QImage 之间的转换方法。&#xff08;https://blog.csdn.net/liyuanbhu/article/details/91356988&#xff09; 这个代码其实是有些问题的。因为我们知道 QImage 中的图像数据不一定是连续的&#xff0c;尤其是图像的宽度…...

【Golang】——Gin 框架中的模板渲染详解

Gin 框架支持动态网页开发&#xff0c;能够通过模板渲染结合数据生成动态页面。在这篇文章中&#xff0c;我们将一步步学习如何在 Gin 框架中配置模板、渲染动态数据&#xff0c;并结合静态资源文件创建一个功能完整的动态网站。 文章目录 1. 什么是模板渲染&#xff1f;1.1 概…...

CSS:导航栏三角箭头

用CSS实现导航流程图的样式。可根据自己的需求进行修改&#xff0c;代码精略的写了一下。 注&#xff1a;场景一和场景二在分辨率比较低的情况下会有一个1px的缝隙不太优雅&#xff0c;自行处理。有个方法是直接在每个外面包一个DIV&#xff0c;用动态样式设置底色。 场景一、…...

onlyoffice Command service(命令服务)使用示例

一、说明 文档在这里&#xff1a;https://api.onlyoffice.com/docs/docs-api/additional-api/command-service/ 命令服务提供有几个简单的接口封装。也提供了前端和后端同时操作文档的可能。 二、正文 命令服务地址&#xff1a;https://documentserver/coauthoring/Com…...

QSS 设置bug

问题描述&#xff1a; 在QWidget上add 一个QLabel&#xff0c;但是死活不生效 原因&#xff1a; c 主程序如下&#xff1a; QWidget* LOGO new QWidget(logo_wnd);LOGO->setFixedSize(logo_width, 41);LOGO->setObjectName("TittltLogo");QVBoxLayout* tit…...

交换排序——快速排序

交换排序——快速排序 7.7 交换排序——快速排序快速排序概念c语言的库函数qsort快速排序框架quickSort 7.7 交换排序——快速排序 快速排序概念 快速排序是Hoare于1962年提出的一种二叉树结构的交换排序方法&#xff08;下文简称快排&#xff09;&#xff0c;其基本思想为&a…...

nodejs入门(1):nodejs的前后端分离

一、引言 我关注nodejs还是从前几年做了的一个电力大数据展示系统开始的&#xff0c;当然&#xff0c;我肯定是很多年的计算机基础的&#xff0c;万变不离其宗。 现在web网站都流行所谓的前后端结构&#xff0c;不知不觉我也开始受到这个影响&#xff0c;以前都是前端直接操作…...

笔记|M芯片MAC (arm64) docker上使用 export / import / commit 构建amd64镜像

很简单的起因&#xff0c;我的东西最终需要跑在amd64上&#xff0c;但是因为mac的架构师arm64&#xff0c;所以直接构建好的代码是没办法跨平台运行的。直接在arm64上pull下来的docker镜像也都是arm64架构。 检查镜像架构&#xff1a; docker inspect 8135f475e221 | grep Arc…...

gorm框架

连接 需要下载mysql的驱动 go get gorm.io/driver/mysql go get gorm.io/gorm 约定 主键&#xff1a;GORM 使用一个名为ID 的字段作为每个模型的默认主键。表名&#xff1a;默认情况下&#xff0c;GORM 将结构体名称转换为 snake_case 并为表名加上复数形式。 例如&#xf…...

免费送源码:Java+Springboot+MySQL Springboot多租户博客网站的设计 计算机毕业设计原创定制

Springboot多租户博客网站的设计 摘 要 博客网站是当今网络的热点&#xff0c;博客技术的出现使得每个人可以零成本、零维护地创建自己的网络媒体&#xff0c;Blog站点所形成的网状结构促成了不同于以往社区的Blog文化&#xff0c;Blog技术缔造了“博客”文化。本文课题研究的“…...

【ASR技术】WhisperX安装使用

介绍 WhisperX 是一个开源的自动语音识别&#xff08;ASR&#xff09;项目&#xff0c;由 m-bain 开发。该项目基于 OpenAI 的 Whisper 模型&#xff0c;通过引入批量推理、强制音素对齐和语音活动检测等技术。提供快速自动语音识别&#xff08;large-v2 为 70 倍实时&#xf…...

【计算机网络】协议定制

一、结构化数据传输流程 这里涉及协议定制、序列化/反序列化的知识 对于序列化和反序列化&#xff0c;有现成的解决方案&#xff1a;①json ②probuff ③xml 二、理解发送接收函数 我们调用的所有发送/接收函数&#xff0c;根本就不是把数据发送到网络中&#xff01;本质都是…...

【SQL】mysql常用命令

为方便查询&#xff0c;特整理MySQL常用命令。 约定&#xff1a;$后为Shell环境命令&#xff0c;>后为MySQL命令。 1 常用命令 第一步&#xff0c;连接数据库。 $ mysql -u root -p # 进入MySQL bin目录后执行&#xff0c;回车后输入密码连接。# 常用参数&…...

阿里云引领智算集群网络架构的新一轮变革

阿里云引领智算集群网络架构的新一轮变革 云布道师 11 月 8 日~ 10 日在江苏张家港召开的 CCF ChinaNet&#xff08;即中国网络大会&#xff09;上&#xff0c;众多院士、教授和业界技术领袖齐聚一堂&#xff0c;畅谈网络未来的发展方向&#xff0c;聚焦智算集群网络的创新变…...

几何合理的分片段感知的3D分子生成 FragGen - 评测

FragGen 来源于 2024 年 3 月 25 日 预印本的文章&#xff0c;文章题目是 Deep Geometry Handling and Fragment-wise Molecular 3D Graph Generation&#xff0c; 作者是 Odin Zhang&#xff0c;侯廷军&#xff0c;浙江大学药学院。FragGen 是一个基于分子片段的 3D 分子生成模…...

Python爬虫下载新闻,Flask展现新闻(2)

上篇讲了用Python从新闻网站上下载新闻&#xff0c;本篇讲用Flask展现新闻。关于Flask安装网上好多教程&#xff0c;不赘述。下面主要讲 HTML-Flask-数据 的关系。 简洁版 如图&#xff0c;页面简单&#xff0c;主要显示新闻标题。 分页&#xff0c;使用最简单的分页技术&…...

网站模板/广州百度seo 网站推广

一、方案背景&#xff1a; 最近由于国内煤炭价格上涨&#xff0c;同时叠加国家碳中和的相关政策影响全国&#xff0c;很多地区出现了有序限电&#xff0c;甚至拉闸限电等多种情况&#xff0c;导致加油站无法正常的运作。为此&#xff0c;加油站都会配备UPS电源为加油站主机及油…...

湛江正规网站制作方案/头条新闻今日头条

树上启发式合并&#xff0c;静态链分治&#xff08;DSU&#xff09;一&#xff0c;讲解二&#xff0c;使用T1题目友好链接题解codeT2题目友好链接题解codeT3题目友好链接题解codeT4题目友好链接题解codeT5题目友好链接题解code一&#xff0c;讲解 https://www.acwing.com/solu…...

有没得办法可以查询一个网站有没得做竞价呀/360搜索推广官网

合并两个有序链表 将两个升序链表合并为一个新的升序链表并返回。新链表是通过拼接给定的两个链表的所有节点组成的。 示例&#xff1a; 输入&#xff1a;1->2->4, 1->3->4 输出&#xff1a;1->1->2->3->4->4 1.递推法 class Solution {public L…...

大连网站在哪备案/推广平台怎么做

问题描述 python中使用matplotlib包画图失败 文件开头导入matplotlib包 # 正负条形图 import matplotlib.pyplot as plt import numpy as np运行程序后报错如下&#xff1a; 引用文本 Matplotlib is currently using agg, which is a non-GUI backend, so cannot show the fi…...

商城网站的建设费用/电商网站建设报价

通常我们不用配置jdk&#xff0c;tomcat和eclipse会选取系统的环境变量获取jdk&#xff0c;但有时一个系统中部署不同的项目&#xff0c;各版本又不一样&#xff0c;不能完全兼容。 因此就需要采用自己的jdk。将jdk安装后&#xff0c;将安装后的jdk复制到别的地方&#xff0c;就…...

亿建联网站是谁做的/专业seo排名优化费用

DHCP Dynamic Host Control Protocol&#xff0c;动态主机控制协议 基本原理 1、使用bootstrap协议发送DHCP discover消息发现网络中的DHCP server&#xff08;UDP数据包&#xff0c;目的广播&#xff0c;Client提供接口MAC地址&#xff09; 2、网络中的server在收到DHCP disco…...