JS数组去重

·  阅读 108

昨日去了前端的笔试,很简单的题,但是我居然没有全做出来... 问题就出现在js的数组去重!!所以今天我准备将js的方法总结一番,避免以后再遇见啦

方法一:数组遍历+indexOf()

indexOf()方法可返回数组中某个指定的元素位置。如果找到一个 item,则返回 item 的第一次出现的位置。开始位置的索引为 0。如果在数组中没找到指定元素则返回 -1。

function delre(arr) {
	//创建一个变量存储去重后的数组
    var ret = [];

    for (var i = 0, j = arr.length; i < j; i++) {
		//如果ret中不存在arr[i],就将arr[i]的值放入ret,存在就不放入
        if (ret.indexOf(arr[i]) === -1) {
        
            ret.push(arr[i]);
        }

    }
    return ret;
}
复制代码

数组的遍历不仅可以用for还可以使用forEach

forEach()方法用于调用数组的每个元素,并将元素传递给回调函数**。注意:** forEach() 对于空数组是不会执行回调函数的。

function delre(arr) {

    var ret = [];
	//回调函数的参数中e是当前值,i是当前值的索引值,arr当前值所在的数组
    arr.forEach(function(e, i, arr) {
		//indexOf()检查元素第一次出现的下标,所以当后面有重复的时候,两个的下标就不一样了
        if (arr.indexOf(e) === i) {

            ret.push(e);

        }

    });

    return ret;

}
复制代码

方法二:使用filter去重

filter() 方法创建一个新的数组,新数组中的元素是通过检查指定数组中符合条件的所有元素。

注意: filter() 不会对空数组进行检测。 filter() 不会改变原始数组。

function delre(arr) {
	//filter是数组符合条件的元素返回
    return arr.filters((e,i,arr)=>{
    //indexOf()检查元素第一次出现的下标,所以当后面有重复的时候,两个的下标就不一样了
        return arr.indexOf(e)==i;
    })
  }
复制代码

方法三:使用ES6中的Set和Map

Set对象允许你存储任何类型的唯一值,无论是原始值或者是对象引用。Set中的元素只会出现一次,即 Set 中的元素是唯一的。

const numbers = [2,3,4,4,2,3,3,4,4,5,5,6,6,7,5,32,3,4,5]
console.log([...new Set(numbers)]) 
//Array.from()能把伪数组转化为真正的数组
console.log(Array.from(new Set(numbers))
// [2, 3, 4, 5, 6, 7, 32]
复制代码

Map 对象保存键值对,并且能够记住键的原始插入顺序。任何值(对象或者原始值) 都可以作为一个键或一个值。

function delre(arr){

    //map.has()返回一个布尔值,表示Map实例是否包含键对应的值
    //map.set()设置Map对象中键的值。返回该Map对象。
    let map = new Map();
    return arr.filter((a)=>!map.has(a)&&map.set(a,1));
}
复制代码

当然啦数组去重还有更多的方法,我这里只选取了简单和比较好的,如果想看更多的方法,可以参考文章

参考文章: 作者:Jack-rainbow 链接:juejin.cn/post/684490…

分类:
前端
标签:
分类:
前端
标签:
收藏成功!
已添加到「」, 点击更改