Js数组去重系列

数组去重,这个工作中正常用到,因此记录一下。

1、双重循环大法+splice || Object.is

// 思路:循环遍历比较数组前后两个元素是否相等,再利用splice方法删除重复的后一项,splice方法影响原数组。
function deduplication(arr) {
    for(let i=0;i<arr.length;i++){
        for(let j=i+1;j<arr.length;j++){
            if(arr[i]==arr[j]){
                arr.splice(j,1)
                j--
            }
        }
    }
    return arr
}

//正常数组,没啥问题
let arr1 = [1,2,3,4,2,2,3,4,3,2,3,4]
console.log(deduplication(arr1))
//[1, 2, 3, 4]

// 包含其他基本数据类型的数组
let arr2 = [0,1,3,'0','1','3',null,null,undefined,undefined,true,true,'true',false,false,'false',NaN,NaN]
console.log(deduplication(arr2))
//[0, 1, 3, null, 'true', 'false', NaN, NaN]
//因为用到 == ,会发生隐式转换,所以 null == undefined ,false == 0, true == 1, 1 == '1',但是NaN是怎样都不会等于NaN。

//Object.is() 与 == 不同。== 运算符在判断相等前对两边的变量(如果它们不是同一类型)进行强制转换(这种行为将 "" == false 判断为 true),
//Object.is 不会强制转换两边的值。
function deduplication(arr) {
    for(let i=0;i<arr.length;i++){
        for(let j=i+1;j<arr.length;j++){
            if(Object.is(arr[i],arr[j])){
                arr.splice(j,1)
                j--
            }
        }
    }
    return arr
}
// 然后再试试上面的arr2
console.log(deduplication(arr2))
//[0, 1, 3, '0', '1', '3', null, undefined, true, 'true', false, 'false', NaN]

2、单循环大法+indexOf

// 思路:indexOf方法查到数组中存在该元素后会返回对应下标,找不到则返回-1。
// 循环遍历要去重的数组,定义一个新数组,若新数组中不存在遍历到的这个元素则添加进去。
function deduplication(arr){
    let newArr = []
    for(let i=0;i<arr.length;i++){
        (newArr.indexOf(arr[i])===-1)?newArr.push(arr[i]):newArr
    }
    return newArr
}

//正常数组,没啥问题
let arr1 = [1,2,3,4,2,2,3,4,3,2,3,4]
console.log(deduplication(arr1))
//[1, 2, 3, 4]

// 包含其他基本数据类型的数组,不会发生隐式转换,但是无法解决NaN
let arr2 = [0,1,3,'0','1','3',null,null,undefined,undefined,true,true,'true',false,false,'false',NaN,NaN]
console.log(deduplication(arr2))
//[0, 1, 3, '0', '1', '3', null, undefined, true, 'true', false, 'false', NaN, NaN]

 3、单循环大法(es6) filter+indexOf

// 思路:利用indexOf()找到的元素下标一定是数组中第一个出现的,而filter回调函数中的index会递增,直到循环结束。
// 所以有且只有一次会出现相等的情况。
function deduplication(arr){
    return arr.filter((current,index,arr)=>{
        return arr.indexOf(current) === index
    })
}

//正常数组,没啥问题
let arr1 = [1,2,3,4,2,2,3,4,3,2,3,4]
console.log(deduplication(arr1))
//[1, 2, 3, 4]

// 包含其他基本数据类型的数组,不会发生隐式转换,但是无法解决NaN
let arr2 = [0,1,3,'0','1','3',null,null,undefined,undefined,true,true,'true',false,false,'false',NaN,NaN]
console.log(deduplication(arr2))
//[0, 1, 3, '0', '1', '3', null, undefined, true, 'true', false, 'false']

待续......

posted @ 2022-08-09 17:23  maoweizhao  阅读(82)  评论(0)    收藏  举报