React旧项目冗长不等值判断条件的优化最佳实践咨询

当然有几种成熟的优化方案，都是日常开发里常用的，根据你的场景选择即可：

1. 数组includes方法（最常用） #

把所有需要排除的值放到一个数组里，用includes判断是否在集合中再取反，代码瞬间简洁：

// 先定义排除值数组
const excludedValues = [const1, const2, const3 /* 后续新增值直接加这里 */];
const condition = !excludedValues.includes(param);

适用场景：排除值是基本类型（字符串、数字、布尔值），且数量不多的情况，可读性和维护性都很强。

2. Set集合（高性能场景） #

如果排除值的数量很大，用Set的has方法性能更好（查找时间复杂度O(1)，数组是O(n)）：

const excludedSet = new Set([const1, const2, const3 /* ... */]);
const condition = !excludedSet.has(param);

适用场景：排除值数量较多，或者需要频繁进行这类判断的场景，性能优势明显。

3. 封装全局常量（业务复用场景） #

如果这些排除值是业务上的固定规则，建议把集合封装到项目的常量文件里，方便全项目复用和统一维护：

// 在项目的constants.js中定义
export const EXCLUDED_PARAM_VALUES = new Set([const1, const2, const3]);

// 在业务组件中引入使用
import { EXCLUDED_PARAM_VALUES } from './constants';
const condition = !EXCLUDED_PARAM_VALUES.has(param);

好处：后续需要修改排除规则时，只需要改常量文件一处，避免多处修改遗漏。

4. 封装判断函数（复杂逻辑场景） #

如果除了不等判断，还需要结合其他业务逻辑，直接把判断逻辑封装成函数，代码可读性拉满：

function isParamValid(param) {
  const excludedValues = [const1, const2, const3];
  // 可以灵活添加其他判断条件
  return !excludedValues.includes(param) && typeof param === 'string' && param.trim().length > 0;
}

// 组件中直接调用
const condition = isParamValid(param);

适用场景：判断逻辑不止单一的不等判断，需要组合多个条件的情况，函数名能直接表达判断意图。

特殊情况处理：引用类型判断 #

如果排除的是对象、数组这类引用类型，includes或Set.has会按引用比较，这时候要改用some方法匹配具体属性：

const excludedObjects = [{ id: 1 }, { id: 2 }, { id: 3 }];
// 匹配对象的id属性
const condition = !excludedObjects.some(item => item.id === param.id);

内容的提问来源于stack exchange，提问作者Gianluca Santo