自从有了es6的set数据结构,数组的去重可以简单用一行代码实现,比如下面的方式

let arr = [1, 2, 2, 3, 4]
function unique (arr) {
return [...new Set(arr)]
}
console.log(unique(arr)) // [1, 2, 3, 4]

但是当数组的项不再是简单的数据类型时,比如是对象时,这种方法就会导致错误,比如下面的结果

let arr = [
{ name: 'a', num: 1},
{ name: 'b', num: 1},
{ name: 'c', num: 1},
{ name: 'd', num: 1},
{ name: 'a', num: 1},
{ name: 'a', num: 1},
{ name: 'a', num: 1}
]
function unique (arr) {
return [...new Set(arr)]
}
console.log(unique(arr)) // 结果为原数组,有兴趣可以复制代码试一下

其中的原因是因为set数据结构认为对象永不相等,即使是两个空对象,在set结构内部也是不等的

基于以上原因,利用map和set结构封装了一种对对象数组去重的简单方法,其实他们本质都是一样的,只是使用sjon.stringfy()和json.parse()会影响性能,具体如下

// ES6对象数组所有属性去重,筛选每个数组项的字符
function unique(arr) {
const map = new Map()
return arr.filter( item => !map.has(JSON.stringify(item)) && map.set(JSON.stringify(item), 1))
}
 function unique(arr) {
      return [...new Set(arr.map(e => JSON.stringify(e)))].map(e => JSON.parse(e))
  }
// ES6根据一维对象数组某个属性去重且该属性的值为简单数据类型,比较实用的一种的方法,也基本没有什么性能影响
function unique(arr, key) {
const map = new Map()
return arr.filter((item) => !map.has(item[key] + '') && map.set(item[key] + '', 1))
}

网上有朋友设计了一种更简单的方法,主要是对map数据结构的键理解得不一样,其他没什么区别,代码如下

// ES6对象数组所有属性去重,筛选每个数组项的字符
function unique2(arr) {
const map = new Map()
return arr.filter( item => !map.has(item) && map.set(item, 1))
}

实际试了一下,发现没有起到去重的效果,不知道具体原因是什么,我的理解是当用item指代数组中的每一项的对象的时候,item保存的是对对象的指针,即栈中的地址,并不是对象本身,所以每一个item的地址是不一样的,尽管他们都指向同一个堆数据,所以map认为每一个item并不相等,当然就起不到去重的效果。如果有更正确和深入的理解欢迎讨论哈

最新文章

  1. MVVM框架下 WPF隐藏DataGrid一列
  2. 使用T-SQL进行活动目录查询
  3. 分享php中四种webservice实现的简单架构方法及实例
  4. 杭电ACM分类
  5. 关于UIView需要看的一些官方文档
  6. 决定undo表空间的大小
  7. rpm的一些用法
  8. 一个Python小白5个小时爬虫经历
  9. mysql 批量插入优化之rewriteBatchedStatements
  10. this的理解
  11. ServletRequest
  12. FatMouse' Trade -HZNU寒假集训
  13. python设计模式---结构型之代理模式
  14. Notepad++快捷使用
  15. MongoDB 学习手册 - 安装(windwos 环境)
  16. 菜鸟Vue学习笔记(一)
  17. 软件产品案例分析——福州大学微信小程序
  18. vue-devtools必备工具
  19. 20145319 《网络渗透》MS12_020安全漏洞
  20. Xamarin.Forms XAML的辅助功能Code Snippet

热门文章

  1. 【水滴石穿】RNNewsGo
  2. Ubuntu中NS2安装详细教程
  3. 可变参数与foreach 的原理
  4. Intellij IDEA设置忽略部分类编译错误
  5. 支付宝sdk iOS 集成
  6. Facebook POP动效库使用教程
  7. 【Leetcode堆】数据流中的第K大元素(703)
  8. Introduction to 3D Game Programming with DirectX 12 学习笔记之 --- 第一章:向量代数
  9. 利用backtrace和ucontex定位segment错误
  10. HZOJ 导弹袭击