React中比对JSON提取差异值时如何避免JSON对象被覆盖

对象被覆盖的核心原因是差异字段的写入逻辑错误：每次检测到不匹配的字段时，你都是直接给jsonOutput1、jsonOutput2赋值一个仅包含当前差异字段的全新对象，相当于把之前存的所有差异内容全部清空替换，自然只能保留最后一次检测到的差异值。
另外原代码还有一个隐藏bug：d != []的空数组判断永远返回true，因为数组是引用类型，两个独立空数组的引用地址不相等，当json2里找不到匹配Unique的条目时，后续访问d[0]会直接抛出空指针错误。

const finalDiffResult = {};

for (const item1 of jsonData1) {
  const matchedItems = jsonData2.filter(data => data.Unique === item1.Unique);
  // 无匹配项直接跳过当前循环
  if (matchedItems.length === 0) continue;
  const item2 = matchedItems[0];

  const currentItemDiff = {};
  const item1Keys = Object.keys(item1);

  for (const key of item1Keys) {
    if (key === "Title") {
      const item2TitleValue = item2.Name?.Title;
      if (item1[key] !== item2TitleValue) {
        // 往已有对象追加键值对，而非重新赋值整个对象
        currentItemDiff[key] = item2TitleValue;
      }
    } else {
      if (item1[key] !== item2[key]) {
        currentItemDiff[key] = item2[key];
      }
    }
  }

  // 仅当当前条目存在差异时写入最终结果，以Unique为key做隔离
  if (Object.keys(currentItemDiff).length > 0) {
    finalDiffResult[item1.Unique] = currentItemDiff;
  }
}

• 替换了原有的整体对象赋值逻辑，改用对象[键名] = 值的方式追加差异字段，保证所有检测到的差异都会被保留
• 修正了空匹配项的判断逻辑，避免找不到对应数据时的运行时报错
• 最终结果以每条数据的Unique字段为key做分桶存储，不同数据条目的差异不会互相覆盖
• 增加了可选链判断，当json2中条目不存在Name字段时不会抛出访问错误

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