2025好运-JS篇-数组去重的多种方法

138 阅读2分钟

JS里的数组去重是面试及实际开发中常见的功能,接下来列举5种数组的去重方法

1. 使用Set对象(ES6)

Set 是 ES6 引入的新的数据结构,它只会存储唯一的值,利用这个特性可以轻松实现数组去重。

const arr = [1, 2, 2, 3, 4, 4, 5];
// 使用 Set 对象去重,Set 对象不允许有重复的值
const uniqueArr = [...new Set(arr)]; 
console.log(uniqueArr); // 输出: [1, 2, 3, 4, 5

2. 使用Map对象(ES6)

利用 Map 的键唯一性特性

const arr = [1, 2, 2, 3, 4, 4, 5];
// Map 对象的键是唯一的,因此重复的元素只会保留一个
const uniqueArr = Array.from(new Map(arr.map(item => [item, true])).keys());
console.log(uniqueArr); // [1, 2, 3, 4, 5]

3. 使用filter方法

filter() 方法会创建一个新数组,结合 indexOf() 方法,可以筛选出数组中第一次出现的元素。

const arr = [1, 2, 2, 3, 4, 4, 5];
// 检查当前元素的索引是否等于它在数组中首次出现的索引
const uniqueArr = arr.filter((value, index, self) => self.indexOf(value) === index;
console.log(uniqueArr); // 输出: [1, 2, 3, 4, 5]

4. 使用reduce()方法

reduce() 方法对数组中的每个元素执行一个 reducer 函数,将其结果汇总为单个返回值。在这个过程中可以判断元素是否已经存在于结果数组中。

const arr = [1, 2, 2, 3, 4, 4, 5];
const uniqueArr = arr.reduce((acc, current) => {
    // 检查结果数组中是否已经包含当前元素。如果不包含,则将当前元素添加到结果数组中
    if (!acc.includes(current)) acc.push(current);
    return acc;
}, []);
console.log(uniqueArr); // 输出: [1, 2, 3, 4, 5]

5. 使用 for 循环和 includes() 方法

通过遍历数组,使用 includes() 方法检查元素是否已经存在于新数组中,如果不存在则添加到新数组。

const arr = [1, 2, 2, 3, 4, 4, 5];
const uniqueArr = [];
for (let i = 0; i < arr.length; i++) {
    if (!uniqueArr.includes(arr[i])) uniqueArr.push(arr[i]);
}
console.log(uniqueArr); // 输出: [1, 2, 3, 4, 5]