使用 JavaScript 比较两个 JSON 数组并提取差异

本文介绍了如何使用 JavaScript 比较两个 JSON 数组，并提取出第一个数组中存在，但第二个数组中不存在，且满足特定条件的元素。通过使用 Set 数据结构和数组的 map 方法，可以高效地实现此功能，并最终获得包含所需元素 ID 和名称的新数组。

比较两个 JSON 数组并提取差异

在 JavaScript 中，经常需要比较两个 JSON 数组，并根据特定条件提取出差异数据。例如，我们有两个数组 fruits 和 food，目标是从 fruits 中找出那些 name 不存在于 food 数组的 food_name 中，并且 food 数组中对应 food_name 的 deleted 字段不等于 "1" 的元素。

示例数据

立即学习“Java免费学习笔记（深入）”；

首先，定义两个示例数组：

const fruits = [
  { id: '1', name: 'Apple' },
  { id: '2', name: 'Orange' },
  { id: '3', name: 'Cherry' }
];

const food = [
  { id: '1', food_name: 'Orange', deleted: "0" },
  { id: '2', food_name: 'Bread', deleted: "0" },
  { id: '3', food_name: 'Cheese', deleted: "0" },
  { id: '4', food_name: 'Apple', deleted: "1" },
  { id: '5', food_name: 'Salt', deleted: "0" }
];

实现步骤

1. 创建 food_name 的集合 (Set)

   为了提高查找效率，首先从 food 数组中提取出所有的 food_name，并将其存储在一个 Set 数据结构中。Set 提供了快速的 has() 方法，用于检查某个值是否存在。

   

   标书对比王

   标书对比王是一款标书查重工具，支持多份投标文件两两相互比对，重复内容高亮标记，可快速定位重复内容原文所在位置，并可导出比对报告。

   58

   查看详情

   var foodSet = new Set(food.map(item => item.food_name));

   登录后复制

   这里，food.map(item => item.food_name) 将 food 数组转换为一个包含所有 food_name 的新数组，然后使用 new Set() 创建一个 foodSet。

2. 遍历 fruits 数组并进行比较

   接下来，遍历 fruits 数组，对于每个水果，检查其 name 是否存在于 foodSet 中，并且检查 food 数组中是否存在对应 food_name 且 deleted 不等于 "1" 的元素。

   var dep_data = [];
   
   for (var j = 0; j < fruits.length; j++) {
     if (!foodSet.has(fruits[j].name)) {
       const foodItem = food.find(item => item.food_name === fruits[j].name);
       if (!foodItem || foodItem.deleted !== "1") {
         dep_data.push({ id: fruits[j].id, name: fruits[j].name });
       }
     }
   }
   
   console.log(dep_data);

   登录后复制
   • !foodSet.has(fruits[j].name) 检查 fruits[j].name 是否不存在于 foodSet 中。
   • food.find(item => item.food_name === fruits[j].name) 查找 food 数组中是否存在 food_name 等于 fruits[j].name 的元素。
   • !foodItem || foodItem.deleted !== "1" 检查 foodItem 是否不存在（即 food 数组中没有找到对应的 food_name），或者 foodItem 存在但其 deleted 字段不等于 "1"。
   • 如果以上条件都满足，则将 fruits[j] 的 id 和 name 添加到 dep_data 数组中。

完整代码

const fruits = [
  { id: '1', name: 'Apple' },
  { id: '2', name: 'Orange' },
  { id: '3', name: 'Cherry' }
];

const food = [
  { id: '1', food_name: 'Orange', deleted: "0" },
  { id: '2', food_name: 'Bread', deleted: "0" },
  { id: '3', food_name: 'Cheese', deleted: "0" },
  { id: '4', food_name: 'Apple', deleted: "1" },
  { id: '5', food_name: 'Salt', deleted: "0" }
];

var dep_data = [];
var foodSet = new Set(food.map(item => item.food_name));

for (var j = 0; j < fruits.length; j++) {
  if (!foodSet.has(fruits[j].name)) {
    const foodItem = food.find(item => item.food_name === fruits[j].name);
    if (!foodItem || foodItem.deleted !== "1") {
      dep_data.push({ id: fruits[j].id, name: fruits[j].name });
    }
  }
}

console.log(dep_data);

输出结果

运行以上代码，将会得到以下结果：

[
  { "id": "3", "name": "Cherry" }
]

总结

通过使用 Set 数据结构和数组的 map 和 find 方法，可以高效地比较两个 JSON 数组，并根据特定条件提取出差异数据。这种方法避免了嵌套循环，提高了代码的执行效率。在实际应用中，可以根据具体的需求调整比较条件和提取的数据。请注意，该代码假定 food 数组中的 deleted 字段为字符串类型。如果它是数字类型，则需要相应地调整比较逻辑。

以上就是使用 JavaScript 比较两个 JSON 数组并提取差异的详细内容，更多请关注php中文网其它相关文章！