数组去重的各种方法速度对比

1treeS 发布于2019-08-23 12:00 / 2378人阅读

摘要：首先需要一个自动生成数组的函数自动生成数组的函数执行上面函数，的到的数组长度为，因为执行速度很快，只有长度很大时，才能看到各个方法的执行速度的差别注意到不能简单的用赋值，否则改变后，到也相应改变了七个相同的数组并且数组长度要足够大才能对比出

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

    // 自动生成数组的函数
    function randomArr (n) {
        let arr = [];
        for (let i = 1; i <= n; i++) {
            arr.push(Math.floor(Math.random() * (i + 1)));
        }
        return arr;
    }

执行上面函数，的到的arr1数组长度为50000，因为js执行速度很快，只有长度很大时，才能看到各个方法的执行速度的差别

注意 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)];
    }

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

最后，需要一个函数调用以上数组去重的方法，并进行时间计算

    // 计算时间
    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

小结

可以看出：

第6种和第7种方法利用es6语法去重，不仅代码简单，执行速度也快

利用对象key值的唯一性去重，执行速度也是很快的，其它方法就比较劣势了

服务器托管海外云主机各种消息队列对比数组去重各种厂家云服务器对比各种云计算数据库对比

文章版权归作者所有，未经允许请勿转载,若此文章存在违规行为，您可以联系管理员删除。

转载请注明本文地址：https://www.ucloud.cn/yun/97823.html

js基本操作-数组去重

摘要：基本操作数组去重写在前面数组去重经常出现在前端招聘的笔试题里，比如有数组，请用实现去重函数，使得返回作为笔试题，考点有二正确。基本介绍文章主要是对数组去重的常用方法进行介绍。 js基本操作-数组去重写在前面 JavaScript 数组去重经常出现在前端招聘的笔试题里，比如：有数组 var arr = [a, b, c, 1, 0, c, 1, , 1, 0]，请用 JavaScr...

blastz 2019-08-22 11:02 评论0 收藏0
JS进阶篇5---JS数组去重的n种方式

1、利用 indexOf() 方法之一 Array.prototype.unique = function(){ var temp = []; for (var i = 0;i < this.length;i++){ // 如果当前数组的第 i 项已经保存到了临时数组，那么跳过 if(temp.indexOf( this[i] ) == -1){ ...

baihe 2019-08-26 10:40 评论0 收藏0
数组去重的JavaScript实现

摘要：主要用到数组的方法。第一种方式是判断数组中的第一索引号等于参数索引号，一般来说，如果数组元素重复，除第一个元素外，所有重复元素的索引和该元素对应的第一索引是不同的。 1.最简方法创建一个空的新数组，依次检查旧数组的值是否存在于新数组中，如果不存在就push进去。主要用到数组的indexOf方法。 function arrUnique(arr){ ...

Imfan 2019-08-20 15:23 评论0 收藏0
JavaScript专题之数组去重

摘要：专题系列第三篇，讲解各种数组去重方法，并且跟着写一个前言数组去重方法老生常谈，既然是常谈，我也来谈谈。它类似于数组，但是成员的值都是唯一的，没有重复的值。 JavaScript 专题系列第三篇，讲解各种数组去重方法，并且跟着 underscore 写一个 unique API 前言数组去重方法老生常谈，既然是常谈，我也来谈谈。双层循环也许我们首先想到的是使用 indexOf 来循...

fsmStudy 2019-08-21 15:55 评论0 收藏0
javascript数组去重

摘要：数组去重双层循环使用双层嵌套循环是最原始的方法用来存储结果如果是唯一的，那么执行完循环，等于外层循环内层循环当和相等时，跳出循环。否则说明元素唯一，这时成立，将此元素添加到中。它类似于数组，但是成员的值都是唯一的，没有重复的值。 JavaScript数组去重双层循环使用双层嵌套循环是最原始的方法： var array = [a,b,a]; function unique(arra...

qylost 2019-08-26 11:51 评论0 收藏0