js数组对象去重

伟笑

已于 2022-10-15 09:41:52 修改

阅读量2.3w

点赞数 22

分类专栏： javascript 文章标签： javascript

于 2022-07-20 08:49:10 首次发布

本文链接：https://blog.csdn.net/weixin_43045869/article/details/125884799

版权

javascript 专栏收录该内容

21 篇文章 1 订阅

订阅专栏

本文介绍了两种在JavaScript中去除对象数组重复元素的方法。第一种是利用reduce()方法，通过创建一个空对象来记录已存在的对象，从而过滤掉重复项。第二种方法是使用Set数据结构结合Map，通过判断id和name的唯一性来实现去重。这两种方法都能有效地处理包含多个属性的复杂对象数组去重问题。

摘要由CSDN通过智能技术生成

1、使用reduce()方法对象数组去重

通过数组的reduce()方法对数组的对象从左到右进行处理，定义一个空对象obj{}；

如果数组当前对象的name不在obj{}，就将当前对象的name加入到空对象，并将当前对象push到积累变量total数组里；

如果当前对象的name存在obj{}，则跳过push操作。

//reduce第一个参数是遍历需要执行的函数，第二个参数是item的初始值
var arr = [{"id":1,"name":"张三"},{"id":2,"name":"李四"},{"id":3,"name":"王五"},{"id":2,"name":"张三"}];
var obj = {};
arr = arr.reduce(function(item, next) {
       obj[next.id] ? '' : obj[next.id] = true && item.push(next);
       return item;
    }, []);
console.log(arr);

2、利用set去重

可以判断多个属性，这里判断了两个条件，（id 和 name）

var arr2 = [{"id":1,"name":"张三"},{"id":2,"name":"李四"},{"id":3,"name":"王五"},{"id":2,"name":"张三"},{'id':4,'name':'李四'}];

function unique(arr){
    const res= new Map()
    return arr.filter((a)=> !res.has(a.id) && res.set(a.id,1) && !res.has(a.name) && res.set(a.name,1))
}
//输出结果：
unique(arr2)
[
    {
        "id": 1,
        "name": "张三"
    },
    {
        "id": 2,
        "name": "李四"
    },
    {
        "id": 3,
        "name": "王五"
    }
]