首页 > web前端 > js教程 > 正文

js集合set去重方法_js集合set去重技巧详解

冰火之心
发布: 2025-06-29 20:25:01
原创
694人浏览过

javascript中利用set集合去重简洁高效,通过new set(arr)创建唯一值集合再转回数组即可。但set无法去除nan重复值,也无法识别相同对象字面量;对于此类情况需使用filter和indexof或第三方库如lodash处理;此外set可用于其他数据结构的间接去重,例如将链表转为数组再使用set,最后转回原始结构;对于按对象属性去重的复杂场景,可使用map结合filter方法实现,根据指定属性过滤重复项。

js集合set去重方法_js集合set去重技巧详解

JavaScript中,利用Set集合进行去重是一种非常简洁高效的方式。它能快速移除数组中的重复元素,让你的代码更清晰易读。

js集合set去重方法_js集合set去重技巧详解

解决方案:

js集合set去重方法_js集合set去重技巧详解

Set对象天生具备去重的特性。你可以将数组转换为Set,然后再将Set转换回数组,这样就得到了去重后的结果。

js集合set去重方法_js集合set去重技巧详解
function uniqueArray(arr) {
  return [...new Set(arr)];
}

// 示例
const myArray = [1, 2, 2, 3, 4, 4, 5];
const uniqueArrayResult = uniqueArray(myArray);
console.log(uniqueArrayResult); // 输出: [1, 2, 3, 4, 5]
登录后复制

这段代码的核心在于new Set(arr),它会创建一个包含arr中所有唯一值的Set对象。然后,使用扩展运算符...将Set对象转换回数组。

Set去重相比传统循环判断的方式,代码量更少,可读性更强,性能也通常更好,尤其是在处理大型数组时。

Set集合去重有哪些局限性?

虽然Set去重很方便,但它并非万能。例如,Set认为NaN和NaN是不同的,因此无法去除数组中多个NaN值。此外,Set无法区分对象,即使两个对象字面量看起来完全相同,Set也会认为它们是不同的。

const arrWithNaN = [1, NaN, NaN, 2];
const uniqueArrWithNaN = [...new Set(arrWithNaN)];
console.log(uniqueArrWithNaN); // 输出: [1, NaN, NaN, 2]

const arrWithObjects = [{a: 1}, {a: 1}];
const uniqueArrWithObjects = [...new Set(arrWithObjects)];
console.log(uniqueArrWithObjects); // 输出: [{a: 1}, {a: 1}]
登录后复制

对于包含NaN或对象的数组,可能需要使用其他去重方法,例如使用filter和indexOf,或者使用第三方库如Lodash。

除了数组,Set还能用于其他数据结构的去重吗?

Set主要用于数组去重,但它也可以间接用于其他数据结构的去重。例如,你可以先将链表或树转换为数组,然后使用Set去重,最后再将结果转换回原始数据结构。这种方法的效率取决于数据结构转换为数组的效率。

// 假设你有一个链表 toArray() 方法将其转换为数组
// 示例:
// class LinkedList {
//   constructor() {
//     this.head = null;
//   }
//   toArray() {
//     let arr = [];
//     let current = this.head;
//     while(current) {
//       arr.push(current.data);
//       current = current.next;
//     }
//     return arr;
//   }
// }

// const linkedList = new LinkedList();
// // ... 向链表添加数据 ...

// const arrayFromLinkedList = linkedList.toArray();
// const uniqueArrayFromLinkedList = [...new Set(arrayFromLinkedList)];

// // 然后你可以将 uniqueArrayFromLinkedList 转换回链表
登录后复制

这种方法需要根据具体的数据结构进行调整,确保转换过程不会丢失关键信息。

如何处理更复杂的去重场景,例如根据对象的某个属性去重?

当需要根据对象的某个属性进行去重时,Set本身无法直接实现。你需要使用其他方法,例如使用Map或者reduce方法。

function uniqueArrayByProperty(arr, property) {
  const map = new Map();
  return arr.filter((item) => {
    if (!map.has(item[property])) {
      map.set(item[property], true);
      return true;
    }
    return false;
  });
}

// 示例
const myArray = [{id: 1, name: 'A'}, {id: 2, name: 'B'}, {id: 1, name: 'C'}];
const uniqueArrayById = uniqueArrayByProperty(myArray, 'id');
console.log(uniqueArrayById); // 输出: [{id: 1, name: 'A'}, {id: 2, name: 'B'}]
登录后复制

这段代码使用Map来存储已经出现过的属性值,然后使用filter方法过滤掉重复的对象。这种方法可以灵活地根据不同的属性进行去重。

以上就是js集合set去重方法_js集合set去重技巧详解的详细内容,更多请关注php中文网其它相关文章!

最佳 Windows 性能的顶级免费优化软件
最佳 Windows 性能的顶级免费优化软件

每个人都需要一台速度更快、更稳定的 PC。随着时间的推移,垃圾文件、旧注册表数据和不必要的后台进程会占用资源并降低性能。幸运的是,许多工具可以让 Windows 保持平稳运行。

下载
来源:php中文网
本文内容由网友自发贡献,版权归原作者所有,本站不承担相应法律责任。如您发现有涉嫌抄袭侵权的内容,请联系admin@php.cn
最新问题
开源免费商场系统广告
热门教程
更多>
最新下载
更多>
网站特效
网站源码
网站素材
前端模板
关于我们 免责申明 意见反馈 讲师合作 广告合作 最新更新
php中文网:公益在线php培训,帮助PHP学习者快速成长!
关注服务号 技术交流群
PHP中文网订阅号
每天精选资源文章推送
PHP中文网APP
随时随地碎片化学习
PHP中文网抖音号
发现有趣的

Copyright 2014-2025 https://www.php.cn/ All Rights Reserved | php.cn | 湘ICP备2023035733号