Loading [MathJax]/jax/input/TeX/config.js
首页
学习
活动
专区
圈层
工具
发布
首页
学习
活动
专区
圈层
工具
MCP广场
社区首页 >专栏 >js中数组对象去重的方法

js中数组对象去重的方法

作者头像
半指温柔乐
发布于 2018-09-11 01:22:10
发布于 2018-09-11 01:22:10
12.6K00
代码可运行
举报
文章被收录于专栏:前端知识分享前端知识分享
运行总次数:0
代码可运行

最近工作中需要用到数组对象去重的方法,我是怎么想也没想出来,今天稍微研究了一下,总算找到了2种方法。分享一下,希望对大家有帮助!

方法一:

采用对象访问属性的方法,判断属性值是否存在,如果不存在就添加。

方法二:

采用数组中的reduce方法,遍历数组,也是通过对象访问属性的方法

代码语言:javascript
代码运行次数:0
运行
AI代码解释
复制
 1  var arr = [{
 2       key: '01',
 3       value: '乐乐'
 4    }, {
 5       key: '02',
 6       value: '博博'
 7    }, {
 8       key: '03',
 9       value: '淘淘'
10    },{
11       key: '04',
12       value: '哈哈'
13    },{
14       key: '01',
15       value: '乐乐'
16    }];
17 
18 
19    //  方法1:利用对象访问属性的方法,判断对象中是否存在key
20    var result = [];
21    var obj = {};
22    for(var i =0; i<arr.length; i++){
23       if(!obj[arr[i].key]){
24          result.push(arr[i]);
25          obj[arr[i].key] = true;
26       }
27    }
28    console.log(result); // [{key: "01", value: "乐乐"},{key: "02", value: "博博"},{key: "03", value: "淘淘"},{key: "04", value: "哈哈"}]
29 
30 
31 
32    //  方法2:利用reduce方法遍历数组,reduce第一个参数是遍历需要执行的函数,第二个参数是item的初始值
33       var obj = {};
34     arr = arr.reduce(function(item, next) {
35       obj[next.key] ? '' : obj[next.key] = true && item.push(next);
36       return item;
37    }, []);
38    console.log(arr); // [{key: "01", value: "乐乐"},{key: "02", value: "博博"},{key: "03", value: "淘淘"},{key: "04", value: "哈哈"}]
本文参与 腾讯云自媒体同步曝光计划,分享自作者个人站点/博客。
原始发表:2018-06-03 ,如有侵权请联系 cloudcommunity@tencent.com 删除

本文分享自 作者个人站点/博客 前往查看

如有侵权,请联系 cloudcommunity@tencent.com 删除。

本文参与 腾讯云自媒体同步曝光计划  ,欢迎热爱写作的你一起参与!

