JS数组去重的方法汇总

一、使用双重for循环，再利用数组的splice方法去重（ES5常用）

注：array.splice(index,howmany) 用于添加或删除数组中的元素，返回含有被删除的元素的数组。如果未删除任何元素，则返回空数组。

let arr = [1,5,6,0,7,3,0,5,9,5,5]
function unique (arr) {
  for (let i = 0, len = arr.length; i < len; i++) {
    for (let j = i + 1, len = arr.length; j < len; j++) {
      if (arr[i] === arr[j]) {
        arr.splice(j,1) // arr删除重复元素
        j-- // 每删除一个数j的值就减1
      }
    }
  }
  return arr
}
console.log(unique(arr)) // [1,5,6,0,7,3,9]

二、利用数组的indexOf方法去重

注：array.indexOf(item,statt) 返回数组中某个指定的元素的位置，没有则返回-1。

let arr = [1,-5,-4,0,-4,7,7,3]
function unique (arr) {
  let arr1 = []
  for (let i = 0, len = arr.length; i < len ; i++) {
    if (arr1.indexOf(arr[i]) === -1) {
      arr1.push(arr[i])
    }
  }
  return arr1
}
console.log(unique(arr))

三、利用数组的sort方法去重（相邻元素对比法）

注：先对arr进行sort排序，再对排序后的数组进行相邻元素比较

let arr = [5,7,1,8,1,8,3,4,9,7]
function unique (arr) {
  arr = arr.sort()
  console.log('arr', arr)
  let arr1 = [arr[0]] // 赋初始值
  for (let i = 1; i < arr.length; i++) {
    if (arr[i] !== arr[i-1]) {
      arr1.push(arr[i])
    }
  }
  return arr1
}
console.log(unique(arr))

四、利用ES6中的 Set 方法去重

let arr = [1,5,4,1,5,3,8,0]
function unique (arr) {
  return Array.from(new Set(arr)) // Array.from()方法就是将一个类数组对象或者可遍历对象转换成一个真正的数组
}
console.log(unique(arr))
或者
console.log([...new Set(arr)])

五、利用 reduce方法去重

注：array.reduce(function(accumulator, currentValue, currentIndex, array), initialValue)
initialValue：初始值（可选）
accumulator： reduce 方法多次执行的累积结果。若有提供initialValue，则第一次循环时 accumulator 的值便为 initialValue；若未提供initialValue，第一次循环时 accumulator 的值为数组第一项arr[0]。（必需）
currentValue：数组循环当前处理的值。若有提供 initialValue，第一次循环currentValue 的值为数组第一项arr[0]；若未提供initialValue，第一次循环由于arr[0]成了accumulator 的值，所以currentValue 只能从arr[1]开始。（必需）
currentIndex：数组循环当前处理值的索引。
array：当前正在被循环的数组。

let arr = [1,6,4,null,9,null,1]
var newArr = arr.reduce((prev,cur) => {
    prev.indexOf(cur)  ===  -1 && prev.push(cur);
    return prev;
}, [])
console.log(newArr)

六、利用数组的filter方法去重

// 结合indexOf方法，indexOf返回在数组中可以找到一个给定元素的第一个索引
let arr = [1,2,2,4,null,null]
let newArr = arr.filter((item,index,arr) => {
  return arr.indexOf(item) === index // 找到在arr中有的对应item，并返回
})
console.log(newArr)

七、利用数组的includes去重

注：arr.includes(指定元素(必填),指定索引值(可选,默认值为0) )，有值返回true，没有则返回false

let arr = [-1,0,8,-3,-1,5,5,7]
function unique (arr) {
  let arr1 = []
  for (let i = 0,len = arr.length; i < len; i++) {
    if (!arr1.includes(arr[i])) { // 检索arr1中是否包含arr中的值
      arr1.push(arr[i])
    }
  }
  return arr1
}
console.log(unique(arr))

八、利用ES6中的Map方法去重

/*
创建一个空Map数据结构，遍历需要去重的数组，把数组的每一个元素作为key存到Map中。由于Map中不会出现相同的key值，所以最终得到的就是去重后的结果。
*/
let arr = [1,0,8,3,-9,1,0,-9,7]
function unique (arr) {
  let map = new Map()
  console.log(map)
  let arr1 = []
  for (let i = 0, len = arr.length; i < len; i ++) {
    if (map.has(arr[i])) { // 判断map是否存在该key值
      map.set(arr[i], true)
      console.log('map1', map) // {1:true, 0: true, 8: false, 3:false, -9: true, 7:false}
    } else {
      map.set(arr[i], false)
      console.log('map2', map) // {1:false, 0: false, 8: false, 3:false, -9: false, 7:false}
      arr1.push(arr[i])
    }
  }
  return arr1
}
console.log(unique(arr))

九、利用函数递归去重

let arr = [1,1,5,6,0,9,3,0,6]
function unique (arr) {
  let arr1 = arr;
  let len = arr.length;
  arr1.sort((a,b) => {
    return a-b // 从小到大排序
  })
  function loop (index) {
    if (index >= 1) {
       if (arr1[index] === arr1[index-1]) {
          arr1.splice(index,1)
        }
        loop(index - 1)
    }
  }
  loop(len - 1) // index初始值为len-1，倒序
  return arr1
}
console.log(unique(arr))

十、利用对象的属性不能相同的特点去重（不建议用，有缺陷）

注：用数组项作为对象的属性会自动去除相同的值

let arr = [1,3,8,9,3,5,4,4,6,6,2]
function unique(arr) {
  let arr1 = []
  let obj = {}
  for (let i = 0, len = arr.length; i < len; i++) {
    if (!obj[arr[i]]) {
      arr1.push(arr[i])
      obj[arr[i]] = 1
    } else {
      obj[arr[i]]++
    }
  }
  return arr1
}
console.log(unique(arr))