一、前言
在我们项目开发,我们拿到从后端请求回来的数据时,往往需要对数组进行处理,有时候我们需要将前端的数据进行去重后再发送给后端,也有可能我们拿到后端传回来的数据,需要我们去重以后再使用
二、数组去重的几种方法
1.两次for循环
实现思路:通过两次循环,外层循环每取一次值,内层循环就开始 查找是否和 外层循环的取值相同,若相同,说明有相同的值,利用 splice() 方法删除数组的这一项,循环完毕,就达到了数组去重的效果
var arr = [1, 2, 3, 4, 1, 3] // 两次循环 function unique(arr) { let len = arr.length for (let i = 0; i < len; i++) { for (let j = i + 1; j < len; j++) { if (arr[i] == arr[j]) { arr.splice(j, 1) j-- //没删除一个 少了一项 len-- } } } return arr } console.log(unique(arr)) // [1,2,3,4]
2.filter() 方法
实现思路:利用filter() 方法循环数组,然后再利用 indexOf 方法判断当前值是否是第一次出现,若第一次出现时,为true; 若不是第一次出现,为false, 而 filter 方法正好是返回结果为true的每一项,就达到了数组去重的效果。
let arr = [1, 2, 3, 4, 5, 1, 2]; function unique(arr) { return arr.filter(function (item, index) { return arr.indexOf(item) === index; }); } console.log(unique(arr)); // [1,2,3,4,5]
3.数组includes()方法
实现思路: 先创建一个新数组,然后利用循环,每一项在push之前都要先利用 includes() 方法判断该值是否在新数组中存在,若不存在,则将该值push进该数组。
let arr = [1, 2, 3, 4, 3, 2, 1]; function unique(arr) { let newArr = []; for (let i = 0; i < arr.length; i++) { if (!newArr.includes(arr[i])) { newArr.push(arr[i]); } } return newArr; } console.log(unique(arr)); // [1,2,3,4]
4.数组indexOf()方法
实现思路:其实这个和 indexOf方法类似,都是通过创建新数组,只是判断新数组中是否存在该项的方法不一样。这里通过判断 newArr.indexOf(arr[i]) === -1 当结果为true,表示新数组中不存在该值,然后push进新数组中。
var arr = [1, 2, 3, 3, 4, 5, 1, 2] function unique(arr) { let newArr = [] for (let i = 0; i < arr.length; i++) { if (newArr.indexOf(arr[i]) === -1) { newArr.push(arr[i]) } } return newArr } console.log(unique(arr)) // [1,2,3,4,5]
5.set去重方法
var arr = [1, 3, 4, 5, 1, 23, 4, 5] // 去重 function unique(arr) { // return [...new Set(arr)] return Array.from(new Set(arr)) } console.log(unique(arr)) // [1,3,4,5,1,23]
三、总结
以上便是我知道的数组去重的几种比较常见的方法,set去重方法还是比较简单方便。
大家可以在评论区进行讨论,一起学习