如何优化数组元素验证逻辑？并改进服务组合计价判断代码

针对您的需求——避免使用链式includes判断数组是否仅包含指定元素，同时实现Hair+Beard服务的折扣逻辑，以下是更简洁、可维护的优化方案：

核心思路 #

通过**集合(Set)**操作或通用工具函数，直接验证选中的服务名称集合是否与目标折扣组合完全匹配，避免冗余的链式条件判断。

方案1：使用Set进行精确匹配 #

将选中的服务名称转换为Set，与目标折扣组合的Set进行对比：

const selectedNames = new Set(findServices.map(service => service.name));
const discountCombo = new Set(['Hair', 'Beard']);

// 验证集合大小一致且所有元素匹配
if (selectedNames.size === discountCombo.size && [...selectedNames].every(name => discountCombo.has(name))) {
  setTotalDay(prevState => prevState + 40);
  setTotalMonth(prevState => prevState + 40);
}

方案2：封装通用验证函数 #

如果需要多次验证不同的服务组合，可以封装一个复用性更强的工具函数：

/**
 * 验证数组是否仅包含指定的所有元素（无额外元素，数量一致）
 * @param arr 待验证数组
 * @param allowedElements 允许的元素集合
 */
function containsOnly(arr: string[], allowedElements: string[]): boolean {
  const allowedSet = new Set(allowedElements);
  return arr.length === allowedElements.length && arr.every(item => allowedSet.has(item));
}

// 使用示例
const selectedNames = findServices.map(service => service.name);
if (containsOnly(selectedNames, ['Hair', 'Beard'])) {
  setTotalDay(prevState => prevState + 40);
  setTotalMonth(prevState => prevState + 40);
}

优势说明 #

1. 避免链式条件：不再需要includes(a) && includes(b) && !includes(c)这类冗余判断，逻辑更清晰
2. 自动排除额外元素：只要选中的服务包含目标组合以外的项（如Eyebrow），条件自动不成立，无需手动判断排除
3. 可扩展性强：后续新增其他折扣组合（如Hair+Eyebrow的优惠）时，只需传入新的元素数组即可
4. 修复原代码bug：原代码中误写为Eyebrown（正确应为Eyebrow），新方案通过集合匹配自动避免这类拼写错误导致的逻辑问题

内容的提问来源于stack exchange，提问作者Vinicius Celestino