数组去重的方法

数组去重也算是前端面试过程中的一个热点问题了,也是我最近面试过程中被问到好多次并要求手写代码的经历,所以总结了几种方法浅看一下。

set方法去重

我们知道ES6提供的set结果是不重复的数据集，因此能够实现去重

    let arr = [0, 1, 2, 3, 2, 2, 3, 4, 1, 4, 7]
    function unique(arr) {
      let newArr = Array.from(new Set(arr))
      return newArr
    }
    let newArr = unique(arr)
    console.log('newArr', newArr);//newArr (6) [0, 1, 2, 3, 4, 7]

`Array.from(new Set(arr))`还有一种更简洁的方法写,用...展开运算符:写为`[...new Set(arr)]`

使用indexOf结合for循环

使用indexOf加for循环数组的每一项,我们知道数组的indexOf()方法可返回数组的某个元素在数组中首次出现的位置。该方法需要先定义一个新的空数组newArr，然后调用indexOf方法对原来的数组进行遍历判断，如果元素不在newArr中，则将其push进newArr中，最后返回获得去重的数组newArr

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

使用includes方法结合for循环

使用includes方法和indexOf方法非常类似,数组的includes方法是去判断该数组是否包含某元素,如果包含返回true,不包含返回false

      function unique(arr) {
           let res = []
           for (let i = 0; i < arr.length; i++) {
               if (!res.includes(arr[i])) {
                   res.push(arr[i])
               }
           }
           return res
       }

使用filter方法

使用filter结合indexOf方法,filter方法我们知道是用来过滤数组的,利用indexOf判断数组的每个元素会得到该元素在数组中的index,如果有重复元素,则他只会返回第一次所在的index,从而我们判断利用indexOf得到的index,与filter循环数组的index是否相等,就可以得到没有重复元素的新数组

    function unique(arr) {
        let res = arr.filter((item, index) => {
            return arr.indexOf(item) === index
        })
        return res
    }

使用数组的sort方法结合for循环

首先定义一个空数组res,可以使用sort方法对数组进行一个排序,之后进行for循环比较相邻两个元素的值,如果值一样,就将它push到我们定义的res里,就会得到去重后的数组

        function unique(arr) {
            let res = []
            let temp = arr.sort()
            for (let i = 0; i < temp.length; i++) {
                if (temp[i] !== temp[i + 1]) {
                    res.push(temp[i])
                }
            }
            return res
        }

利用数组方法reduce去重

reduce方法接收两个参数,第一个参数为一个回调函数,第二个参数为一个可选参数(可设置的初始值)

       function unique(arr) {
            let obj = {}
            let res = arr.reduce((sum, item) => {
                obj[item] ? '': obj[item] = true && sum.push(item)
                return sum
            }, [])
            return res
        }
        

利用对象的key值唯一

    // 利用对象的key值唯一
        function unique(arr) {
             let res = {}
             arr.forEach((item, index) => {
                 res[arr[index]] = 'sss'
             })
             return Object.keys(res).map(item =>
                 parseInt(item) // 因为如果原数组是数字,会返回字符串型的,需要转一下
             )
        }
        

接下来就是最最最容易面试的时候让你手写的双重for循环

双重for循环是相对来说比较笨拙的方法，它实现的原理很简单

        // 双重for循环
        function unique(arr) {
            let res = []
            let flag = false
            for (let i = 0; i < arr.length; i++) {
                flag = false
                for (let j = i + 1; j < arr.length; j++) {
                    if (arr[i] === arr[j]) {
                        flag = true
                    }
                }
                if (!flag) {
                    res.push(arr[i])
                }
            }
            return res
        }