当前位置: 首页 > 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…...

Prompt Tuning、P-Tuning、Prefix Tuning的区别

一、Prompt Tuning、P-Tuning、Prefix Tuning的区别 1. Prompt Tuning(提示调优) 核心思想:固定预训练模型参数,仅学习额外的连续提示向量(通常是嵌入层的一部分)。实现方式:在输入文本前添加可训练的连续向量(软提示),模型只更新这些提示参数。优势:参数量少(仅提…...

智慧工地云平台源码,基于微服务架构+Java+Spring Cloud +UniApp +MySql

智慧工地管理云平台系统&#xff0c;智慧工地全套源码&#xff0c;java版智慧工地源码&#xff0c;支持PC端、大屏端、移动端。 智慧工地聚焦建筑行业的市场需求&#xff0c;提供“平台网络终端”的整体解决方案&#xff0c;提供劳务管理、视频管理、智能监测、绿色施工、安全管…...

大型活动交通拥堵治理的视觉算法应用

大型活动下智慧交通的视觉分析应用 一、背景与挑战 大型活动&#xff08;如演唱会、马拉松赛事、高考中考等&#xff09;期间&#xff0c;城市交通面临瞬时人流车流激增、传统摄像头模糊、交通拥堵识别滞后等问题。以演唱会为例&#xff0c;暖城商圈曾因观众集中离场导致周边…...

如何为服务器生成TLS证书

TLS&#xff08;Transport Layer Security&#xff09;证书是确保网络通信安全的重要手段&#xff0c;它通过加密技术保护传输的数据不被窃听和篡改。在服务器上配置TLS证书&#xff0c;可以使用户通过HTTPS协议安全地访问您的网站。本文将详细介绍如何在服务器上生成一个TLS证…...

相机Camera日志分析之三十一:高通Camx HAL十种流程基础分析关键字汇总(后续持续更新中)

【关注我,后续持续新增专题博文,谢谢!!!】 上一篇我们讲了:有对最普通的场景进行各个日志注释讲解,但相机场景太多,日志差异也巨大。后面将展示各种场景下的日志。 通过notepad++打开场景下的日志,通过下列分类关键字搜索,即可清晰的分析不同场景的相机运行流程差异…...

12.找到字符串中所有字母异位词

&#x1f9e0; 题目解析 题目描述&#xff1a; 给定两个字符串 s 和 p&#xff0c;找出 s 中所有 p 的字母异位词的起始索引。 返回的答案以数组形式表示。 字母异位词定义&#xff1a; 若两个字符串包含的字符种类和出现次数完全相同&#xff0c;顺序无所谓&#xff0c;则互为…...

人机融合智能 | “人智交互”跨学科新领域

本文系统地提出基于“以人为中心AI(HCAI)”理念的人-人工智能交互(人智交互)这一跨学科新领域及框架,定义人智交互领域的理念、基本理论和关键问题、方法、开发流程和参与团队等,阐述提出人智交互新领域的意义。然后,提出人智交互研究的三种新范式取向以及它们的意义。最后,总结…...

C#中的CLR属性、依赖属性与附加属性

CLR属性的主要特征 封装性&#xff1a; 隐藏字段的实现细节 提供对字段的受控访问 访问控制&#xff1a; 可单独设置get/set访问器的可见性 可创建只读或只写属性 计算属性&#xff1a; 可以在getter中执行计算逻辑 不需要直接对应一个字段 验证逻辑&#xff1a; 可以…...

uniapp 字符包含的相关方法

在uniapp中&#xff0c;如果你想检查一个字符串是否包含另一个子字符串&#xff0c;你可以使用JavaScript中的includes()方法或者indexOf()方法。这两种方法都可以达到目的&#xff0c;但它们在处理方式和返回值上有所不同。 使用includes()方法 includes()方法用于判断一个字…...

恶补电源:1.电桥

一、元器件的选择 搜索并选择电桥&#xff0c;再multisim中选择FWB&#xff0c;就有各种型号的电桥: 电桥是用来干嘛的呢&#xff1f; 它是一个由四个二极管搭成的“桥梁”形状的电路&#xff0c;用来把交流电&#xff08;AC&#xff09;变成直流电&#xff08;DC&#xff09;。…...