前端js去重，一个好用的去重方案 @莫成尘

最新推荐文章于 2024-10-30 13:41:22 发布

莫成尘

最新推荐文章于 2024-10-30 13:41:22 发布

阅读量745

点赞数 1

CC 4.0 BY-SA版权

分类专栏： javascript js前端面试汇总文章标签： js vue javascript 前端 vue.js

本文链接：https://blog.csdn.net/weixin_47821281/article/details/115526443

javascript 同时被 2 个专栏收录

9 篇文章

订阅专栏

js前端面试汇总

6 篇文章

订阅专栏

本文介绍了一种在JavaScript中处理复杂数组去重问题的有效方法，称为'单key模式'，通过利用对象的唯一键特性，演示了如何使用示例代码对具有相同id的元素进行去重。适合初学者理解和实践。

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

先看代码，复制使用即可，在实际开发中，我们经常会遇到数组去重的问题，简单的数组比如`[1,2,3,1]` 可以很轻松的使用es6New set或者别的形式，稍微复杂点的对很多刚入门的小伙伴是个不错的考验，基于此，将以下较好的方法分享，我称其为单key模式

<!DOCTYPE html>
<html>
	<head>
		<meta charset="utf-8">
		<title></title>
	</head>
	<body>
	</body>
	<script type="text/javascript">
		//给 list 做去重 我们假定一个列表  在push的过程中多余了相同id的子元素
		let list = [
			{
				id:10,
				price:100,
			},
			{
				id:10,
				price:100,
			},
			{
				id:20,
				price:0.1
			}
		]
		let obj = {} //设定一个空对象 我们知道对象的key是唯一的
		let arr = []
		list.forEach(item=>{
			//想用id 去重 这里就改为item.id 价格就改为price
			if(!obj[item.id]){ 
				obj[item.id] = 1
				arr.push(item)
			}
		})
		console.log(arr)
		// [	//arr最终输出
		// 	{id:10,price:100},
		// 	{id:20,price:0.1},
		// ]
		
	</script>
</html>

其他有关js的疑问或者此方法不理解的地方您可留言，我会尽快回复并帮您解决。