数组去重的几种方式

本文介绍了JavaScript中几种常见的数组去重方法,包括filter()配合indexOf()、reduce()、扩展运算符与Set、Map以及对象哈希表,同时对比了它们的时间复杂度,并提供了优化策略建议,如根据数据规模选择高效方法和预处理数据等。

摘要生成于 C知道 ,由 DeepSeek-R1 满血版支持, 前往体验 >

1. filter() 方法配合 indexOf()

const uniqueArray = array.filter((item,index,self) =>{
        return self.indexOf(item) === index ;
})

该方法利用 filter() 遍历数组,对于每个元素,通过 indexOf() 查找其在原数组中的第一个索引。如果当前元素的索引与正在遍历的索引相同,说明这是该元素在数组中的首次出现,保留该元素;否则,忽略该元素
2. reduce() 方法

const uniqueArray = array.reduce((acc, current) => {
  return acc.includes(current) ? acc : [...acc, current];
}, []);

使用 reduce() 函数将数组累积到一个新的数组(acc)中。在每次迭代中,检查当前元素是否已存在于累积数组中。若不存在,则将其添加至累积数组;否则,跳过该元素。
3. 使用扩展运算符与解构赋值

const uniqueArray = [...new Set(array)];

这种方法简洁高效,利用 ES6 的 Set 数据结构自动去除重复元素的特性,再通过扩展运算符将 Set 转换回数组。Set 是一种特殊的集合,不允许重复元素存在,因此插入过程会自动过滤重复项。
4. 利用 Map 数据结构

const uniqueArray = Array.from(new Map(array.map(item => [item, item])).values());

它首先将数组映射为键值对相同的 Map,由于 Map 键的唯一性,重复的数组元素会被自动忽略。然后通过 Array.from() 和 Map.values() 将 Map 的值(即无重复元素)转换回数组。

5. 双重循环

const uniqueArray = [];
for (let i = 0; i < array.length; i++) {
  let isDuplicate = false;
  for (let j = 0; j < i; j++) {
    if (array[i] === array[j]) {
      isDuplicate = true;
      break;
    }
  }
  if (!isDuplicate) {
    uniqueArray.push(array[i]);
  }
}

这种方法最直观也最基础,通过外层循环遍历数组,内层循环检查当前元素是否与之前的所有元素重复。如果没有重复,则将其添加到结果数组中。虽然理解简单,但时间复杂度较高,不适用于大型数据集。
6. 利用对象作为哈希表

const uniqueArray = [];
const hashTable = {};
for (let i = 0; i < array.length; i++) {
  const item = array[i];
  if (!hashTable[item]) {
    uniqueArray.push(item);
    hashTable[item] = true;
  }
}

这种方法利用对象作为哈希表,以数组元素作为键。在遍历过程中,若元素尚未作为对象的键存在,则添加到结果数组并将其设置为哈希表的键。由于对象属性查找的时间复杂度接近 O(1),这种方法在处理大量数据时比双重循环更为高效

性能比较与优化策略

  1. 性能比较

filter() + indexOf():线性时间复杂度 O(n^2),适合小型数据集。

reduce():线性时间复杂度 O(n^2),适合小型数据集。

扩展运算符与 Set:近乎线性时间复杂度 O(n),非常高效,适合各种规模的数据集。

Map:近乎线性时间复杂度 O(n),非常高效,适合各种规模的数据集。

双重循环:平方时间复杂度 O(n^2),效率低,仅适用于极小数据集。

哈希表:近乎线性时间复杂度 O(n),高效,适合各种规模的数据集。

  1. 优化策略

选择合适的方法:根据数据规模和项目需求,优先考虑使用 Set、Map 或哈希表方法,它们具有更高的时间效率。

预处理数据:如果可能,提前对数据进行排序或转换,简化去重逻辑,提高效率。

懒加载与分批处理:对于超大规模数据,可采用懒加载或分批处理策略,避免一次性加载全部数据导致的性能瓶颈。

使用 Web Worker:对于计算密集型的去重操作,可以考虑使用 Web Worker 进行多线程处理,避免阻塞主线程影响用户体验。

