JavaScript策略模式_算法替换灵活实现_技术教程

策略模式通过封装不同算法使其可互换，提升代码可维护性；常用于表单验证、计算规则等场景，核心由环境类、策略接口和具体策略组成；JavaScript中以对象或函数实现策略，避免冗长判断，如奖金计算根据等级对应不同公式，易于扩展与修改。

在JavaScript开发中，策略模式是一种让算法或行为动态切换的设计模式。它把每个算法封装成独立的策略对象，使它们可以互相替换，而不影响使用它们的上下文。这种模式特别适合处理多重条件判断、表单验证、计算规则等场景，提升代码的可维护性和扩展性。

策略模式的核心结构

策略模式通常包含三个部分：

环境类（Context）：持有策略的引用，负责调用具体的策略方法。
策略接口/抽象类：定义所有支持策略的公共接口（在JS中体现为统一的方法名）。
具体策略类：实现具体算法逻辑的对象或函数。

JavaScript作为弱类型语言，不需要显式定义接口，只需保证各个策略对象具有相同的方法结构即可。

实际应用场景：表单验证

假设我们要对用户输入进行校验，不同字段需要不同的验证规则。使用策略模式可以避免冗长的 if-else 判断。

// 具体策略：各种验证规则
const validationRules = {
  isRequired: (value) => value !== '' && value !== null && value !== undefined,
  isEmail: (value) => /\S+@\S+\.\S+/.test(value),
  minLength: (value, length) => value.length >= length,
  maxLength: (value, length) => value.length <= length
};
// 策略封装
const validators = {
name: (value) => {
if (!validationRules.isRequired(value)) return '姓名不能为空';
if (!validationRules.minLength(value, 2)) return '姓名至少2个字符';
return null;
},
email: (value) => {
if (!validationRules.isRequired(value)) return '邮箱不能为空';
if (!validationRules.isEmail(value)) return '邮箱格式不正确';
return null;
},
password: (value) => {
if (!validationRules.isRequired(value)) return '密码不能为空';
if (!validationRules.minLength(value, 6)) return '密码至少6位';
return null;
}
};
// 使用示例
function validateField(fieldName, value) {
const validator = validators[fieldName];
return validator ? validator(value) : null; // 返回错误信息或null
}
console.log(validateField('email', 'test@example.com')); // null（验证通过）
console.log(validateField('email', 'invalid')); // "邮箱格式不正确"

优势：灵活与可扩展

策略模式让添加新规则变得非常简单。比如要增加手机号验证，只需在策略对象中新增一条规则和对应的校验函数，无需修改已有逻辑。

相比硬编码的判断结构，策略模式：

减少条件分支，代码更清晰；
便于单元测试，每个策略可单独测试；
支持运行时切换算法，适应不同业务场景；
符合开放封闭原则——对扩展开放，对修改关闭。

简化版函数式策略

在JavaScript中，函数是一等公民，可以直接用函数作为策略单位，进一步简化实现。

const strategies = {
  'S': (https://www./link/79dbb4357034c63c88d25b95bbb0d326) => https://www./link/79dbb4357034c63c88d25b95bbb0d326 * 4,
  'A': (https://www./link/79dbb4357034c63c88d25b95bbb0d326) => https://www./link/79dbb4357034c63c88d25b95bbb0d326 * 3,
  'B': (https://www./link/79dbb4357034c63c88d25b95bbb0d326) => https://www./link/79dbb4357034c63c88d25b95bbb0d326 * 2
};
const calculateBonus = (level, https://www./link/79dbb4357034c63c88d25b95bbb0d326) => strategieslevel;
console.log(calculateBonus('A', 10000)); // 30000