ES6 set和map数据结构对对象数组去重简单实现

自从有了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结构封装了一种对对象数组去重的简单方法,具体如下

// ES6对象数组所有属性去重,筛选每个数组项的字符
function unique(arr) {
    const res = new Map()
    return arr.filter( item => !res.has(JSON.stringify(item)) && res.set(JSON.stringify(item), 1))
}
// ES6根据一维对象数组某个属性去重且该属性的值为简单数据类型
function unique(arr, key) {
    const res = new Map()
    return arr.filter((item) => !res.has(item[key] + ‘‘) && res.set(item[key] + ‘‘, 1))
}

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

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

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

原文地址:https://www.cnblogs.com/p-l-u-m/p/10950774.html

时间: 2024-10-24 13:17:49

ES6 set和map数据结构对对象数组去重简单实现的相关文章

js ES6 Set和Map数据结构详解

这篇文章主要介绍了ES6学习笔记之Set和Map数据结构,结合实例形式详细分析了ECMAScript中基本数据结构Set和Map的常用属性与方法的功能.用法及相关注意事项,需要的朋友可以参考下 本文实例讲述了ES6学习笔记之Set和Map数据结构.分享给大家供大家参考,具体如下: 一.Set ES6提供了新的数据结构Set.类似于数组,只不过其成员值都是唯一的,没有重复的值. Set本身是一个构造函数,用来生成Set数据结构. 1 . Set函数可以接受一个数组(或类似数组的对象)作为参数,用来

es6 Set 和Map 数据结构

ES6提供了新的数据结构Set,它类似于数组,但是成员的值都是唯一的,没有重复的值. Set 本身是一个数据结构,用来生成Set 数据结构. const s = new Set(); [2,3,5,4,5,2,2,2].forEach(x=>s.add(x)); for(let i of s) { console.log(i); } // 2 3 5 4 Set 函数可以接受一个数组作为参数. 可以利用去除数组重复成员的方法. [...new Set(array)] // 去除数组重复变量成员

ES6 -Set 和 Map 数据结构

一.set 1.set数据结构:类似数组,但是里面不能有重复值 2.set语法, new Set([]) let set=new Set([1,2,1]); console.log(set);// {1, 2} 3.set 方法 // add() 增加,返回增加后的set console.log(set.add(3)); // {1, 2,3} // delete() 删除,返回true或false console.log(set.delete(2));// true // has() 判断是否

js 对象数组去重问题

在项目中定义对象数组是非常常见的,这就免不了要对对象数组进行去重.当然不能简单的使用===来解决问题,因为这时候数组中的类型为对象类型,即使完全相同的两个对象也不相等的.下面的例子说明一切: {}==={}//fasle []===[]//fasle 所以应该使用其他方法来判断两个对象是否相等,能代表这个对象的唯一性的属性,比如id. 使用id举例: var arr=[ {id:01,name:'jack'}, {id:02,name:'tome'}, {id:01,name:'jack'},

对象数组去重

//对象数组的去重 function uniqObjInArray(objarray) { let len = objarray.length; let tempJson = {}; let res = []; for (let i = 0; i < len; i++) { //取出每一个对象 tempJson[JSON.stringify(objarray[i])] = true; } let keyItems = Object.keys(tempJson); for (let j = 0;

使用reduce的方法实现对象数组去重

在开发中和面试当中,数组去重问题往往是受宠儿,那用最短的代码解决这个问题会使效率得到更大的提升.普通的数组,我们可以通过filter过滤方法进行去重,详情见本人博客:http://www.cnblogs.com/mmykdbc/p/8422419.html 那当是一个对象数组的时候呢,filter就显得相形见绌了,再用那种笨的一个一个遍历的方法会使得工作效率大打折扣,这个时候,需要用到reduce叠加方法,上代码: let arr = [{"all": 1}, {"all&q

原生JavaScript对象数组去重,重构为对象{pro1:[hash], pro02: [hash]}

function unique(objArr) { var result = {}; var proObj = objArr[0]; for(var pro in proObj){ var hash = []; for(var i = 0; i < objArr.length; i++){ var obj = objArr[i]; for(var pros in obj){ if(pros === pro){ var val = obj[pros]; if(!hash[val]){ var va

ES6中的Set、Map数据结构

Map.Set都是ES6新的数据结构,他们都是新的内置构造函数.也就是说typeof的结果,多了两个. 他们是什么:  Set是不能重复的数组.    Map是可以任何东西当做键的对象: ES6 提供了新的数据结构 Set.它类似于数组,但是Set成员的值都是唯一的,没有重复的值. let m = new Set(); m.add(1); m.add(2); m.add(3); m.add(3); m.add(3); m.add(4); m.add(5); console.log(m); 集合中

ES6 之 Set数据结构和Map数据结构 Iterator和for...of循环

ECMAScript 6 入门 Set数据结构 基本用法 ES6提供了新的数据结构Set.它类似于数组,但是成员的值都是唯一的,没有重复的值. Set本身是一个构造函数,用来生成Set数据结构. var s = new Set(); [2, 3, 5, 4, 5, 2, 2].map(x => s.add(x)); for (let i of s) { console.log(i); } // 2 3 5 4 上面代码通过add方法向Set结构加入成员,结果表明Set结构不会添加重复的值. 向S