javascript数组怎么去重

javascript数组去重的核心答案是:1. 使用set可高效去重基本类型,但无法处理对象引用;2. indexof/includes适合小数组但性能差;3. map性能优于indexof,适合大数据量;4. 对象数组需基于唯一键或自定义比较规则去重;5. nan在set中被视为相同,而indexof无法识别;6. null和undefined可正常去重;7. 多属性或深比较需构造唯一标识或使用深比较逻辑;选择方法应综合考虑数据类型、性能需求和数组规模。

javascript数组怎么去重

JavaScript数组去重,简单来说,就是把数组里重复的元素都干掉,只留下独一份。方法挺多的,各有优劣,选择哪个取决于你的具体需求,比如性能要求、数据类型等等。

javascript数组怎么去重

解决方案

利用Set数据结构

Set是ES6引入的新数据结构,它最大的特点就是不允许重复的值。所以,我们可以先把数组转成Set,然后再把Set转回数组。

立即学习“Java免费学习笔记(深入)”;

javascript数组怎么去重

const arr = [1, 2, 2, 3, 4, 4, 5];const uniqueArr = [...new Set(arr)]; // 或者 Array.from(new Set(arr))console.log(uniqueArr); // [1, 2, 3, 4, 5]

这种方法简洁高效,尤其适合处理基本数据类型的数组。但需要注意的是,Set认为

NaN

是相等的,只会保留一个。另外,对于对象类型的数组,Set无法直接去重,因为对象是引用类型,即使属性值相同,它们在内存中的地址也不同。

使用indexOf或includes

遍历数组,如果当前元素不在新数组中,就把它push进去。

javascript数组怎么去重

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

这种方法兼容性好,但性能相对较差,特别是对于大型数组。

indexOf

includes

都需要遍历已去重的数组,时间复杂度是O(n)。

使用filter和indexOf

结合

filter

方法,可以更简洁地实现去重。

const arr = [1, 2, 2, 3, 4, 4, 5];const uniqueArr = arr.filter((item, index) => {  return arr.indexOf(item) === index;});console.log(uniqueArr); // [1, 2, 3, 4, 5]

这种方法本质上还是基于

indexOf

,所以性能瓶颈依然存在。

使用Map数据结构

Map对象保存键值对,任何值(对象或者原始值) 都可以作为一个键或一个值。我们可以利用Map的键的唯一性来实现去重。

const arr = [1, 2, 2, 3, 4, 4, 5];const map = new Map();const uniqueArr = [];for (let i = 0; i < arr.length; i++) {  if (!map.has(arr[i])) {    map.set(arr[i], true);    uniqueArr.push(arr[i]);  }}console.log(uniqueArr); // [1, 2, 3, 4, 5]

Map的

has

方法查找效率比

indexOf

高,所以这种方法在处理大型数组时性能更好。

针对对象数组的去重

如果数组中的元素是对象,那么简单的

Set

或者

indexOf

就不管用了。我们需要自定义比较函数。

const arr = [{id: 1, name: 'a'}, {id: 2, name: 'b'}, {id: 1, name: 'a'}];function uniqueObjectArray(arr, key) {  const seen = new Set();  return arr.filter(item => {    const k = item[key];    return seen.has(k) ? false : seen.add(k);  });}const uniqueArr = uniqueObjectArray(arr, 'id');console.log(uniqueArr); // [{id: 1, name: 'a'}, {id: 2, name: 'b'}]

这个例子中,我们根据对象的

id

属性来判断是否重复。如果需要根据多个属性来判断,可以修改比较函数。

JavaScript数组去重有哪些性能优化的技巧?

避免重复遍历: 尽量减少循环次数。例如,使用

Set

Map

可以在一次遍历中完成去重。

选择合适的数据结构

Set

Map

的查找效率比

indexOf

高,适合处理大型数组。

避免不必要的类型转换: 如果数组元素类型已知,避免在比较过程中进行类型转换,可以提高性能。

利用缓存: 对于复杂的比较逻辑,可以利用缓存来避免重复计算。

考虑数组规模: 对于小型数组,简单的

indexOf

可能足够快。对于大型数组,更高效的算法更重要。

如何处理包含

null

undefined

NaN

的数组去重?

null

undefined

: 可以直接使用

Set

indexOf

进行去重。它们会被视为普通的值。

NaN

NaN

与任何值都不相等,包括它自身。

indexOf

无法找到

NaN

Set

认为

NaN

是相等的,只会保留一个。如果需要区分多个

NaN

,需要自定义比较逻辑。

混合类型: 如果数组包含多种类型的值,需要注意类型转换问题。可以使用

typeof

运算符来判断类型,并进行相应的处理。

对象数组去重时,如何定义比较规则?

单属性比较: 如果只需要根据一个属性来判断对象是否重复,可以直接比较该属性的值。

多属性比较: 如果需要根据多个属性来判断,可以将这些属性的值组合成一个字符串或对象,然后进行比较。

自定义比较函数: 可以编写自定义的比较函数,根据复杂的业务逻辑来判断对象是否重复。

考虑深比较: 如果对象包含嵌套的对象或数组,需要进行深比较,确保所有属性都相同才认为对象重复。可以使用递归或第三方库来实现深比较。

以上就是javascript数组怎么去重的详细内容,更多请关注创想鸟其它相关文章!

版权声明:本文内容由互联网用户自发贡献,该文观点仅代表作者本人。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。
如发现本站有涉嫌抄袭侵权/违法违规的内容, 请发送邮件至 chuangxiangniao@163.com 举报,一经查实,本站将立刻删除。
发布者:程序猿,转转请注明出处:https://www.chuangxiangniao.com/p/96679.html

(0)
打赏 微信扫一扫 微信扫一扫 支付宝扫一扫 支付宝扫一扫
上一篇 2025年11月19日 23:42:29
下一篇 2025年11月20日 00:07:56

相关推荐

发表回复

登录后才能评论
关注微信