关于数组去重的10种方法

1、Set()+Array.from()

这种方法对NaN去重是有效的,NaN之间被视为相同的值(尽管在js中 NaN !== NaN),无法对{}进行去重

let arr = [2, 3, NaN, 'ab', NaN, false, true, undefined]
let res = Array.from(new Set(arr))  // 去重后将类数组转化为数组
console.log(res)  // [2, 3, NaN, 'ab', false, true, undefined]

2、利用两层循环+数组的splice方法

此方法无法对NaN进行去重,因为比较时 NaN !== NaN,无法对{}进行去重

function removeDuplicate(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)
        len--
        j--
      }
    }
  }
  
  return arr
}

let arr = [2, 3, NaN, 'ab', NaN, false, true, undefined]
let res = removeDuplicate(arr)
console.log(res)   // [2, 3, NaN, 'ab', NaN, false, true, undefined]

3、利用indexOf方法

此方法无法对NaN去重,因为indexOf()无法对NaN进行判断(arr.indexOf(NaN) 结果为-1),无法对{}进行去重

function removeDuplicate(arr) {
  let newArr = []
  
  arr.forEach(item => {   // 遍历每一个元素
    if (newArr.indexOf(item) === -1) {
      newArr.push(item)
    }
  })
  
  return newArr
}

let arr = [2, 3, NaN, 'ab', NaN, false, true, undefined, 2, {}, {}, false, 'ab']
let res = removeDuplicate(arr)
console.log(res)  // [2, 3, NaN, 'ab', NaN, false, true, undefined, {…}, {…}]

4、利用filter()+indexOf()

输出结果中不包含NaN,原因参考上方例子,无法对{}进行去重

function removeDuplicate(arr) {
  return arr.filter((item, index) => {
    return arr.indexOf(item) === index    // 判断该元素下标是否和首次出现的元素下标相同
  })
}
let arr = [2, 3, NaN, 'ab', NaN, false, true, undefined, 2, {}, {}, false, 'ab']
let res = removeDuplicate(arr)
console.log(res)  // [2, 3, 'ab', false, true, undefined, {…}, {…}]

5、利用includes方法

此方法无法对{}进行去重

function removeDuplicate(arr) {
  let newArr = []
  
  arr.forEach(item => {
    if (!newArr.includes(item)) {
      newArr.push(item)
    }
  })
  
  return newArr
}

let arr = [2, 3, NaN, 'ab', NaN, false, true, undefined, 2, {}, {}, false, 'ab']
let res = removeDuplicate(arr)
console.log(res) // [2, 3, NaN, 'ab', false, true, undefined, {…}, {…}]

6、利用Map()

此方法可以对NaN进行去重,NaN之间被视为相同的值,但是无法对{}进行去重

function removeDuplicate(arr) {
  let map = new Map()
  let newArr = []
  
  arr.forEach(item => {
    if (!map.has(item)) {
      map.set(item, true)  // 将首次出现的元素添加到map中
      newArr.push(item)
    }
  })
  
  return newArr
}

let arr = [2, 3, NaN, 'ab', NaN, false, true, undefined, 2, {}, {}, false, 'ab']
let res = removeDuplicate(arr)
console.log(res) // [2, 3, NaN, 'ab', false, true, undefined, {…}, {…}]

7、利用对象

此方法利用了对象属性名不可重复这一特性

function removeDuplicate(arr) {
  let obj = {}
  let newArr = []
  
  arr.forEach(item => {
    if (!obj[item]) {
      newArr.push(item)
      obj[item] = true
    }
  })
  
  return newArr
}

let arr = [2, 3, NaN, 'ab', NaN, false, true, undefined, 2, {}, {}, false, 'ab']
let res = removeDuplicate(arr)
console.log(res) // [2, 3, NaN, 'ab', false, true, undefined, {…}]

8、利用递归

此方法无法对 NaN 和 {} 进行去重

function removeDuplicate(arr) {
  let newArr = arr
  let len = newArr.length

  newArr.sort()  // 排序后方便去重

  function loop(index) {
    if (index >= 1) {
      if (newArr[index] === newArr[index - 1]) {
        newArr.splice(index, 1)
      }
      loop(index - 1)
    }
  }
  loop(len - 1)

  return newArr
}

let arr = [2, 3, NaN, 'ab', NaN, false, true, undefined, 2, {}, {}, false, 'ab']
let res = removeDuplicate(arr)
console.log(res) // [2, 3, NaN, NaN, {…}, {…}, 'ab', false, true, undefined]

9、利用sort()

此方法无法对 NaN 和 {} 进行去重

function removeDuplicate(arr) {
  arr = arr.sort()
  let newArr = [arr[0]]

  for(let i = 1; i < arr.length; i++) {
    if (arr[i] !== arr[i - 1]) {
      newArr.push(arr[i])
    }
  }
  
  return newArr
}

let arr = [2, 3, NaN, 'ab', NaN, false, true, undefined, 2, {}, {}, false, 'ab']
let res = removeDuplicate(arr)
console.log(res) // [2, 3, NaN, NaN, {…}, {…}, 'ab', false, true, undefined]

10、利用reduce

此方法无法对 {} 进行去重

function removeDuplicate (arr) {
  let newArr = []
    return  arr.reduce((prev, next) => {
      return newArr.includes(next) ? newArr :  newArr.push(next)
    }, 0)
}

let arr = [2, 3, NaN, 'ab', NaN, false, true, undefined, 2, {}, {}, false, 'ab']
let res = removeDuplicate(arr)
console.log(res) // [2, 3, NaN, 'ab', false, true, undefined, {…}, {…}]
评论 1
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值