如何使用map重构含长if判断队列的Javascript意大利面条式代码

完全可以把重复的判断逻辑抽成配置驱动的形式，彻底删掉堆叠的if分支。核心思路是：原代码里所有if判断都遵循完全相同的执行逻辑，只是检查的字段名有差异，且检查顺序是固定优先级的——只要把这些差异点抽成有序数组，剩下的通用逻辑只需要写一次就行。

优化后代码 #

// 把固定的检查优先级提到循环外定义，和原来if分支从上到下的顺序完全保持一致
const PRIORITY_CHECK_KEYS = ['a', 'b', 'c', 'd', 'e'];

for (const element of elements) {
  try {
    // eslint-disable-next-line no-await-in-loop
    const res = await func(element.id);
    // 按优先级找第一个值存在于tokens中的字段
    const matchedKey = PRIORITY_CHECK_KEYS.find(key => tokens.includes(res[key]));

    if (matchedKey) {
      saveElement(matchedKey, res[matchedKey], element.id);
      // 保留原有逻辑：命中后直接跳出整个元素遍历循环
      break;
    }
  } catch (err) {
    console.error(err);
  }
}

方案说明 #

• 完全兼容原有逻辑：find方法会按数组顺序遍历，返回第一个满足条件的元素，和原代码“按a→b→c→d→e的顺序挨个判断，命中就停止后续检查”的行为完全一致
• 彻底消除重复：不管后续要加多少个检查字段，只要往PRIORITY_CHECK_KEYS数组里追加对应的键名就行，不需要再写新的if分支，也不需要改动解构语句
• 更易维护：如果要调整检查优先级，只需要调整数组里的元素顺序，不需要在循环逻辑里挪来挪去改if的位置

注意事项 #

一定要保证PRIORITY_CHECK_KEYS的顺序和原来if分支的上下顺序完全一致，不然会出现优先级错乱的问题（比如同时命中a和b的时候，因为数组顺序调整，反而先触发b的保存逻辑，和原代码行为不符）。

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