本文介绍了如何使用 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" }
];实现步骤
-
创建 food_name 的集合 (Set)
为了提高查找效率，首先从 food 数组中提取出所有的 food_name，并将其存储在一个 Set 数据结构中。Set 提供了快速的 has() 方法，用于检查某个值是否存在。
var foodSet = new Set(food.map(item => item.food_name));
这里，food.map(item => item.food_name) 将 food 数组转换为一个包含所有 food_name 的新数组，然后使用 new Set() 创建一个 foodSet。
-
遍历 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 字段为字符串类型。如果它是数字类型，则需要相应地调整比较逻辑。
