js策略模式是什么-js教程-PHP中文网

js策略模式是什么

舞夢輝影

发布： 2025-11-01 18:16:02

原创

745人浏览过

策略模式通过将算法与使用分离，解决条件判断过多导致的维护难题，如表单验证中封装不同规则，提升代码可扩展性、复用性与清晰度。

js策略模式是什么

JS策略模式是一种设计模式，用来将不同的算法或行为封装成独立的函数或对象，让它们可以在运行时互相替换，而不影响使用它们的代码。这种模式的核心思想是：把“做什么”和“怎么做”分开。

策略模式解决了什么问题

在写代码时，经常会遇到根据条件执行不同逻辑的情况，比如表单验证、计算折扣、处理用户输入等。如果用大量的 if-else 或 switch 来判断，代码会变得难以维护。策略模式通过将每种情况封装成独立的策略，让代码更清晰、可扩展。

常见例子：表单验证

假设你要验证一个用户注册表单：

可图大模型

可图大模型（Kolors）是快手大模型团队自研打造的文生图AI大模型

查看详情

用户名不能为空，且长度大于2
密码至少6位
邮箱格式要正确

不用策略模式的话，可能写出一堆 if 判断。而用策略模式，可以这样组织：

// 定义验证规则（策略对象）
const strategies = {
  notEmpty: (value, errorMsg) => value === '' ? errorMsg : null,
  minLength: (value, length, errorMsg) => value.length < length ? errorMsg : null,
  isEmail: (value, errorMsg) => {
    const emailReg = /^[^\s@]+@[^\s@]+\.[^\s@]+$/;
    return !emailReg.test(value) ? errorMsg : null;
  }
};

// 验证器类
class Validator {
  constructor() {
    this.cache = [];
  }

  add(value, rule, errorMsg) {
    const [strategyName, ...args] = rule.split(':');
    args.unshift(value);
    args.push(errorMsg);

    this.cache.push(() => strategies[strategyName](...args));
  }

  validate() {
    for (let fn of this.cache) {
      const errorMsg = fn();
      if (errorMsg) {
        return errorMsg;
      }
    }
    return null;
  }
}

// 使用方式
const validator = new Validator();
validator.add('abc', 'notEmpty', '用户名不能为空');
validator.add('ab', 'minLength:3', '用户名至少3个字符');
validator.add('invalid-email', 'isEmail', '邮箱格式不正确');

const msg = validator.validate();
console.log(msg); // 输出：用户名至少3个字符

登录后复制