面试常考题,JS数组的去重问题

本文只会讲解去重的思路,而具体的循环方式、相近的函数方法每个人都可以有不同的选择

如果你对数组遍历方式还不太熟悉,可以参考我的另一篇文章:《JS数组遍历的方式总结》

1.利用Set数据格式不允许元素重复的特性

我个人认为这种方式目前最为简洁

let arr = [0, 0, 1, 10, 12, '12', 15]
let uniArr = [...new Set(arr)]
console.log(uniArr) //[0, 1, 10 ,12, '12', 15]

2.检测数组中是否存在某个元素的方式,例如indexOf()、lastIndexOf()、includes()

这种去重的主要思路就是新建一个数组,如果这个新数组没有此元素就添加进去,否则就不添加,此处只演示了indexOf()的方式

let arr = [0, 0, 1, 10, 12, '12', 15]
function uniArr(arr) {
  let newArr = []
  for(let item of arr) {
    if(newArr.indexOf(item) === -1) {
      newArr.push(item)
    }
  }
  return newArr
}
console.log(uniArr(arr)) //[0, 1, 10 ,12, '12', 15]

3.让数组中的每一个元素和其他元素相比较,如果相同则删除重复的元素

let arr = [0, 0, 1, 10, 12, '12', 15]
function uniArr(arr) {
  let ar = [...arr]
  for(let i = 0, len = ar.length; i < len; i++) {
    for(let j = i + 1; j < len; j++) {
      if(ar[i] === ar[j]) {
        ar.splice(j, 1)
      }
    }
  }
  return ar
}
console.log(uniArr(arr))

4.先使用sort()排序,然后前后相邻的元素进行比较,如果不同,则添加前元素

let arr = [10, 0, 1, 0, 12, '12', 15]
function uniArr(arr) {
  let ar = arr.sort()
  let newArr = []
  for(let i = 0, len = ar.length; i < len; i++) {
    if(ar[i] !== ar[i+1]) {
      newArr.push(ar[i])
    } 
  }
  return newArr
}
console.log(uniArr(arr))

5.利用indexOf()、lastIndexOf()本身的特性:只会返回找到的第一个元素的下标

此处使用了lastIndexOf()举例

let arr = [0, 0, 1, 10, 12, '12', 15]
function uniArr(arr) {
  return arr.filter((item, index) => {
    return arr.lastIndexOf(item) === index
  })
}
console.log(uniArr(arr))

6.使用reduce()函数

要使用这种方式去重必须先了解这个方法

array.reduce(function(total, currentValue, currentIndex, arr), initialValue)

arr 表示原数组;
total 表示上一次调用回调时的返回值,或者初始值 initialValue;
currentValue 表示当前正在处理的数组元素;
currentIndex 表示当前正在处理的数组元素的索引,若提供 initialValue 值,则索引为0,否则索引为1;
initialValue 表示初始值

let arr = [0, 0, 1, 10, 12, '12', 15]
function uniArr(arr) {
  let newArr = arr.reduce((pre, cur, index) => {
    if(!pre.includes(cur)) {
      pre.push(cur)
    }
    return pre
  }, [])
  return newArr
}
console.log(uniArr(arr))

不过此方式本质上还是使用了方法2,只不过使用了reduce的循环方式来实现

评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

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

抵扣说明:

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

余额充值