ES6中删除重复的数组元素的几种方法( Set 方法最简单 )

---

---

1. 使用Set

   Set是ES6中引入的一个新的数据对象。因为Set只允许你存储唯一的值。当你传入一个数组时，它将删除其中所有重复的值。
   让我们回到我们的代码，分解一下代码发生了什么。这里做了2件事：

   1. 首先，我们创建了一个新的Set对象，把一个数组传递进去。因为Set只允许唯一的值存在，所有重复的元素都会被删除。
   2. 现在重复的值已经没有了，我们再把它转回一个数组，这里使用了扩展运算符…

   

   使用Array.from把Set转为一个数组

   或者，你也可以使用Array.from把一个Set转为一个数组：
   

---

2. 使用filter

   为了理解这种处理方式，我们先了解一下这两个方法是做什么的：indexOf 和 filter。

   IndexOf

   indexOf方法返回在数组中找到的符合要求的元素第一次出现的索引值。
   

   filter

   filter方法会遍历原数组筛选出符合条件的元素组成一个新数组。换句话说，如果数组元素符合条件并返回了true，它会被填充到新的过滤后的数组里。其他元素不符合条件或者返回了false，不会现在过滤后的数组里。

   让我们深入了解，看看数组循环中做了什么。

   

   下面是在控制台的输出。重复的元素是那些索引值和indexOf()不相同的。所以对于那些元素，条件检查会返回false，它们不会出现在过滤后的数组里。
   

   查找重复的值

   我们也可以使用filter方法来查找数组中的重复值。我们只需要调整一下过滤条件即可：
   

   如果我们运行上面的代码会看到下面的输出：
   

---

3. 使用reduce

   reduce方法用于缩减数组元素，并根据你传递的缩减处理函数将它们组合成最终的数组。

   对于我们的例子，我们的缩减处理函数（reducer）会检查最终的数组里是否包含了某个元素。如果没有包含，会把该元素推入此数组里。否则，会忽略此元素。函数最后返回最终的数组。

   缩减过程不太容易理解，让我们分解一下，看看输出结果：
   

   如下是console.log的输出结果：