js 怎样过滤数组中的重复项

过滤 javascript 数组中的重复项有多种方法,1. 基础循环结合 indexof 检查,简单但性能差;2. 利用 es6 的 set 结构,代码简洁且效率高,适用于基本数据类型;3. 使用 filter 结合 indexof 或 includes,可保持原始顺序;4. 对象数组去重需基于唯一键使用 set 和自定义逻辑;5. set 能正确区分 null 和 undefined;6. 大型数组推荐使用 set 或 map 以获得 o(1) 查找性能;7. 若需保持顺序,可结合 set 与循环或使用 filter 方法。这些方法根据数据类型和性能需求选择使用,最终均能实现数组去重的目标。

js 怎样过滤数组中的重复项

过滤 JavaScript 数组中的重复项,本质上就是去重。有很多方法可以实现,从简单粗暴的循环判断,到利用 ES6 的 Set 数据结构,甚至还有更高级的利用 Map 的方式。选择哪种,主要看你的具体需求,比如数组大小、数据类型,以及对性能的要求。

解决方案

最基础的方法,就是用一个循环,然后每次检查当前元素是否已经存在于一个“已存在”的数组里。如果不存在,就把它加进去。这种方法简单直接,但效率相对较低,特别是对于大型数组。

function uniqueArray(arr) {  const result = [];  for (let i = 0; i < arr.length; i++) {    if (result.indexOf(arr[i]) === -1) {      result.push(arr[i]);    }  }  return result;}const myArray = [1, 2, 2, 3, 4, 4, 5];const unique = uniqueArray(myArray);console.log(unique); // 输出: [1, 2, 3, 4, 5]

ES6 引入了 Set 数据结构,它类似于数组,但是成员的值都是唯一的,没有重复的值。利用 Set 去重,代码简洁,效率也更高。

function uniqueArrayWithSet(arr) {  return [...new Set(arr)];}const myArray = [1, 2, 2, 3, 4, 4, 5];const unique = uniqueArrayWithSet(myArray);console.log(unique); // 输出: [1, 2, 3, 4, 5]

还可以使用

filter

方法结合

indexOf

includes

实现去重。

filter

方法创建一个新数组,其中包含通过所提供函数实现的测试的所有元素。

function uniqueArrayWithFilter(arr) {  return arr.filter((item, index) => arr.indexOf(item) === index);}const myArray = [1, 2, 2, 3, 4, 4, 5];const unique = uniqueArrayWithFilter(myArray);console.log(unique); // 输出: [1, 2, 3, 4, 5]

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

indexOf

或 Set 就不好使了,因为对象是引用类型,即使属性值相同,它们在内存中的地址也不同。这时候,就需要自定义比较函数。

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

如何处理包含

null

undefined

的数组去重?

如果数组中包含

null

undefined

,需要特别注意。因为

null == undefined

为 true,但

null === undefined

为 false。使用

Set

可以很好地处理这种情况,因为

Set

认为

null

undefined

是不同的值。如果使用

indexOf

,需要额外判断。

function uniqueArrayWithNullUndefined(arr) {  return [...new Set(arr)];}const myArray = [1, 2, null, undefined, 2, null, 3];const unique = uniqueArrayWithNullUndefined(myArray);console.log(unique); // 输出: [1, 2, null, undefined, 3]

在大型数组中,哪种去重方法性能最佳?

在大数据量的数组中,使用 Set 的性能通常是最好的。这是因为 Set 的

has

方法的时间复杂度是 O(1),而

indexOf

的时间复杂度是 O(n)。这意味着,随着数组大小的增加,

indexOf

的性能会急剧下降。当然,如果数组非常小,或者去重操作不是性能瓶颈,那么使用哪种方法都无所谓。

如何保持去重后数组元素的原始顺序?

如果需要保持去重后数组元素的原始顺序,使用 Set 可能不是最佳选择,因为它不保证元素的顺序。在这种情况下,可以使用

filter

方法,或者手动循环并记录已存在的元素。

