面试官: 小伙子, 你的数组去重方式惊艳到我了

程序员咋不秃头2024-04-26 22:17:00  54

正题开始,数组去重,即从一个数组中移除所有重复的元素,确保每个元素只出现一次,是这一类问题的核心。

使用原生 JavaScript 方法

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)中。在每次迭代中,检查当前元素是否已存在于累积数组中。若不存在,则将其添加至累积数组;否则,跳过该元素。

利用 ES6 新特性

1. 使用扩展运算符与解构赋值

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

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

2. 利用 Map 数据结构

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

尽管不如直接使用 Set 直观,但此方法同样有效。它首先将数组映射为键值对相同的 Map,由于 Map 键的唯一性,重复的数组元素会被自动忽略。然后通过 Array.from 和 Map.values 将 Map 的值(即无重复元素)转换回数组。

双重循环与哈希表

1. 双重循环

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]); }}

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

2. 利用对象作为哈希表

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),高效,适合各种规模的数据集。

2. 优化策略

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

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

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

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

转载此文是出于传递更多信息目的。若来源标注错误或侵犯了您的合法权益,请与本站联系,我们将及时更正、删除、谢谢。
https://www.414w.com/read/398726.html
0
最新回复(0)