如何简化这段实现数组比对更新功能的JavaScript代码？

你的原代码可以做大幅简化，优化后逻辑更清晰、执行效率更高，同时修正了原代码中属性名和示例数据不匹配的问题。

核心优化点 #

• 用Map提前对fruit_temp按id做索引，把原代码多次遍历查找的时间复杂度从O(n²)降到O(n)，数据量较大时性能优势明显
• 用ES6+的可选链?.、空值合并运算符??替代冗余的undefined判断
• 减少不必要的中间变量和重复遍历
• 修正原代码未声明finalFruit_temp的潜在全局污染问题

简化后的代码 #

const updateFruit = () => {
  // 提前构建id到数据的映射，避免重复遍历
  const fruitMap = new Map(fruit_temp.map(item => [item.fuit_id, item]));
  // 读取并转换选中的水果id为数字
  const selectedIds = $('#fruit').val().map(Number);
  const finalFruit_temp = [];

  // 处理选中的水果项
  selectedIds.forEach(id => {
    const matched = fruitMap.get(id);
    finalFruit_temp.push({
      fruit_db_id: matched?.fruit_db_id ?? null,
      fruit_id: id,
      status: true
    });
    // 已处理的项从Map中移除，剩余项即为未选中的旧数据
    fruitMap.delete(id);
  });

  // 处理未选中的原有水果项
  fruitMap.forEach(item => {
    finalFruit_temp.push({
      fruit_db_id: item.fruit_db_id,
      fruit_id: item.fuit_id,
      status: false
    });
  });
}

如果追求更短的写法，也可以用数组展开+链式调用的版本：

const updateFruit = () => {
  const fruitMap = new Map(fruit_temp.map(i => [i.fuit_id, i]));
  const selectedIds = $('#fruit').val().map(Number);
  const finalFruit_temp = [
    ...selectedIds.map(id => ({
      fruit_db_id: fruitMap.get(id)?.fruit_db_id ?? null,
      fruit_id: id,
      status: true
    })),
    ...[...fruitMap.values()].map(item => ({
      fruit_db_id: item.fruit_db_id,
      fruit_id: item.fuit_id,
      status: false
    }))
  ];
}

小提示：你给出的示例数据里id键名是fuit_id（疑似拼写遗漏了字母r，应为fruit_id），如果实际业务中键名是正确拼写的版本，把代码里对应的键名替换即可。

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