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

UE5 学习系列(二)用户操作界面及介绍

这篇博客是 UE5 学习系列博客的第二篇&#xff0c;在第一篇的基础上展开这篇内容。博客参考的 B 站视频资料和第一篇的链接如下&#xff1a; 【Note】&#xff1a;如果你已经完成安装等操作&#xff0c;可以只执行第一篇博客中 2. 新建一个空白游戏项目 章节操作&#xff0c;重…...

未来机器人的大脑:如何用神经网络模拟器实现更智能的决策?

编辑&#xff1a;陈萍萍的公主一点人工一点智能 未来机器人的大脑&#xff1a;如何用神经网络模拟器实现更智能的决策&#xff1f;RWM通过双自回归机制有效解决了复合误差、部分可观测性和随机动力学等关键挑战&#xff0c;在不依赖领域特定归纳偏见的条件下实现了卓越的预测准…...

在鸿蒙HarmonyOS 5中实现抖音风格的点赞功能

下面我将详细介绍如何使用HarmonyOS SDK在HarmonyOS 5中实现类似抖音的点赞功能&#xff0c;包括动画效果、数据同步和交互优化。 1. 基础点赞功能实现 1.1 创建数据模型 // VideoModel.ets export class VideoModel {id: string "";title: string ""…...

最新SpringBoot+SpringCloud+Nacos微服务框架分享

文章目录 前言一、服务规划二、架构核心1.cloud的pom2.gateway的异常handler3.gateway的filter4、admin的pom5、admin的登录核心 三、code-helper分享总结 前言 最近有个活蛮赶的&#xff0c;根据Excel列的需求预估的工时直接打骨折&#xff0c;不要问我为什么&#xff0c;主要…...

土地利用/土地覆盖遥感解译与基于CLUE模型未来变化情景预测;从基础到高级,涵盖ArcGIS数据处理、ENVI遥感解译与CLUE模型情景模拟等

&#x1f50d; 土地利用/土地覆盖数据是生态、环境和气象等诸多领域模型的关键输入参数。通过遥感影像解译技术&#xff0c;可以精准获取历史或当前任何一个区域的土地利用/土地覆盖情况。这些数据不仅能够用于评估区域生态环境的变化趋势&#xff0c;还能有效评价重大生态工程…...

IoT/HCIP实验-3/LiteOS操作系统内核实验(任务、内存、信号量、CMSIS..)

文章目录 概述HelloWorld 工程C/C配置编译器主配置Makefile脚本烧录器主配置运行结果程序调用栈 任务管理实验实验结果osal 系统适配层osal_task_create 其他实验实验源码内存管理实验互斥锁实验信号量实验 CMISIS接口实验还是得JlINKCMSIS 简介LiteOS->CMSIS任务间消息交互…...

精益数据分析(97/126):邮件营销与用户参与度的关键指标优化指南

精益数据分析&#xff08;97/126&#xff09;&#xff1a;邮件营销与用户参与度的关键指标优化指南 在数字化营销时代&#xff0c;邮件列表效度、用户参与度和网站性能等指标往往决定着创业公司的增长成败。今天&#xff0c;我们将深入解析邮件打开率、网站可用性、页面参与时…...

JVM虚拟机:内存结构、垃圾回收、性能优化

1、JVM虚拟机的简介 Java 虚拟机(Java Virtual Machine 简称:JVM)是运行所有 Java 程序的抽象计算机,是 Java 语言的运行环境,实现了 Java 程序的跨平台特性。JVM 屏蔽了与具体操作系统平台相关的信息,使得 Java 程序只需生成在 JVM 上运行的目标代码(字节码),就可以…...

基于Springboot+Vue的办公管理系统

角色&#xff1a; 管理员、员工 技术&#xff1a; 后端: SpringBoot, Vue2, MySQL, Mybatis-Plus 前端: Vue2, Element-UI, Axios, Echarts, Vue-Router 核心功能&#xff1a; 该办公管理系统是一个综合性的企业内部管理平台&#xff0c;旨在提升企业运营效率和员工管理水…...

【学习笔记】erase 删除顺序迭代器后迭代器失效的解决方案

目录 使用 erase 返回值继续迭代使用索引进行遍历 我们知道类似 vector 的顺序迭代器被删除后&#xff0c;迭代器会失效&#xff0c;因为顺序迭代器在内存中是连续存储的&#xff0c;元素删除后&#xff0c;后续元素会前移。 但一些场景中&#xff0c;我们又需要在执行删除操作…...