function uniqueArrayWithOrder(arr) {  const seen = new Set();  const result = [];  for (let i = 0; i < arr.length; i++) {    if (!seen.has(arr[i])) {      result.push(arr[i]);      seen.add(arr[i]);    }  }  return result;}const myArray = [5, 2, 2, 3, 4, 4, 1];const unique = uniqueArrayWithOrder(myArray);console.log(unique); // 输出: [5, 2, 3, 4, 1]

以上就是js 怎样过滤数组中的重复项的详细内容,更多请关注创想鸟其它相关文章!

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

(0)
打赏 微信扫一扫 微信扫一扫 支付宝扫一扫 支付宝扫一扫
上一篇 2025年12月20日 09:42:19
下一篇 2025年12月20日 09:42:33

相关推荐

  • javascript怎么过滤数组中的元素

    javascript中过滤数组元素使用filter()方法,它通过回调函数测试每个元素并返回新数组;1. 回调函数返回true则保留元素,如numbers.filter(number => number > 3)筛选大于3的数;2. 可结合trim()和逻辑判断过滤空字符串,如str &…

    2025年12月20日 好文分享
    000
  • js如何过滤数组元素 数组过滤的3种高效方法解析

    javascript过滤数组元素主要使用filter()方法。1. filter()通过检查数组中符合条件的元素并创建新数组,如const evennumbers = numbers.filter(number => number % 2 === 0); //输出偶数。2. 其他方法包括:ma…

    2025年12月20日 好文分享
    000
  • 怎样用JavaScript过滤数组中的元素?

    javascript的filter()方法用于创建一个新数组,包含所有通过测试函数的元素。1) 基本用法:从用户列表中筛选活跃用户。2) 高级用法:筛选特定年龄范围内的用户。3) 性能优化:避免重复计算,使用原生方法,拆分复杂过滤逻辑。 引言 在处理数据时,数组过滤是常见且强大的操作。无论你是需要从…

    2025年12月20日
    000
  • 使用递归从已排序的链表中删除重复项

    链表是连接在一起的元素序列。每个列表都有一个头和一系列节点,每个节点都有当前节点的数据并链接到下一个节点。链表的基本操作是插入、删除、查找和删除。 从排序链表中删除重复项 删除节点的一​​种方法是使用递归。其思想是将每个节点与其相邻节点进行比较,并删除它们相等的重复节点。 我们的递归调用将返回到下一…

    2025年12月17日
    000
  • php如何过滤重复的数组?

    PHP过滤重复数组最常用array_unique(),适用于一维数组并保留首次出现元素及原始键名;多维数组需用serialize/array_map或手动遍历实现去重,按字段去重则需结合临时数组判断。 PHP过滤重复数组最常用的方法是用 array_unique(),它能直接去掉一维数组中的重复值,…

    2025年12月13日
    000
  • php中使用array_filter()函数过滤数组

    array_filter()用于过滤数组元素,通过回调函数保留满足条件的值。例如筛选偶数:$even = array_filter([1,2,3,4,5,6], function($n) { return $n % 2 == 0; }); 结果为[2,4,6],键名保留,可用array_values…

    2025年12月13日
    000
  • PHP中array_filter如何过滤数组?

    array_filter在php中用于过滤数组,保留符合条件的元素。1) 使用回调函数决定保留元素,返回true保留,false过滤。2) 可处理多维数组,如过滤成年人。3) 注意回调返回值需为布尔值,保留原数组键,可用array_values重置键。 在PHP中使用array_filter函数来过…

    2025年12月10日
    000
  • 如何使用array_filter函数过滤PHP数组?

    在php中使用array_filter函数过滤数组元素的方法包括:1. 基本用法:array_filter($array)默认过滤掉false值元素。2. 自定义回调:array_filter($array, function($item) { return $item > 18; })可定义…

    2025年12月10日
    000
  • 使用JavaScript函数实现数组的排序和过滤

    JavaScript函数实现数组的排序和过滤 在JavaScript中,我们经常需要对数组进行排序和过滤操作。本文将介绍如何使用JavaScript函数来实现数组的排序和过滤,并给出具体的代码示例。 一、排序数组 JavaScript提供了sort()函数用于对数组进行排序。sort()函数有两种用…

    2025年11月9日 web前端
    000

发表回复

登录后才能评论
关注微信