数组去重方法合集

1. 纯双重for循环

//1.纯双重for循环
const arr = [1, 2, 3, 4, 5, 6, 4, 3, 8, 1]
let newArr = []
for (let i = 0; i < arr.length; i++) {
    // 设置一个开关，如果是true，就存进去，不是就不存
    let flag = true
    for (let j = 0; j < newArr.length; j++) {
        // 原数组和新数组作比较，如果一致，开关变为 false
        arr[i] === newArr[j] ? (flag = false) : flag
    }
    flag ? newArr.push(arr[i]) : newArr
}
console.log(newArr) //[1, 2, 3, 4]

2. for + splice()

原理：利用 splice 进行切割

const arr = [1, 2, 3, 3, 4, 2]
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--
        }
    }
}
console.log(arr) //[1, 2, 3, 4]

3.for +findIndex

原理：根据特性找不到元素就返回-1，没找到，就像新数组中添加元素

 const arr = [1, 2, 3, 3, 4, 2]     
 function newArrFn(arr) {
     let newArr = []
     for (let i = 0; i < arr.length; i++) {
         newArr.indexOf(arr[i]) === -1 ? newArr.push(arr[i]) : newArr
     }
     return newArr
 }
 console.log(newArrFn(arr)) //[1, 2, 3, 4]

4. for+object

原理利用对象属性名不能重复的特性， 如果对象中不存在，就可以给 push 进去

const arr = [1, 2, 3, 3, 4, 2]
let newArr = []
let obj = {}
for (let i = 0; i < arr.length; i++) {
    if (!obj[arr[i]]) {
        newArr.push(arr[i])
        obj[arr[i]] = 1
    } else {
        obj[arr[i]]++
    }
}
console.log(newArr) //[1,2,3,4]

5. for+includes()

原理：检查新数组是否包含原数组的每一项。 如果不包含，就push进去

let newArr = []
for (let i = 0; i < arr.length; i++) {
newArr.includes(arr[i]) ? newArr : newArr.push(arr[i])
}
console.log(newArr) //[1,2,3,4]

6. for +sort()

原理：sort 方法进行排序。进行循环，如果原数组的第 i 项和新数组的i - 1 项不一致，就push进去

let arr = [1, 2, 3, 3, 4, 2]
 arr = arr.sort()
 let newArr = []
 for (let i = 0; i < arr.length; i++) {
     arr[i] === arr[i - 1] ? newArr : newArr.push(arr[i])
 }
 console.log(newArr) //[1,2,3,4]

7. reduce()

原理：将迭代器设置为空数组，通过includes()判断pre（上一个回调函数的返回值中）是否有该元素，有就拼接到pre中，没有就将本次pre直接返回出去

const arr = [1, 2, 3, 3, 4, 2]
const re = arr.reduce((pre, item) => {
    if (!pre.includes(item)) {
        return pre.concat(item)
    } else {
        return pre
    }
}, [])
console.log(re) //[1, 2,3,4]

8. filter + indexOf

原理：filter 过滤 配合 indexOf 查找元素

 const arr = [1, 2, 3, 3, 4, 2]
 const re = arr.filter((item, index) => {
     return arr.indexOf(item) === index
 })
 console.log(re) // [1, 2, 3, 4]

9. Set+...运算符

补充：ES6中新增了数据类型Set，Set的一个最大的特点就是数据不重复

原理：Set函数可以接受一个数组（或类数组对象）作为参数来初始化，利用该特性也能做到给数组去重。

const arr = [1, 2, 3, 3, 4, 2]
// new Set方法，返回是一个伪数组(类数组)，需要结合 ...运算符，转成真实数组
console.log([...new Set(arr)]) // [1, 2, 3, 4]

10. Set+ Array.from()

原理：同9

 const arr = [1, 2, 3, 3, 4, 2]
 console.log(Array.from(new Set(arr))) //[1,2,3,4]