JS数组去重

ymyang 发布于2019-08-20 18:53 / 3331人阅读

摘要：这种方式比使用的一般姿势要快，比使用表的最快姿势要慢，但是占用内存要少主要内容来自数组去重的正确编写姿势

不卖关子，直入主题

数组去重，最先想到的便是依次遍历数组，在已遍历的元素中查找是否存在当前数组元素，重点是用什么存放已遍历的数组，以及如何区分当前元素是否已存在

由于下面会用到indexOf()的方法，它是ES5语法，低版本会存在兼容，先应添加对应的polyfill

Array.prototype.indexOf = Array.prototype.indexOf || function (searchElement, fromIndex) {
    var index = -1;
    fromIndex = fromIndex * 1 || 0;
    for (var k = 0, length = this.length; k < length; k++) {
        if (k >= fromIndex && this[k] === searchElement) {
            index = k;
            break;
        }
    }
    return index;
};

1.数组存放，indexOf()判断

遍历数组，建立新数组，利用indexOf判断是否存在于新数组中，不存在则push到新数组，最后返回新数组

Array.prototype.unique = function() {
    var n = []; // 存放已遍历的满足条件的元素
    for (var i = 0; i < this.length; i++) {
        // indexOf()判断当前元素是否已存在
        if (n.indexOf(this[i]) == -1) n.push(this[i]);
    }
    return n;
}

下面是一个思想基本相同的变相版本

Array.prototype.unique = function() {
    // 创建一个新的临时数组，并且把当前数组的第一元素存入到数组中
    var n = [this[0]]; 
    // 从第二项开始遍历
    for (var i = 1; i < this.length; i++) 
    {
        // 如果当前数组的第i项在当前数组中第一次出现的位置不是i，那么表示第i项是重复的，忽略掉，否则存入结果数组
        if (this.indexOf(this[i]) == i) n.push(this[i]);
    }
    return n;
}

JS引擎在实现indexOf()的时候会遍历数组直到找到目标为止，此函数会浪费掉很多时间。所有这两种方式都不是最优的解决方式

// es5简化版
Array.prototype.unique = function() {
    return this.filter((v, i) => this.indexOf(v) === i)
}
// es6简化版
Array.prototype.unique = function() {
    return Array.from(new Set(this));
}
// 或
Array.prototype.unique = function() {
    return [...new Set(this)];
}

2.对象存放，哈希算法(映射)判断

Array.prototype.unique = function() {
    // n为hash表，r为临时数组
    var n = {}, r = [];
    for (var i = 0; i < this.length; i++) {
        // 如果hash表中没有当前项
        if (!n[this[i]]) {
            // 存入hash表
            n[this[i]] = true;
            // 把当前数组的当前项push到临时数组里面
            r.push(this[i]); 
        }
    }
    return r;
}

但从耗时的角度来讲，这是最优的一种解决方式。但是从内存占用角度来说，这并不是最优的，因为多了一个hash表。这就是所谓的空间换时间

3.先排序，后比较

这种方式最大的优势就是排序后的比较次数变少，但是排序的过程也有性能消耗，应权衡使用

Array.prototype.unique = function() {
    this.sort();
    var re = [this[0]];
    for (var i = 1; i < this.length; i++) {
        if (this[i] !== re[re.length - 1]) {
            re.push(this[i]);
        }
    }
    return re;
}

这个方法的思路是先把数组排序，然后比较相邻的两个值。排序的时候用的JS原生的sort()方法，JS引擎内部应该是用的快速排序吧。这种方式比使用indexOf()的一般姿势要快，比使用hash表的最快姿势要慢，但是占用内存要少

主要内容来自：数组去重的正确编写姿势

GPU云服务器云服务器数组去重数组去重二维数组去重 php数组去重

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

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

JS数组去重总结

摘要：数组去重，一般会在面试的时候才会碰到，要求手写数组去重方法的代码。在实际项目中碰到的数组去重，一般都是后台去处理，很少让前端处理数组去重。数组去重的方法一利用去重中最常用如果不考虑兼容性，这种去重的方法代码最少。数组去重，一般会在面试的时候才会碰到，要求手写数组去重方法的代码。如果是被提问到，数组去重的方法有哪些？你能答出其中的10种，面试官很有可能对你刮目相看。在实际项目中碰到的...

whinc 2019-08-02 16:09 评论0 收藏0
JS数组去重方法小结

摘要：数组去重看了网上很多数组去重方法，用的比较常见的大概就几种，今天想自己来做一个总结。还有就是方法返回的数组也是排序后的数组，某些情况下可能不符合要求。 JS数组去重看了网上很多数组去重方法，用的比较常见的大概就几种，今天想自己来做一个总结。部分内容参考该博客 1 . 在原数组上操作（基本方法）思路：利用循环嵌套，判断数组中每个元素与其后面的元素是否相等，如果相等，就使用spli...

PascalXie 2019-08-22 15:42 评论0 收藏0
js基本操作-数组去重

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

blastz 2019-08-22 11:02 评论0 收藏0
js基本操作-数组去重

摘要：基本操作数组去重数组去重的方法临时数组保存其实这里面还没考虑到数组里面嵌套数组对象的情况把去重后的结果放在一个临时数组中对原来数组的元素与临时数组元素比较临时数组中不存在这个元素的放入临时数组。 js基本操作-数组去重数组去重的方法 1. 临时数组保存(其实这里面还没考虑到数组里面嵌套数组/对象的情况) 把去重后的结果放在一个临时数组中, 对原来数组的元素与临时数组元素比较, 临时...

GeekGhc 2019-08-20 14:43 评论0 收藏0
js数组去重方法总结

摘要：注方法可以返回某个指定字符串在字符串中首次出现的位置比如首次出现的位置是数组中的第一个，即下标为遍历数组使用标识符去重声明一个变量标识排序后遍历过滤数组思路先给数组排序，这样相同的项总是相邻。假设我们有数组arr，并且声明新数组hash用来存放去重后的元素： var arr = [23,44,5,2,23,5,1,7,8,7]; //包含重复元素 var hash= [];...

snowLu 2019-08-23 14:55 评论0 收藏0