数组对象去重的方法

原数组

let arrObj = [
    { name: "红", id: 1 },
    { name: "橙", id: 2 },
    { name: "黄", id: 3},
    { name: "绿", id: 4 },
    { name: "青", id: 1 },
    { name: "蓝", id: 4 }
];

想要的结果

arrObj = [
    { name: "红", id: 1 },
    { name: "橙", id: 2 },
    { name: "黄", id: 3},
    { name: "绿", id: 4 },
];

方法一:双层for循环
两两比较,如果后一个对象的id值和前一个对象的id值相等,就把后面的对象删除

let arrObj = [
    { name: "红", id: 1 },
    { name: "橙", id: 2 },
    { name: "黄", id: 3},
    { name: "绿", id: 4 },
    { name: "青", id: 1 },
    { name: "蓝", id: 4 }
];
function fn1(arr) {
    for (let i = 0; i < arr.length; i++) {
        for (let j = i + 1; j < arr.length; j++) {
            if (arr[i].id == arr[j].id) {
                arr.splice(j, 1);
                j--;
            };
        };
    };
    return arr;
};
console.log(fn1(arrObj));

方法二:indexOf()
定义一个数组存储id的值,然后逐个比较,把id值重复的对象删除即可

let arrObj = [
    { name: "红", id: 1 },
    { name: "橙", id: 2 },
    { name: "黄", id: 3},
    { name: "绿", id: 4 },
    { name: "青", id: 1 },
    { name: "蓝", id: 4 }
];
function fn2(arr) {
    let newArr = [];
    for (let i = 0; i < arr.length; i++) {
        if (newArr.indexOf(arr[i].id) == -1) {
            newArr.push(arr[i].id);
        } else {
            arr.splice(i, 1);
            i--;
        };
    };
    return arr;
};
console.log(fn2(arrObj));

方法三:对象访问属性的方法
采用对象访问属性的方法,判断属性值是否存在

let arrObj = [
    { name: "红", id: 1 },
    { name: "橙", id: 2 },
    { name: "黄", id: 3},
    { name: "绿", id: 4 },
    { name: "青", id: 1 },
    { name: "蓝", id: 4 }
];
function fn3(arr) {
    let result = [];
    let obj = {};
    for (let i = 0; i < arr.length; i++) {
        if (!obj[arr[i].id]) {
            result.push(arr[i]);
            obj[arr[i].id] = true;
        };
    };
    return result;
};
console.log(fn3(arrObj));

方法四:Map()
has方法可以判断Map对象中是否存在指定元素,有则返回true,否则返回false

set方法可以向Map对象添加新元素 map.set(key, value)

values方法可以返回Map对象值的遍历器对象

let arrObj = [
    { name: "红", id: 1 },
    { name: "橙", id: 2 },
    { name: "黄", id: 3},
    { name: "绿", id: 4 },
    { name: "青", id: 1 },
    { name: "蓝", id: 4 }
];
// 方法一:
let map = new Map();
for (let item of arrObj) {
    if (!map.has(item.id)) {
        map.set(item.id, item);
    };
};
arr = [...map.values()];
console.log(arr);
 
 
 
// 方法二: (代码较为简洁)
const map = new Map();
const newArr = arrObj.filter(v => !map.has(v.id) && map.set(v.id, v));
console.log(newArr);
  • 12
    点赞
  • 0
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值