在前端开发中经常会遇到需要对数组进行去重的操作，常见的解决方法是遍历数组，然后将不重复的元素存入一个新数组中。然而这种方法效率较低，尤其是在数组长度较大的情况下，时间复杂度甚至会达到 O(n^2)。而基于 ES6 的 Set 数据结构可以快速实现数组去重，时间复杂度为 O(n)。
Set 数据结构简介
Set 是 ES6 新增的一种数据结构，它类似于数组，但是成员的值都是唯一的，没有重复的值。Set 中的值可以是任意类型，包括基本类型和对象引用类型。与之对应的数据结构是 Map，它也是以键值对的形式存储数据，但是键可以是任意类型。
Set 的基本用法如下：
-- -------------------- ---- ------- -- -- --- ----- --- - --- ------- -- -- ---- -- ---- ----------- -- --- --- -- -- -- -- ---- -------------- -- --- --- -- -- -- -- --- ------------ -- --- --
实现数组去重
基于 Set 数据结构实现数组去重的过程如下：
const arr = [1, 2, 3, 3]; const uniqueArr = [...new Set(arr)]; console.log(uniqueArr); // [1, 2, 3]
这里使用了 spread operator （展开运算符）将 Set 转换为数组。
如果你不喜欢使用 spread operator ，也可以使用 Array.from() 方法来将 Set 转换为数组：
const arr = [1, 2, 3, 3]; const uniqueArr = Array.from(new Set(arr)); console.log(uniqueArr); // [1, 2, 3]
指导意义
使用基于 ES6 的 Set 数据结构可以快速实现数组去重，提高代码效率。而且 Set 数据结构本身是一种很实用的数据结构，在开发过程中可以不断尝试使用它来提高代码效率。
同时，需要注意的是 Set 中的值是唯一的，所以如果想要根据对象属性来进行去重，需要注意对象引用类型的情况。比如下面的代码实现并不能成功去重：
const arr = [{ name: 'Alice' }, { name: 'Bob' }, { name: 'Alice' }];
const uniqueArr = [...new Set(arr)];
console.log(uniqueArr); // [{ name: 'Alice' }, { name: 'Bob' }, { name: 'Alice' }]因为对象引用类型的判断是根据对象的引用地址来进行的，所以这里的三个对象虽然属性相同，但是它们的引用地址不同，所以不能被去重。如果要根据对象属性来进行去重，需要自定义判断规则，可以使用 Array.prototype.filter() 方法来实现。例如根据 name 属性来进行去重的代码如下：
const arr = [{ name: 'Alice' }, { name: 'Bob' }, { name: 'Alice' }];
const uniqueArr = arr.filter((item, index, self) =>
self.findIndex(i => i.name === item.name) === index
);
console.log(uniqueArr); // [{ name: 'Alice' }, { name: 'Bob' }]这里使用了 Array.prototype.filter() 和 Array.prototype.findIndex() 方法来自定义判断规则。
总结
ES6 中新增的 Set 数据结构可以快速实现数组去重，提高代码效率。在使用 Set 进行数组去重时需要注意对象引用类型的判断。如果需要根据对象属性进行去重，可以使用 Array.prototype.filter() 和 Array.prototype.findIndex() 方法来自定义判断规则。
来源：JavaScript中文网 ，转载请注明来源 https://www.javascriptcn.com/post/64635eec968c7c53b0466b87