JavaScript中数组去重、对象去重的方法

ES6提供了新的数据结构:Set 和 Map,在写去重代码时方便了很多人,可以用更少的代码去实现去重。

这两者都是构造函数,需要通过new去生成。

 

这两者的区别就是:Set类似于数组,Map类似于对象

 

数组去重

const array = [1, 2, 3, 4, 5, 5, 5, 5]

const set = new Set(array)
const result = [...set] // Array.from(set)

// 简写
const result = [...new Set(array)] // Array.from(new Set(array))

 

除此之外,数组去重方式还有:

1. 两个for循环遍历比较,需要使用两个变量,搭配splice

2. indexOf / lastIndexOf / includes

  2.1 搭配for循环,存入新数组

  2.2 搭配filter,返回新数组

3. 利用对象,那么同时也可以利用Map

4. ……

 

对象去重(对象数组去重)

关键代码:

function unique(arr) {
  const res = new Map()
  return arr.filter((arr) => !res.has(arr.key) && res.set(arr.key, 1))
}

例子:

var arr = [
  {
    key: 111,
    value: 111,
  },
  {
    key: 111,
    value: 222,
  },
  {
    key: 222,
    value: 333,
  },
  {
    key: 333,
    value: 444,
  },
]
function unique(arr) {
  const res = new Map()
  return arr.filter((arr) => !res.has(arr.key) && res.set(arr.key, 1))
}
var temArr1 = unique(arr)
console.log(temArr1)

得到的结果:

[

  {key: 111, value: 111},

  {key: 222, value: 333},

  {key: 333, value: 444},

]

 

如果想要以后添加的数据为最新内容,只需要将数组翻转即可:

var temArr2 = unique(arr.reverse()).reverse()
console.log(temArr2)

得到的结果:

[

  {key: 111, value: 222},

  {key: 222, value: 333},

  {key: 333, value: 444},

]

 

除此之外,数组去重方式还有:

1. Map可以实现,那么当然对象也可以实现(通过判断key)

2. 两个for循环遍历比较

  2.1 通过标识符来添加到新数组中

  2.2 使用两个变量,搭配splice

3. ……

 

欢迎补充!欢迎纠正!

posted @ 2020-10-28 14:12  hiuman  阅读(178)  评论(0编辑  收藏  举报