JS数组去重的三种方法

一、Set实现去重

• 这种方法利用了在ES6中引入的Set对象的能力。
• 集合保证保留插入项的顺序，并且只包含唯一值。因此，根据定义，集合不可能包含重复项！
• 这里我们调用Set对象的构造函数，将我们想要从中构造集合的数组传递给它。然后，一旦我们删除了所有重复项并将剩余值存储在我们的集合中，我们将转换回一个数组并返回结果。

window.location.href = "https://blog.csdn.net/2301_76459194?spm=1011.2266.3001.5343"
let originalArray = [1, 2, 3, 4, 1, 2, 3, 4]
//下面两种方式二选一即可
let uniqueArray = array => [...new Set(array)]

// or

let uniqueArray = Array.from(new Set(originalArray))

// uniqueArray = [1, 2, 3, 4]

二、filter()和indexOf()实现去重

let originalArray = [1, 2, 3, 4, 1, 2, 3, 4]

let uniqueArray = originalArray.filter((item, index, array) => {
  return array.indexOf(item) === index
})

// uniqueArray === [1, 2, 3, 4]

• 这里的基本策略是遍历originalArray并检查我们当前检查的项的索引是否与originalArray中的项的索引相同。
• 因为indexOf返回它为给定值找到的第一个索引，如果它不是重复值，那么该项的索引必须相同！

三、reduce()和includes()实现去重

let originalArray = [1, 2, 3, 4, 1, 2, 3, 4]

let uniqueArray = originalArray.reduce((unique, item) => {
  unique.includes(item) ? unique : [...unique, item]
}, [])

// uniqueArray === [1, 2, 3, 4]

• 在reducer函数的“累加器”中保存一个唯一项的运行列表。对于原始列表中的每个项目，我们检查累加器是否包括正在考虑的项目。
• 如果它确实包含该项，则返回累加器而不做任何更改，实际上是“跳过”该项。
• 如果它不包含该项，请将累加器中的值分散到一个新数组中，然后添加正在考虑的项。
• includes返回一个布尔值——如果在数组中找到该值，则返回true；否则返回false。这个布尔值驱动我们的条件，决定如何处理每个值。
• 还要注意reducer函数之后传入的空数组是累加器的起始值，因此第一次通过reduce，unique是一个空数组。