### 回答1: 有以下几种方法可以对JavaScript数组进行: 1. 使用 Set 数据结构: ```javascript let arr = [1, 2, 2, 3, 3, 4]; let uniqueArr = [...new Set(arr)]; console.log(uniqueArr); // [1, 2, 3, 4] ``` 2. 使用 filter() 方法: ```javascript let arr = [1, 2, 2, 3, 3, 4]; let uniqueArr = arr.filter((item, index, array) => { return array.indexOf(item) === index; }); console.log(uniqueArr); // [1, 2, 3, 4] ``` 3. 使用 reduce() 方法: ```javascript let arr = [1, 2, 2, 3, 3, 4]; let uniqueArr = arr.reduce((prev, cur) => { if (prev.indexOf(cur) === -1) { prev.push(cur); } return prev; }, []); console.log(uniqueArr); // [1, 2, 3, 4] ``` 4. 使用 Map 数据结构: ```javascript let arr = [1, 2, 2, 3, 3, 4]; let map = new Map(); let uniqueArr = []; arr.forEach(item => { if (!map.has(item)) { map.set(item, true); uniqueArr.push(item); } }); console.log(uniqueArr); // [1, 2, 3, 4] ``` 这些方法中,使用 Set 数据结构的方法最简单,代码最短。 ### 回答2: JS数组几种方法有以下几种: 1. 使用Set:将数组转换为Set,Set中的元素是唯一的,然后将Set转换回数组。例如: ```javascript var arr = [1, 2, 3, 3, 4, 4, 5]; var uniqueArr = Array.from(new Set(arr)); console.log(uniqueArr); // [1, 2, 3, 4, 5] ``` 2. 使用indexOf:遍历数组,使用indexOf方法判断元素在新数组中是否存在,如果不存在则将元素添加到新数组中。例如: ```javascript var arr = [1, 2, 3, 3, 4, 4, 5]; var uniqueArr = []; for (var i = 0; i < arr.length; i++) { if (uniqueArr.indexOf(arr[i]) === -1) { uniqueArr.push(arr[i]); } } console.log(uniqueArr); // [1, 2, 3, 4, 5] ``` 3. 使用includes:遍历数组,使用includes方法判断元素在新数组中是否存在,如果不存在则将元素添加到新数组中。例如: ```javascript var arr = [1, 2, 3, 3, 4, 4, 5]; var uniqueArr = []; for (var i = 0; i < arr.length; i++) { if (!uniqueArr.includes(arr[i])) { uniqueArr.push(arr[i]); } } console.log(uniqueArr); // [1, 2, 3, 4, 5] ``` 以上是常见的几种JS数组的方法,具体选择哪种方法可以根据实际需求和性能要求进行选择。 ### 回答3: 在JavaScript中,数组有多种方法: 1. 使用Set:Set是ES6中的新数据类型,它只能存储唯一的值。我们可以将数组转换成Set,然后再将Set转换回数组即可实现。 ```javascript let arr = [1, 2, 3, 3, 4, 4, 5]; let uniqueArr = [...new Set(arr)]; console.log(uniqueArr); // [1, 2, 3, 4, 5] ``` 2. 使用filter方法:通过使用filter方法遍历数组,返回一个新数组,只保留第一次遇到的元素。 ```javascript let arr = [1, 2, 3, 3, 4, 4, 5]; let uniqueArr = arr.filter((item, index, array) => { return array.indexOf(item) === index; }); console.log(uniqueArr); // [1, 2, 3, 4, 5] ``` 3. 使用reduce方法:通过使用reduce方法遍历数组,返回一个新数组,只保留第一次遇到的元素。 ```javascript let arr = [1, 2, 3, 3, 4, 4, 5]; let uniqueArr = arr.reduce((prev, curr) => { if (prev.indexOf(curr) === -1) { prev.push(curr); } return prev; }, []); console.log(uniqueArr); // [1, 2, 3, 4, 5] ``` 以上是JS数组几种常见方法,可以根据具体情况选择合适的方法进行使用。
评论 1
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包

打赏作者

大王0111

你的鼓励将是我创作的最大动力

¥1 ¥2 ¥4 ¥6 ¥10 ¥20
扫码支付:¥1
获取中
扫码支付

您的余额不足,请更换扫码支付或充值

打赏作者

实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值