3

首先需要一个自动生成数组的函数

    // 自动生成数组的函数
    function randomArr (n) {
        let arr = [];
        for (let i = 1; i <= n; i++) {
            arr.push(Math.floor(Math.random() * (i + 1)));
        }
        return arr;
    }
  1. 执行上面函数,的到的arr1数组长度为50000,因为js执行速度很快,只有长度很大时,才能看到各个方法的执行速度的差别
  2. 注意 arr2到arr7不能简单的用赋值,否则arr1改变后,arr2到arr7也相应改变了
    // 七个相同的数组 并且数组长度要足够大才能对比出来
    var n = 50000;
    var arr1 = randomArray(n);
    var arr2 = [...arr1];
    var arr3 = [...arr1];
    var arr4 = [...arr1];
    var arr5 = [...arr1];
    var arr6 = [...arr1];
    var arr7 = [...arr1];

接下来是数组去重的各种方式

    /**
     * 数组去重方法1: 有相同就跳过
     */
    function unique (arr) {
        var len = arr.length;
        var newArr = [];
        for (var i = 0; i < len; i++) {
            for (var j = i + 1; j < len; j++) {
                if (arr[i] === arr[j]) {
                    j = ++i;
                }
            }
            newArr.push(arr[i]);
        }
        return newArr;
    }

    /**
     * 数组去重方法2:有相同就删除后面的
     */
    function unique2 (arr) {
        var len = arr.length;
        for (var i = 0; i < len; i++) {
            for (var j = i + 1; j < len; j++) {
                if (arr[i] === arr[j]) {
                    arr.splice(j, 1);
                    j--;
                    len--;
                }
            }
        }
        return arr;
    }

    /**
     * 数组去重方法3:利用对象属性不能相同去重
     */
    function unique3 (arr) {
        var obj = {}, newArr = [];
        for (var i = 0; i < arr.length; i++) {
            if (!obj[arr[i]]) {
                obj[arr[i]] = 1;
                newArr.push(arr[i]);
            }
        }
        return newArr;
    }

    /**
     * 数组去重方法4:数组递归去重
     */
    function unique4 (arr) {
        arr.sort();
        var len = arr.length;
        for (var i = 0; i < len - 1; i++) {
            if (arr[i] === arr[i + 1]) {
                arr.splice(i + 1, 1);
                i--;
                len--;
            }
        }
        return arr;
    }

    /**
     * 数组去重方法5:indexOf/forEach/map/filter
     */
    function unique5 (arr) {
        var newArr = [];
        arr.forEach(function(item, index, arr){
            // if(newArr.indexOf(item)===-1){
            //     newArr.push(item);
            // }
            if (arr.indexOf(item, index + 1) === -1) {
                newArr.push(item);
            }
        });
        return newArr;
    }

    /**
     * 数组去重方法6:es6 new Set()
     */
    function unique6 (arr) {
        // return [...new Set(arr)];
        return Array.from(new Set(arr));
    }

    /**
     * 数组去重方法7:es6 [...]
     */
    function unique7 (arr) {
        return [...new Set(arr)];
    }

计算各个方法所花费的时间

  1. 最后,需要一个函数调用以上数组去重的方法,并进行时间计算
    // 计算时间
    function calcRunTime (func, arr) {
        console.time('testForEach');
        var array = func(arr);
        console.timeEnd('testForEach');
        console.log(array);
    }
    
    // 开始计算
    calcRunTime(unique,arr1);
    calcRunTime(unique2,arr2);
    calcRunTime(unique3,arr3);
    calcRunTime(unique4,arr4);
    calcRunTime(unique5,arr5);
    calcRunTime(unique6,arr6);
    calcRunTime(unique7,arr7);

计算结果来了

unique: 2921.845947265625ms
unique2: 3580.632080078125ms
unique3: 12.416259765625ms
unique4: 617.23779296875ms
unique5: 2497.0478515625ms
unique6: 20.821044921875ms
unique7: 12.881103515625ms

小结

可以看出:

  1. 第6种和第7种方法利用es6语法去重,不仅代码简单,执行速度也快
  2. 利用对象key值的唯一性去重,执行速度也是很快的,其它方法就比较劣势了

lihaixing
463 声望719 粉丝

前端就爱瞎折腾