当前位置: 首页 > news >正文

数组的去重方法

1、ES6的Set方法去重

new Set是ES6新推出的一种类型。它和数组的区别在于,Set类型中的数据不可以有重复的值。当然,数组的一些方法Set也无法调用。
使用方法:将一个数组转化为Set数据,再转化回来,就完成了去重。

 const arr = [1,1,2,2,3,3,4,4,5,5];const setData = Array.from(new Set(arr));console.log(setData);//[1,2,3,4,5]

注意:Set去重有一个弊端,它无法去重引用类型数据,只能是值类型的数据(比如全是string或者全是number)

2、indexOf去重

   const  unique=(arr)=>{let repeatArr = [];for(let i = 0,len = arr.length; i < len; i++){if (repeatArr.indexOf(arr[i]) === -1)  repeatArr.push(arr[i])return repeatArr }}unique([1,1,2,2,3,3])// [1,2,3]

注意:这个方法也有一个细节点,您或许已经发现了,上文的if 和 for 没有花括号;是的;for 和 if 都默认对下面一条语句负责。在没有必要的情况下,不用多加一个{}。

3、includes去重

使用includes的去重方法和indexOf不能说很像,基本上一模一样。变换的仅仅只是判断方法。
includes的判断方法更简单了,循环数组的每一样,用新数组检测当前数组中是否包含数组项,如果不包含,则追加该元素。

const handleRemoveRepeat = (arr) =>{let repeatArr = [];for(let i = 0, len = arr.length; i < len; i++)if(!repeatArr.includes(arr[i]))repeatArr.push(arr[i])return repearArr;
}

4、filter去重

const unique = (arr) => arr.filter((item,index) => arr.indexOf(item,0)===index);
unique([1,1,2,2,3,3,4,4])
//[1,2,3,4]

indexOf 的特性是返回被查找的目标中包含的第一个位置的索引

[1,2,3,4,1].indexOf(1)
//0

下标为0和下标为4的位置存储的都是“1”。但是indexOf()只返回了0。因为indexOf 的特性是返回被查找的目标中包含的第一个位置的索引,我们可以利用这个特性来完成去重。

5、ES5常用:双重for循环,然后splice去重

var arr = [10,20,30,10,20,30,10,100,2,3];
function uniqArr(arr){//遍历数组中的每一个元素for(var i =0; i<arr.length; i++){//获取索引i之后的索引的数组元素for(arr[i] == arr[j]){arr.aplice(j,1); //删除重复元素j--;}}return arr;
}
consolr.log(uniqArr(arr))

6、Map()

has方法可以判断Map对象中是否存在指定元素,有则返回true,否则返回false
set方法可以向Map对象添加新元素map.set(key,value)
values方法可以返回Map对象值的遍历器对象

let arrObj = [{ name: "小红", id: 1 },{ name: "小橙", id: 1 },{ name: "小黄", id: 4 },{ name: "小绿", id: 3 },{ name: "小青", id: 1 },{ name: "小蓝", id: 4 }
]
//方法一:
let map = new Map();
for(let item of arrObj){if(!map.has(item.id)){map.set(item.id,item);}
};
arr=[...map.values()];
console.log(arr);
//方法二:
const map =new Map()
const newArr= arrObj.filter(v=> !map.has(v.id) && map.set(v.id, 1));
console.log(newArr)

JS对象数组去重
1、使用reduce

例1:
function uniqueFun(arr,uniId){let hash = {}return arr.reduce((accum,item) =>{hash[item[unId]] ?‘’ :hash[item[uniId]] = true && accum.push(item)return accum},[])
}
例2:
var arrData = [{id: , name: "小明"},{id: , name: "小张"},{id: , name: "小李"},{id: , name: "小孙"},id: , name: "小周"},{id: , name: "小陈"},
];
var obj = {}
val cur =[]
arrData = arrData.reduce((cur,next) =>{obj[next.id] ? "" :obj[next.id] = true && cur.push(next);return cur;
},[]) 
console.log(arrData)

2、使用filter和Map(强烈推荐)

function unique(arr,uniId){const res = new Map()return arr.filter((item) => !res.has(item[uniId]) && res.set(item[uniId], 1))
}
http://www.lryc.cn/news/59158.html

相关文章:

  • ESP32-LORA通信
  • 博客首页效果
  • 【LeetCode】剑指 Offer(29)
  • 自然语言处理(八):Lexical Semantics
  • 推荐一款 AI 脑图软件,助你神速提高知识体系搭建
  • 掌握这些“学习方法和工具”,让你事半功倍!
  • MyBatis 源码解析 面试题总结
  • 「业务架构」需求工程—需求规范(第3部分)
  • chapter-1数据管理技术的发展
  • 23.Spring练习(spring、springMVC)
  • 【数据库原理 • 七】数据库并发控制
  • 内部人员或给企业造成毁灭性损失
  • 【技巧】Word“只读方式”的设置与取消
  • 【软考备战·希赛网每日一练】2023年4月12日
  • 算法记录 | Day28 回溯算法
  • 气象历史数据和空气质量历史数据资源汇总免费
  • 【区块链】走进web3的世界-对于前端来说,web2与web3的区别
  • 深拷贝和浅拷贝
  • 【回眸】ChatGPT Plus(GPT4体验卡)
  • 走进小程序【七】微信小程序【常见问题总结】
  • 光电隔离转换器 直流信号放大器 导轨安装DIN11 IPO OC系列
  • 语聊房app的开发以及运营思路
  • 目标检测基础之IOU计算
  • 从spring boot泄露到接管云服务器平台
  • 大数据技术——spark集群搭建
  • 嵌入式学习笔记汇总
  • Python 全栈系列220 Tornado的服务搭建
  • ESXi安装CentOS
  • WebTest搭建
  • 什么性格的人适合报考机械类专业?(高考志愿填报选专业)