前言
ES5及之前大多是用遍历和算法来实现数组去重,在ES6有一个更加简便的方式。
Set + Array.from
set是一种新的数据结构,它可以接收一个数组或者对那个,类数组对象,自动去重其中的重复项目。
function unique (arr) {
return Array.from(new Set(arr))
}
var arr = [1,1,'true','true',true,true,15,15,false,false, undefined,undefined, null,null, NaN, NaN,'NaN', 0, 0, 'a', 'a'];
console.log(unique(arr)) //(11) [1, "true", true, 15, false, undefined, null, NaN, "NaN", 0, "a"]
在这里我们可以看见,重复的元素已经被去掉了,包括NaN。正常情况下,NaN返回的false,但是在set里,一样能够帮你去重,厉害吧。
…[拓展运算符] + Set
同样,我们也可以利用ES6数组的新方法,基本和上面的方法一致
function unique (arr) {
return [...new Set(arr)];
}
var arr = [1,1,'true','true',true,true,15,15,false,false, undefined,undefined, null,null, NaN, NaN,'NaN', 0, 0, 'a', 'a'];
console.log(unique(arr)) //(11) [1, "true", true, 15, false, undefined, null, NaN, "NaN", 0, "a"]
问题
先别高兴,抛开ES6的兼容性问题,我们再来试一下 引用数据类型。
function unique (arr) {
return Array.from(new Set(arr));
}
var arr = [[],[],[1],[1],{},{},{a:1},{a:1}];
console.log(unique(arr)) //[ [], [], [ 1 ], [ 1 ], {}, {}, { a: 1 }, { a: 1 } ]
我们可以发现,Set并不能去除重复的数组和对象。
当两个值都是对象的时候,比较的是两个对象在内存中是否指向的是同一个对象。这也就是为什么{}!=={}的原因。