for根据ID去重_【基础必学】对象类型元素数组去重实现方法

a2c2dc8d9c92595ab6fb0ab7d7f73e84.png

3e37026acd7458c2727db95df2aaf002.png

基础的数组去重的方法,很简单就能实现了,但是如果讲到对象类型的元素去重,可就难倒了很多同学了。今天就由李老师来给大家分享一下,我们如何对JavaScript的对象类型的数组进行去重处理。

e2a6ad187cec9892ac9a1576842364e0.png

需求

首先我们现在有这样一个数组,我们需要做一个去重操作

c60292e41e6b97fcf8f8c5abfa04264d.png

最后得到这样的结果

969558452a12563025f0a3f98e635161.png

去重

简单数组的去重

b2c694ae96a9209200712fa59938ec43.png

以对象为元素的数组去重

和数组相关的算法多种多样,在你以为自己已经掌握数组之后,会发现很多和数组相关的算法仍旧很复杂。

下面我们讲述一个入门等级的数组算法,解决上面提出的需求。

1、定义一个函数removeRepeat,它需要传入2个参数,arr表示需要去重的数组,field表示需要比较的key。比如我们的需求是比较 _id 是否有重复。

6b8ef3577514a8b41acf536d4697baf7.png

2、需要一个空数组,用来存储每个对象元素中field对应的value。

af0c6916d5c5f2738b587fbe3d0cf2e9.png

3、将所有field的值存到数组之后,它们的下标一一对应原数组的下标(这点很重要),接着我们需要2个对象集合,result用来存储s里遍历出来的元素,如果有重复,就将重复的元素丢到reSet对象里面。

3c2dc8fa7794b7dddb087f37c8481cb3.png

4、上一步得到了result和reSet2个对象,那么,我们该用哪个对象来处理原数组的去重呢?只需要reSet,reSet记录了要去重的对象所在的下标,那么可以直接用splice干掉它。

48c7150c29cc0bf46d92ca4011db0946.png

5、说明

关键的第3和4步,都是用对象来处理,这样做的好处是时间复杂度可以达到O(1),如果用数组来保存,则需要2个for循环,时间复杂度变成了O(n²)。

1ba363a3340cb46c394ffe610077b3ff.png

完整源码

补充

上面的代码也还可以再做两点优化。

1、更简洁的代码。

2、支持多个重复对象的去重,缺点是会改变原来的排序。

a6f70b8e2773cc2fffa8fba4277e5041.png

总结

数组还有各种有趣的操作,也经常是作为各大公司考察的题型之中,想成为前端开发工程师的你,多练习和数组相关的算法会对你很有帮助。


f449c272591b8c95fe3164346204c5f5.png

如果你有更好的方法,可以留言互动哦,然后想学习更多内容,也欢迎留言哦,说不定下次就讲你想学习的内容了呢!

  • 0
    点赞
  • 0
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值