在JS中从多个对象数组中获取唯一值-在javascript中正确的方式

Question

我有这两个对象数组，我想从中获得唯一的值!有人知道如何在JS中做到这一点吗?

let array1 = [
{ categoryName: "category 1" },
{ categoryName: "category 2" },
{ categoryName: "category 3" },
{ categoryName: "category 4" },
];
let array5 = [
{ categoryName: "category 1" },
{ categoryName: "category 2" },
{ categoryName: "category 3" },
{ categoryName: "category 4" },
{ categoryName: "category 5" },
];
let newArray = [];
for (const arr5Item of array5) {
for (const arr1Item of array1) {
if (arr5Item.categoryName !== arr1Item.categoryName) {
newArray.push(arr5Item);
break;
} else {
newArray.push(arr1Item);
break;
}
}
}
console.log("newArray ", newArray);

Answer 1

Array.reduce可以轻松解决您的问题。

步骤1:合并所有的数组成一个数组，通过three dots在javascript。

步骤2:使用Array.reduce返回结果

let array1 = [
{ categoryName: "category 1" },
{ categoryName: "category 2" },
{ categoryName: "category 3" },
{ categoryName: "category 4" },
];
let array5 = [
{ categoryName: "category 1" },
{ categoryName: "category 2" },
{ categoryName: "category 3" },
{ categoryName: "category 4" },
{ categoryName: "category 5" },
];
const mergedArray = [...array1, ...array5];
const uniqueArray = mergedArray.reduce((acc, item) => {
if (!acc.some(e => e.categoryName == item.categoryName)) {
acc.push(item);
}
return acc;
}, []);
console.log(uniqueArray);

Answer 2

使用Set可以很容易地实现这个结果。使用Set是有效的方法

1)

let array1 = [
{ categoryName: "category 1" },
{ categoryName: "category 2" },
{ categoryName: "category 3" },
{ categoryName: "category 4" },
];
let array5 = [
{ categoryName: "category 1" },
{ categoryName: "category 2" },
{ categoryName: "category 3" },
{ categoryName: "category 4" },
{ categoryName: "category 5" },
];
const set = new Set([
...array1.map((o) => o.categoryName),
...array5.map((o) => o.categoryName),
]);
const result = [...set.keys()].map((s) => ({ categoryName: s }));
console.log(result);

2)

let array1 = [
{ categoryName: "category 1" },
{ categoryName: "category 2" },
{ categoryName: "category 3" },
{ categoryName: "category 4" },
];
let array5 = [
{ categoryName: "category 1" },
{ categoryName: "category 2" },
{ categoryName: "category 3" },
{ categoryName: "category 4" },
{ categoryName: "category 5" },
];
const set = new Set([
...array1.map((o) => o.categoryName),
...array5.map((o) => o.categoryName),
]);
const result = [];
for (let categoryName of set) result.push({ categoryName });
console.log(result);

Answer 3

通过使用Set(用于唯一对象)和JSON。stringify和JSON.parse。假设与categoryName一起，您可能在对象中有其他属性。

let array1=[{categoryName:"category 1"},{categoryName:"category 2"},{categoryName:"category 3"},{categoryName:"category 4"},]
let array5=[{categoryName:"category 1"},{categoryName:"category 2"},{categoryName:"category 3"},{categoryName:"category 4"},{categoryName:"category 5"},];
const combineArr = [...array1.map(x=> JSON.stringify(x)), ...array5.map(x=> JSON.stringify(x))];
const result = [...new Set(combineArr)].map(x => JSON.parse(x));
console.log(result);

.as-console-wrapper { max-height: 100% !important; top: 0 }

Answer 4

不止一个。有很多方法可以做到这一点。基本上你需要一个循环逻辑。

请找到Array.reduce的实现。

逻辑

• 使用扩展操作符创建一个合并数组。
• 检查累加器中合并数组的每个节点。
• 如果合并数组中的节点在累加器中不存在，则它是唯一的。

工作小提琴

let array1 = [{ categoryName: "category 1" },{ categoryName: "category 2" },{ categoryName: "category 3" },{ categoryName: "category 4" }];
let array5 = [{ categoryName: "category 1" },{ categoryName: "category 2" },{ categoryName: "category 3" },{ categoryName: "category 4" },{ categoryName: "category 5" }];
const uniqueValues = [...array1, ...array5].reduce((acc, curr) => {
const nodeExist = acc.some(item => item.categoryName === curr.categoryName);
const secondArrayExist = array5.some(item => item.categoryName === curr.categoryName);
if (!nodeExist) {
acc.push(curr);
}
return acc;
}, []);
console.log(uniqueValues);

如果你想获得只存在于任何一个数组中的节点，使用下面的逻辑:

• 创建一个数组合并。
• 检查合并数组中的每个节点，是否存在于array1和array5中。如果节点不存在于array1或array5中的任何一个，则该节点为唯一节点。
• 将该节点推送到累加器。

工作小提琴

let array1 = [{ categoryName: "category 1" },{ categoryName: "category 2" },{ categoryName: "category 3" },{ categoryName: "category 4" }];
let array5 = [{ categoryName: "category 1" },{ categoryName: "category 2" },{ categoryName: "category 3" },{ categoryName: "category 4" },{ categoryName: "category 5" }];
const uniqueValues = [...array1, ...array5].reduce((acc, curr) => {
const firstArrayExist = array1.some(item => item.categoryName === curr.categoryName);
const secondArrayExist = array5.some(item => item.categoryName === curr.categoryName);
if (!firstArrayExist || !secondArrayExist) {
acc.push(curr);
}
return acc;
}, []);
console.log(uniqueValues);

Answer 5

这是一个稍微扩展的代码片段，它基本上介绍了合并任意数量的数组的函数，并通过提供的prop键对它们进行过滤，只留下唯一的值。检查内联注释

// Arrays
let array1 = [
{ categoryName: "category 1" },
{ categoryName: "category 2" },
{ categoryName: "category 3" },
{ categoryName: "category 7" } // unique
];
let array3 = [
{ categoryName: "category 1" },
{ categoryName: "category 2" },
{ categoryName: "category 6" }, // unique
{ categoryName: "category 3" },
{ categoryName: "category 4" }
];
let array5 = [
{ categoryName: "category 1" },
{ categoryName: "category 5" }, // unique
{ categoryName: "category 2" },
{ categoryName: "category 3" },
{ categoryName: "category 4" }
];
// Merge diff
const md = (arr, key) => {
const merged = [];
// Merge all
for(const el of arr) merged.push(...el);
// Find duplicates
const matched = {};
const dup = {};
const res = merged.filter(el => matched.hasOwnProperty(el[key]) ? (() => { dup[el[key]] = true; return false })() : (matched[el[key]] = true));
// Filter out matched duplicates and return
return merged.filter(el => dup.hasOwnProperty(el[key]) ? false : true);
}
// Test
// Give array of arrays as first parameter
// and prop name to match and filter as second
console.log(md([array1, array3, array5], "categoryName"));