JavaScript对象数组去重方法

紫色蔷薇 2024-09-07 ⋅ 6 阅读

在JavaScript中,我们经常会遇到需要对对象数组进行去重的情况。本文将介绍几种常用的方法来实现对象数组的去重。

方法一:使用Set数据结构

Set是一种新的数据结构,它类似于数组,但成员的值都是唯一的,没有重复的值。我们可以通过将对象数组转换为Set,然后再将其转换回数组的方式来实现去重。

const arr = [
    {id: 1, name: 'Alice'},
    {id: 2, name: 'Bob'},
    {id: 3, name: 'Alice'}
];

const uniqueArr = Array.from(new Set(arr.map(JSON.stringify))).map(JSON.parse);

console.log(uniqueArr);
// Output: [
//     {id: 1, name: 'Alice'},
//     {id: 2, name: 'Bob'}
// ]

上述代码首先通过使用map将每个对象转换为其对应的JSON字符串,然后使用Set数据结构使重复的项被去重。最后通过Array.from将Set转换为数组,再使用map将每个JSON字符串转换为对象,完成去重操作。

方法二:使用reduce方法

我们也可以使用reduce方法来实现对象数组的去重。通过遍历原数组,将不重复的对象添加到新数组中。

const arr = [
    {id: 1, name: 'Alice'},
    {id: 2, name: 'Bob'},
    {id: 3, name: 'Alice'}
];

const uniqueArr = arr.reduce((acc, curr) => {
    const isExist = acc.find(item => item.id === curr.id);
    if (!isExist) {
        acc.push(curr);
    }
    return acc;
}, []);

console.log(uniqueArr);
// Output: [
//     {id: 1, name: 'Alice'},
//     {id: 2, name: 'Bob'}
// ]

上述代码中,我们使用reduce方法遍历原数组,将不重复的对象添加到累加器acc中。在每次迭代中,通过查找是否存在相同id的对象来判断是否重复,如果不存在则将当前对象添加到累加器中。

方法三:使用对象键值对

我们还可以使用对象键值对的方式来实现对象数组的去重。将对象的属性值作为键,对象作为值,遍历数组进行判断和去重。

const arr = [
    {id: 1, name: 'Alice'},
    {id: 2, name: 'Bob'},
    {id: 3, name: 'Alice'}
];

const uniqueArr = Object.values(arr.reduce((acc, curr) => {
    acc[curr.id] = curr;
    return acc;
}, {}));

console.log(uniqueArr);
// Output: [
//     {id: 1, name: 'Alice'},
//     {id: 2, name: 'Bob'}
// ]

上述代码中,我们使用reduce方法遍历数组,将对象的id作为键,对象本身作为值存储在一个新的对象中。最后通过Object.values将对象的值提取为数组格式,完成去重操作。

总结

本文介绍了三种常用的JavaScript对象数组去重的方法。使用Set数据结构、reduce方法以及对象键值对的方式都可以实现去重效果。根据实际情况选择合适的方法来处理对象数组的去重问题,提高代码的效率和性能。

参考资料:

  1. MDN Web 文档:Set
  2. MDN Web 文档:Array.prototype.reduce()
  3. MDN Web 文档:Object.values()

全部评论: 0

    我有话说: