ES6去重方案详解

一、Set数据结构去重

ES6中引入了Set数据结构，它类似于数组，但成员的值都是唯一的，没有重复的值。可以将数组转化为Set结构进而去重。

// 数组去重
const arr = [1, 1, 2, 3, 3];
const arrUnique = [...new Set(arr)];
console.log(arrUnique); // [1, 2, 3]

// 对象数组去重
const objArr = [{name: 'Alice', age: 18}, {name: 'Bob', age: 20}, {name: 'Alice', age: 18}];
const set = new Set(objArr.map(item => JSON.stringify(item)));
const uniqueObjArr = Array.from(set).map(item => JSON.parse(item));
console.log(uniqueObjArr); // [{name: 'Alice', age: 18}, {name: 'Bob', age: 20}]

使用Set的优点是去重效率高，可以去除数组和对象数组中的重复元素。但缺点是转化为Set结构后，顺序会被打乱，无法保持原数组顺序。

二、Filter方法去重

利用filter方法和indexOf下标的特性可以对数组进行去重。当indexOf查询元素的下标与当前循环索引相等时，说明元素第一次出现。

const arr = [1, 1, 2, 3, 3];
const arrUnique = arr.filter((item, index) => arr.indexOf(item) === index);
console.log(arrUnique); // [1, 2, 3]

缺点是 indexOf会进行多次循环查询，当数组元素比较多时效率较低。

三、Map映射表去重

使用Map映射表数据结构将数组元素与出现次数作为Key-Value键值对进行存储，取出count==1的Key值即为去重后的数组。

const arr = [1, 1, 2, 3, 3];
const map = new Map();
for(let i=0; i
    item[1] === 1).map(item => item[0]);
console.log(arrUnique); // [1, 2, 3]

   

四、Reduce方法去重

借助reduce函数和includes来去重，当新的数组中包含元素就跳过，否则添加到新数组中。

const arr = [1, 1, 2, 3, 3];
const arrUnique = arr.reduce((pre, cur) => pre.includes(cur) ? pre : [...pre, cur], []);
console.log(arrUnique); // [1, 2, 3]

五、双重循环去重

最简单的去重方法是使用双重循环，循环体内使用splice方法删除后面的重复元素，效率最低，不推荐使用。

const arr = [1, 1, 2, 3, 3];
for(let i=0; i