JS数组去重

昨日去了前端的笔试，很简单的题，但是我居然没有全做出来... 问题就出现在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…