js数组对象去重

今天给大家介绍三种数组对象去重的方法，简单方便
有这么一组数组对象：

let arr = [{
     id: '1',
     key: '1',
     value: '明月'
   }, {
     id: '3',
     key: '2',
     value: '可欣'
   }, {
     id: '2',
     key: '3',
     value: '小红'
   }, {
     id: '1',
     key: '1',
     value: '小馨'
   }, {
     id: '1',
     key: '2',
     value: '小静'
}]

1、对象访问属性的方法

let newArr = [];
    let obj = {};
    for (var i = 0; i < arr.length; i++) {
       if (!obj[arr[i].key]) {
         newArr.push(arr[i])
         obj[arr[i].key] = true
       }
    }
console.log(newArr);

2、Map()方法

set方法设置key所对应的键值，然后返回整个Map结构。如果key已经有值，则键值会被更新，否则就新生成该键。

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

let map = new Map();
for (let item of this.arr) {
    map.set(item.id, item);
 }
this.arr = [...map.values()];
console.log(this.arr)

3、reduce() 方法

reduce() 方法接收一个函数作为累加器，数组中的每个值（从左到右）开始缩减，最终计算为一个值
array.reduce(function(total, currentValue, currentIndex, arr), initialValue)

参数

描述

total

必须。初始值, 或者计算结束后的返回值。

currentValue

必须。当前元素

currentIndex

可选。当前元素的索引

arr

可选。当前元素所属的数组对象。

initialValue

可选。传递给函数的初始值

const obj = {}
arr = arr.reduce((total, next) => {
  obj[next.key] ? '' : obj[next.key] = true && total.push(next)
  return total
}, [])
console.log(arr)

这里还有一个需求，如果有两个或者多个判断条件，给数组对象去重，加一个判断条件就行了

const hasObj = {}
arr = arr.reduce((total, next) => {
   const filterKey = next.key + next.id;
   hasObj[filterKey] ? "" : hasObj[filterKey] = true && total.push(next)
   return total
}, [])
console.log(arr)

希望可以帮助到你！

先自我介绍一下，小编13年上师交大毕业，曾经在小公司待过，去过华为OPPO等大厂，18年进入阿里，直到现在。深知大多数初中级java工程师，想要升技能，往往是需要自己摸索成长或是报班学习，但对于培训机构动则近万元的学费，着实压力不小。自己不成体系的自学效率很低又漫长，而且容易碰到天花板技术停止不前。因此我收集了一份《java开发全套学习资料》送给大家，初衷也很简单，就是希望帮助到想自学又不知道该从何学起的朋友，同时减轻大家的负担。添加下方名片，即可获取全套学习资料哦