评论
登录后参与评论
暂无评论
推荐阅读
编辑精选文章
换一批
数组对象去重
在本博客中的表格中就有用到的,对于很多相同的标签,需要对标签进行过滤,把相同的给去掉
itclanCoder
2021/12/20
1.5K0
数组对象去重
js 数组里面去重对象的方法
js数组中对象去重的方法 今天在进行百度地图开发时,遇到多个重复的点位,需要将重复的点位进行过滤,正常的数组我们通常都能找到方法进行解决,但对对象数组进行去重处理,有点蒙圈,下面我们就进一步研究
江一铭
2022/06/17
2.4K0
9种JS数组去重的高阶方法思路,值得借鉴
一般的方法此处也不列举了,还是有很多的,如双层循环判断是否相等,或新建数组比较再push等等,需要注意的是,使用splice方法移除元素时,有可能会导致数组塌陷问题,需要处理一下。
前端达人
2021/06/16
1.2K0
JS数组去重的几种常见方法
// 最简单数组去重法 /* * 新建一新数组,遍历传入数组,值不在新数组就push进该新数组中 * IE8以下不支持数组的indexOf方法 * */ function uniq(array){
李才哥
2019/07/10
1.1K0
JS数组去重的几种常见方法
JS数组、数组对象去重方法
Set本身是一个构造函数,用来生成Set结构;它类似于数组,但是成员的值是唯一的,没有重复的值
peng_tianyu
2022/12/15
14.6K0
JS数组、数组对象去重方法
数组去重
思路:利用两个for循环.遍历数组中的每一项,对每一项又遍历这项后面的每一项。也就是将当前元素与他后面的所有元素作比较,只要碰到与当前元素相等的情况,利用j = ++i重新开始外层大循环。直到其后面没有重复的元素就push进新数组
一觉睡到小时候
2019/07/03
3.4K0
forEach遍历数组对象且去重
这里要注意的是:function()里面的参数第一个是value ,第二个是下标(index),第三个是要便利的数组;
半指温柔乐
2018/09/11
1.8K0
js 实现扁平数组转为树形结构数组及树形结构数组转为扁平数组
转载请注明出处:https://www.cnblogs.com/beileixinqing/p/16666662.html
蓓蕾心晴
2022/09/24
2.3K0
分享6个对象数组去重的方法
使用 filter() 方法过滤掉重复的元素,使用 findIndex() 方法判断对象是否重复,代码如下:
前端达人
2023/02/17
4.6K0
分享6个对象数组去重的方法
ES6常用数组方法总结(max,contant,some,every,filter,reduce,forEach,map)
把arr4添加到arr3的尾部,可以看到,只是2个数组的追加,不会合并数组,去掉重复元素
五月
2022/11/15
1K0
ES6常用数组方法总结(max,contant,some,every,filter,reduce,forEach,map)
前端学习(40)~js学习(十七):数组的常见方法&数组的遍历
unshift():在数组最前面插入一个或多个元素,返回结果为该数组新的长度。插入元素后,其他元素的索引会依次调整。
Vincent-yuan
2020/03/19
1.9K0
JavaScript中的数组方法总结+详解「建议收藏」
功能: 在数组最后一位添加一个或多个元素,并返回新数组的长度,改变原数组.(添加多个元素用逗号隔开)
全栈程序员站长
2022/09/14
1.5K0
JavaScript中的数组方法总结+详解「建议收藏」
JS数组常用方法大全
join(separator): 将数组的元素组起一个字符串,以separator为分隔符,省略的话则用默认用逗号为分隔符,该方法只接收一个参数:即分隔符。
青梅煮码
2023/01/14
3.3K0
javascript数组去重的N种方法
这段代码使用了循环嵌套,首先循环遍历数组中每一项,然后用每一项和当前项后面的数组元素比对,相同的话,将其从数组中删除,依次循环完成,达到去重目的。
挥刀北上
2019/08/06
9400
数组与对象的相互转换[通俗易懂]
前端小伙伴儿时常会遇到需要将服务器返回的数据进行处理的场景,本文介绍了数组与对象相互转换的场景,一起来看看吧~
全栈程序员站长
2022/09/30
2.4K0
数组与对象的相互转换[通俗易懂]
JS中数组去重的几种方法分享
数组去重是工作中常用的小技巧,一般的方法此处也不列举了,还是有很多的,如双层循环判断是否相等,或新建数组比较再push等等,需要注意的是,使用splice方法移除元素时,有可能会导致数组塌陷问题,需要处理一下。
用户4831957
2021/04/09
1.1K0
JavaScript权威指南 - 数组
JavaScript数组是一种特殊类型的对象。 JavaScript数组元素可以为任意类型,最大容纳232-1个元素。 JavaScript数组是动态的,有新元素添加时,自动更新length属性。 JavaScript数组元素索引可以是不连续的,它们之间可以有空缺。
Esofar
2018/09/05
4.2K0
数组对象根据对象中指定的属性去重?你知道多少
有一天有一个朋友给我发来消息 “数组对象根据对象中指定的属性去重?让我写写看”,看到这个的时候我有点懵逼,好像不太会。
sunseekers
2018/10/31
3.2K0
ES6中Array数组你应该知道的操作
上一次我们讲解了JavaScript的Array,了解了很多关于Array的属性,方法等。相信大家收益颇多,今天为大家带来更深次的了解,希望您可以学习更多。如果您还没有了解上一课程,请点击:你对JavaScript的Array对象了解有多少? 下方的代码都通过ES6语法,所以您需要先熟悉它。下面我们直奔主题。
Javanx
2019/09/04
6140
JS手撕(一)    类型判断、instanceof、数组去重
有用过JS一段时间的小伙伴应该对typeof比较属性,我们需要进行类型判断的时候一般都会先想到它。但是呢,它有一个很大的局限性,比如如果是null、array都会被认为是object,array是因为是一个特殊的对象,而null则是因为JS诞生以来null的实现导致的。
赤蓝紫
2023/03/16
1.9K0
相关推荐
数组对象去重
更多 >
领券
问题归档专栏文章快讯文章归档关键词归档开发者手册归档开发者手册 Section 归档
本文部分代码块支持一键运行,欢迎体验
本文部分代码块支持一键运行,欢迎体验