策略模式——多重if-else解决方案
概念
大量的 if 判断操作，逻辑比较复杂，并且处理起来相对麻烦。可以采用策略模式来优化分支代码。
策略模式 💤：是一种行为设计模式，它允许你在运行时根据不同情况选择不同的算法或行为。
设计模式 🤌：就是提前第一次了解全过程，第二次直接规划不必要的坑。
我们在写代码亦是如此，一定也遇到过许多类似的场景。随着程序员经验的增加，我们对于这些常见场景的处理越来越得心应手，甚至总结出了针对性的“套路”，下次遇到此类问题直接运用“套路”解决，省心又省力。这些在软件开发过程中逐渐积累下来的“套路”就是设计模式。
设计模式的目标之一就是提高代码的可复用性、可扩展性和可维护性。正因如此，虽然有时候我们不知道某个设计模式，但是看了相关书籍或文章后会有一种“啊，原来这就是设计模式”的恍然大明白。
例：
const game = (name) => {if (name === "原s") {console.log("启动！");} else if (name === "xx精英") {console.log("我先成盒了你们加油！");} else if (name === "云顶yy") {console.log("这就是我们之间的羁绊！");} else if (name === "王者zz") {console.log("我再也不买皮肤了！");} else {console.log("我啥也没玩");}
};
game("原s"); // 启动！
简单优化一下写法：
const game = (name) => {let obj = {原s: "启动！",xx精英: "我先成盒了你们加油！",云顶yy: "这就是我们之间的羁绊！",王者zz: "我再也不买皮肤了！",};if (obj[name]) {console.log(obj[name]);} else {console.log("我啥也没玩");}
};
game("原s"); // 启动！
这种写法只是参考了策略模式的思路，将逻辑封装到一个对象中。这种方式使得这个对象能够独立出来，只需专注于维护这个对象本身即可。如果要是每个方法都不同，那该如何去写呢?接着往下看
const game = (name) => {let obj = {原s: () => {console.log("启动！");},xx精英: () => {console.log("我先成盒了你们加油！");},云顶yy: () => {console.log("这就是我们之间的羁绊！");},王者zz: () => {console.log("我再也不买皮肤了！");},};if (obj[name]) {obj[name]();} else {console.log("我啥也没玩");}
};game("原s"); // 启动！
这种写法就是将对象中的处理逻辑单独封装成一个函数，让他内部自己处理自己所用到的逻辑。
下面这种写法代码更加灵活和可扩展，也是我比较推荐的写法。
const strategies = {原s: () => console.log("启动！"),xx精英: () => console.log("我先成盒了你们加油！"),云顶yy: () => console.log("这就是我们之间的羁绊！"),王者zz: () => console.log("我再也不买皮肤了！"),
};function executeStrategy(name) {if (strategies[name]) {strategies[name]();} else {console.log("我啥也没玩");}
}executeStrategy("原s");
在这个例子里面，我们可以将游戏名作为参数传递给函数，而不是在函数内部定义多个条件。这样，我们就可以将函数封装成一个可复用的策略，以便在将来添加更多的游戏名称。
1. 案例
下面看一下使用场景，比如我们需要做一个 from 表单验证，需要验证手机号和密码
<!DOCTYPE html>
<html lang="en"><head><meta charset="UTF-8" /><meta name="viewport" content="width=device-width, initial-scale=1.0" /><title>表单</title><script src="./src/index.js"></script></head><body><form id="login-form" action="" method="post"><label for="account">手机号</label><input type="number" id="account" name="account" /><label for="password">密码</label><input type="password" id="password" name="password" /><button id="login">登录</button></form><script>let loginForm = document.getElementById("login-form");loginForm.onsubmit = function (e) {e.preventDefault();let account = document.getElementById("account").value;let pwd = document.getElementById("password").value;if (account === null || account === "") {console.log("手机号不能为空");return false;}if (pwd === null || pwd === "") {console.log("密码不能为空");return false;}if (!/(^1[3|4|5|7|8][0-9]{9}$)/.test(account)) {console.log("手机号格式错误");return false;}if (pwd.length < 6) {console.log("密码不能小于六位");return false;}// 模拟ajax请求setTimeout(() => {console.log("登录成功！");}, 1000);};</script></body>
</html>
在这里可以发现问题也是很明显的，如果你想说他能跑起来吗？他也能跑起来，但是里面的 if 语句到处都是，每次新增一种校验，需要整体去调整这个 loginForm.onsubmit 代码，复用性也很差，只能手动矫正
2. 优化
先将此方法抽离出来
let obj = {isNonEmpty: function (value, errorMsg) {if (value === "" || value === null) {return errorMsg;}},isMobile: function (value, errorMsg) {// 手机号码正则if (!/(^1[3|4|5|7|8][0-9]{9}$)/.test(value)) {return errorMsg;}},minLength: function (value, errorMsg) {if (value.length < length) {return errorMsg;}},
};
修改 Context 内容部分
let loginForm = document.getElementById("loginForm");loginForm.onsubmit = function (e) {e.preventDefault();let phone = strategies.isMobile(account, "手机号格式错误");let pwdMinLength = strategies.minLength(pwd, "密码不能小于六位");let error = accountIsMobile || pwdMinLength;if (error) {console.log(error);return false;}
};
完整代码如下
<div><form id="loginform" action="" method="post"><label for="account">手机号</label><input type="number" id="account" name="account" /><label for="password">密码</label><input type="password" id="password" name="password" /><button id="login">登录</button></form>
</div>
let account = ""; // 这里的变量需要初始化一下，不然无法获取到value
let pwd = "";let loginForm = document.getElementById("loginform");
let strategies = {isNonEmpty: function (value, errorMsg) {if (value === "" || value === null) {return errorMsg;}},isMobile: function (value, errorMsg) {// 手机号码格式if (!/(^1[3|4|5|7|8][0-9]{9}$)/.test(value)) {return errorMsg;}},minLength: function (value, length, errorMsg) {console.log(value);if (value.length < length) {return errorMsg;}},
};loginForm.addEventListener("submit", (e) => {account = document.getElementById("account").value;pwd = document.getElementById("password").value;e.preventDefault();let phonenull = strategies.isNonEmpty(account, "手机号不能为空");let phone = strategies.isMobile(account, "手机号格式错误");let pwdMinLength = strategies.minLength(pwd, 6, "密码不能小于六位");let error = phonenull || phone || pwdMinLength;if (error) {console.log(error);return false;} else {console.log("提交成功！");}
});
相关文章：
策略模式——多重if-else解决方案
概念 大量的 if 判断操作，逻辑比较复杂，并且处理起来相对麻烦。可以采用策略模式来优化分支代码。 策略模式 💤：是一种行为设计模式，它允许你在运行时根据不同情况选择不同的算法或行为。 设计模式 🤌&…...
CTAmap 1.12版本2013年-2023年省市县矢量数据更新
中国行政区划数据CTAmap 1.12版本更新 从2022年起，笔者开始整理长时间序列的中国行政区划数据，通过以国家基础地理信息矢量数据为基础，以高德、民政部、gadm、乡镇界、村界、各省标准地图等区划矢量数据和相关行政区划变更文字资料为参考&am…...
【Linux初阶】多线程3 | 线程同步，生产消费者模型（普通版、BlockingQueue版）
文章目录 ☀️一、线程同步🌻1.条件变量🌻2.同步概念与竞态条件🌻3.条件变量函数🌻4.条件变量使用规范🌻5.代码案例 ☀️二、生产者消费者模型🌻1.为何要使用生产者消费者模型🌻2.生产者消费者模…...
JUC并发编程——四大函数式接口（基于狂神说的学习笔记）
四大函数式接口 函数式接口：只有一个方法的接口 ，例如：Runnable接口 Function 函数型接口，有一个输入参数，有一个输出 源码： /*** Represents a function that accepts one argument and produces a resul…...
【2】c++11新特性（稳定性和兼容性）—＞超长整型 long long
c11标准要求long long整型可以在不同的平台上有不同的长度，但是至少64位，long long整型有两种： 有符号long long：–对应类型的数值可以使用LL或者ll后缀 long long num1 123456789LL; long long num2 123456789ll;无符号unsign…...
AI算法检测对无人军用车辆的MitM攻击
南澳大利亚大学和查尔斯特大学的教授开发了一种算法来检测和拦截对无人军事机器人的中间人（MitM）攻击。 MitM 攻击是一种网络攻击，其中两方（在本例中为机器人及其合法控制器）之间的数据流量被拦截，以窃听或…...
运维 | 如何在 Linux 系统中删除软链接 | Linux
运维 | 如何在 Linux 系统中删除软链接 | Linux 介绍 在 Linux 中，符号链接（symbolic link，或者symlink）也称为软链接，是一种特殊类型的文件，用作指向另一个文件的快捷方式。 使用方法 我们可以使用 ln…...
Jmeter接口测试：jmeter导入和导出接口的处理
JMeter测试导入接口 利用Jmeter测试上传文件，首先可根据接口文档或者fiddler抓包分析文件上传的接口；如下图： 以下是我通过fiddler所截取的文件上传的接口 1、填写导入接口的信息 查看文件上传栏下的填写信息： 文件名称&#x…...
一文了解 Go fmt 标准库的常用占位符及其简单使用
今天分享的内容是 Go fmt 标准库的常用占位符及其简单使用。如果本文对你有帮助，不妨点个赞，如果你是 Go 语言初学者，不妨点个关注，一起成长一起进步，如果本文有错误的地方，欢迎指出 占位符 通过占位符&a…...
之history)
Linux命令(94)之history
linux命令之history 1.history介绍 linux命令history会记录并显示用户所执行过的所有命令，也可以对其命令进行修改和删除操作。 2.history用法 history [参数] history参数 参数说明-a将当前会话的历史信息追加到历史文件(.bash_history)中-c删除所有条目从而清…...
Prompt 驱动架构设计：探索复杂 AIGC 应用的设计之道？
你是否曾经想过，当你在 Intellij IDEA 中输入一个段代码时，GitHub 是如何给你返回相关的结果的？其实，这背后的秘密就是围绕 Prompt 生成而构建的架构设计。 Prompt 是一个输入的文本段落或短语，用于引导 AI 生成模型执…...
【代码随想录】算法训练营 第三天 第二章 链表 Part 1
目录 链表基础 链表的定义 203. 移除链表元素 题目 思路 代码 直接删除法 虚拟头结点辅助法 707. 设计链表 题目 思路 代码 206. 反转链表 题目 思路 代码 双指针法 递归法 链表基础 链表是一种通过指针串在一起的线性结构，每个节点都由数据域和指…...
winform开发经验（1）——调用Invoke更新UI时程序卡死原因以及解决办法
1、问题代码如下： private void Form1_Load(object sender, EventArgs e){this.Invoke(new Action(()...
JNI 的数据类型以及和Java层之间的数据转换
JNI的数据类型和类型签名 数据类型 JNI的数据类型包含两种：基本类型和引用类型。 基本类型主要有jboolean、jchar、jint等，它们和Java中的数据类型的对应关系如下表所示。 JNI中的引用类型主要有类、对象和数组，它们和Java中的引用类型的对…...
EFLK与logstash过滤
目录 一、Filebeat工作原理： 二、为什么要使用Filebeat： 三、Filebeat和Logstash的区别： 四、logstash 的过滤插件： 五、FilebeatELK 部署： 1. 安装filebeat： 2. 设置 filebeat 的主配置文件࿱…...
docker jenkins
mkdir jenkins_home chown -R 1000:1000 /root/jenkins_home/docker run -d --name myjenkins -v /root/jenkins_home:/var/jenkins_home -p 8080:8080 -p 50000:50000 --restarton-failure jenkins/jenkins:lts-jdk17参考 Official Jenkins Docker imageDocker 搭建 Jenkins …...
单例模式之「双重校验锁」
单例模式之「双重校验锁」 单例模式 单例即单实例，只实例出来一个对象。一般在创建一些管理器类、工具类的时候，需要用到单例模式，比如JDBCUtil 类，我们只需要一个实例即可（多个实例也可以实现功能，但是增…...
2023年中国商业版服务器操作系统市场发展规模分析：未来将保持稳定增长[图]
服务器操作系统一般指的是安装在大型计算机上的操作系统，比如Web服务器、应用服务器和数据库服务器等，是企业IT系统的基础架构平台，也是按应用领域划分的三类操作系统之一。同时服务器操作系统也可以安装在个人电脑上。 服务器操作系统分类 …...
BIM如何通过3D开发工具HOOPS实现WEB轻量化？
随着建筑行业的数字化转型和信息建模技术的不断发展，建筑信息模型（BIM）已经成为设计、建造和管理建筑项目的标准。然而，BIM模型通常包含大量的数据，导致在Web上的传输和查看效率低下。为了解决这一挑战，HOO…...
Unity 3D基础——通过四元数控制对象旋转
在这个例子中，通过键盘的左右方向来控制场景中的球体 Sphere 的横向运动，而 Cube 立方体则会一直朝着球体旋转。 1.在场景中新建一个 Cube 立方体和一个 Sphere 球体，在 Inspector 视图中设置 Cube 立方体的坐标为（3，0…...
KubeSphere 容器平台高可用：环境搭建与可视化操作指南
Linux_k8s篇 欢迎来到Linux的世界，看笔记好好学多敲多打，每个人都是大神！ 题目：KubeSphere 容器平台高可用：环境搭建与可视化操作指南 版本号: 1.0,0 作者: 老王要学习 日期: 2025.06.05 适用环境: Ubuntu22 文档说…...
Go 语言接口详解
Go 语言接口详解 核心概念 接口定义 在 Go 语言中，接口是一种抽象类型，它定义了一组方法的集合： // 定义接口 type Shape interface {Area() float64Perimeter() float64 } 接口实现 Go 接口的实现是隐式的： // 矩形结构体…...
OkHttp 中实现断点续传 demo
在 OkHttp 中实现断点续传主要通过以下步骤完成，核心是利用 HTTP 协议的 Range 请求头指定下载范围： 实现原理 Range 请求头：向服务器请求文件的特定字节范围（如 Range: bytes1024-） 本地文件记录：保存已…...
ffmpeg（四）：滤镜命令
FFmpeg 的滤镜命令是用于音视频处理中的强大工具，可以完成剪裁、缩放、加水印、调色、合成、旋转、模糊、叠加字幕等复杂的操作。其核心语法格式一般如下： ffmpeg -i input.mp4 -vf "滤镜参数" output.mp4或者带音频滤镜： ffmpeg…...
分布式增量爬虫实现方案
之前我们在讨论的是分布式爬虫如何实现增量爬取。增量爬虫的目标是只爬取新产生或发生变化的页面，避免重复抓取，以节省资源和时间。 在分布式环境下，增量爬虫的实现需要考虑多个爬虫节点之间的协调和去重。 另一种思路：将增量判…...
Python ROS2【机器人中间件框架】 简介
销量过万TEEIS德国护膝夏天用薄款 优惠券冠生园 百花蜂蜜428g 挤压瓶纯蜂蜜巨奇严选 鞋子除臭剂360ml 多芬身体磨砂膏280g健70%-75%酒精消毒棉片湿巾1418cm 80片/袋3袋大包清洁食品用消毒 优惠券AIMORNY52朵红玫瑰永生香皂花同城配送非鲜花七夕情人节生日礼物送女友 热卖妙洁棉…...
CVE-2020-17519源码分析与漏洞复现(Flink 任意文件读取)
漏洞概览 漏洞名称：Apache Flink REST API 任意文件读取漏洞CVE编号：CVE-2020-17519CVSS评分：7.5影响版本：Apache Flink 1.11.0、1.11.1、1.11.2修复版本：≥ 1.11.3 或 ≥ 1.12.0漏洞类型：路径遍历&#x…...
A2A JS SDK 完整教程：快速入门指南
目录 什么是 A2A JS SDK?A2A JS 安装与设置A2A JS 核心概念创建你的第一个 A2A JS 代理A2A JS 服务端开发A2A JS 客户端使用A2A JS 高级特性A2A JS 最佳实践A2A JS 故障排除 什么是 A2A JS SDK? A2A JS SDK 是一个专为 JavaScript/TypeScript 开发者设计的强大库ÿ…...
RabbitMQ入门4.1.0版本（基于java、SpringBoot操作）
RabbitMQ 一、RabbitMQ概述 RabbitMQ RabbitMQ最初由LShift和CohesiveFT于2007年开发，后来由Pivotal Software Inc.（现为VMware子公司）接管。RabbitMQ 是一个开源的消息代理和队列服务器，用 Erlang 语言编写。广泛应用于各种分布…...
Python Einops库：深度学习中的张量操作革命
Einops（爱因斯坦操作库）就像给张量操作戴上了一副"语义眼镜"——让你用人类能理解的方式告诉计算机如何操作多维数组。这个基于爱因斯坦求和约定的库，用类似自然语言的表达式替代了晦涩的API调用，彻底改变了深度学习工程…...