资讯专栏INFORMATION COLUMN

上云采购季！| 爆款云服务器低至4.6元/月，首单享0.9折

免费试用
首页/文章专栏/JavaScript数组去重

JavaScript数组去重

邹强 / 2350人阅读

摘要：数组去重的几种方法遍历数组法这是最简单的数组去重方法，实现思路新建一新数组，传入要去重的数组，遍历该数组，若值不在新数组中则加入该数组需要注意点判断值是否在数组的方法是方法，以下不支持，示例如下对象键值对法思路新建一对象以及数组，遍历传入

数组去重的几种方法

1.遍历数组法

这是最简单的数组去重方法，实现思路：新建一新数组，传入要去重的数组，遍历该数组，若值不在新数组中则加入该数组；需要注意点：判断值是否在数组的方法“indexOf”是ECMAScript5 方法，IE8以下不支持，示例如下：

function removeDup(arr) {
    let new_arr = [];
    arr.forEach((val) => {
        if(new_arr.indexOf(val) === -1){
            new_arr.push(val);
        }
    });
    return new_arr;
}

2.对象键值对法

思路：新建一对象以及数组，遍历传入的数组，判断值是否为js对象的键，若不是则新增键值，并放入数组中；需要注意的地方：判断是否为js对象键时，会自动对传入的键toString();

    function removeDup2(arr) {
        let obj = {},
            new_arr = [],
            val,
            type;
        for(let i = 0, len = arr.length; i < len; i+=1) {
            val = arr[i];
            type = typeof val;
            if(!obj[val]) {
                obj[val] = [type];
                new_arr.push(val);
            }else if(obj[val].indexOf(type) === -1) {
                obj[val].push(type);
                new_arr.push(val);
            }
        }
        return new_arr;
    }
缺点：无法真正区分两个对象，如：`{a:1}`和`{a: 2}`，因为typeof结果都是`"object"`,可用`JSON.stringify()`来解决；
es6优化后如下

    function unique(array) {
        let obj = {};
        let type;
        return array.filter((item, index, array) => {
            type = typeof item + JSON.stringify(item);
            return obj.hasOwnProperty(type) ? false : (obj[type] = item);
        } )
    }
    // 可去除undefined, NaN, Object重复项

3.排序后相邻去除法

思路：首先将要去重的数组使用sort方法排序后，相同的值就会排在一起，然后就可以只判断当前元素与上一个元素是否相同，若不同则添加进去；

    function unique(array) {
        let res = [];
        let sortedArray = array.slice(0).sort();//先排序
        let seen;//记录上一个元素
        for(let i = 0, len = sortedArray.length; i < len; i++) {
            let current = sortedArray[i];
            if(!i || seen !== current) {
                res.push(current);
            }
            seen = current;
        }
        return res;
    }

优化：可传入一个isSorted参数，表明该数组是否已排序，如果为true，那么就判断相邻元素是否相同；如果为false，则使用indexOf判断：

    function unique(array, isSorted) {
        let res = [];
        let seen;//记录上一个元素
        for(let i = 0, len = array.length; i < len; i++) {
            let current = array[i];
            if(isSorted) {
                if(!i || seen !== current) {
                    res.push(current);
                }
                seen = current;
            }else if(res.indexOf(current) === -1) {
                res.push(current);
            }
        }
        return res;
    }

再优化：想象一个场景，你需要对数组的每一项进行一些处理，但又不想再遍历一次，那么可添加第三个参数itreatee，接受一个函数作为处理函数；

    function unique(array, isSorted, iteratee) {
        let res  = [];
        let seen = [];
        for(let i = 0, len = array.length; i < len; i++) {
            let value = array[i];
            let computed = iteratee ? iteratee(value, i, array) : value;
            if(isSorted) {
                if(!i || seen !== computed) {
                    res.push(value);
                }
                seen = computed;
            }else if(iteratee) {
                if(seen.indexOf(computed) === -1) {
                    res.push(value);
                    seen.push(computed);
                }
            }else if(res.indexOf(value) === -1) {
                res.push(value);
            }
        }
        return res;
    }

4.ES6，Set和Map去重

    function unique(array) {
        return Array.from(new Set(array));
    }

    //扩展运算符简化
    let unique = (arr) => [...new Set(arr)];

    //使用Map
    function unique(array) {
        let seen = new Map();
        return arr.filter((a) => !seen.has(a) && seen.set(a, 1));
    }
私有云 云服务器 数组 去重 数组去重 二维数组去重 php数组去重

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

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

相关文章

  • JS专题之数组去重

    摘要：将元素作为对象的键，默认键对应的值为如果对象中没有这个键，则将这个元素放入结果数组中去。 前言 数组去重在日常开发中的使用频率还是较高的，也是网上随便一抓一大把的话题，所以，我写这篇文章目的在于归纳和总结，既然很多人都在提的数组去重，自己到底了解多少呢。又或者是如果自己在开发中遇到了去重的需求，自己能想到更好的解决方案吗。 这次我们来理一理怎么做数组去重才能做得最合适，既要考虑兼容性，...

    only_do 评论0 收藏0

  • JavaScript专题之数组去重

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

    fsmStudy 评论0 收藏0

  • JavaScript数组去重（12种方法，史上最全）

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

    rozbo 评论0 收藏0

  • 也谈面试必备问题之 JavaScript 数组去重

    摘要：而数组元素去重是基于运算符的。而如果有迭代函数，则计算传入迭代函数后的值，对值去重，调用方法，而该方法的核心就是调用方法，和我们上面说的方法一异曲同工。 Why underscore （觉得这部分眼熟的可以直接跳到下一段了...） 最近开始看 underscore.js 源码，并将 underscore.js 源码解读 放在了我的 2016 计划中。 阅读一些著名框架类库的源码，就好像...

    Coly 评论0 收藏0

  • javascript数组去重

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

    qylost 评论0 收藏0

  • <javaScript> 数组去重的方法总结(2017年)

    摘要：现在要求去重下面这个数组测试重复重复方法一测试重复重复去重后测试重复是新加的集合集合中的值不会重复。欢迎大家一起讨论提出新的去重方法。有任何错误请在评论指出。 现在要求去重下面这个数组 [1, 2, 3, 3, 3, 0, 1, 2, 测试, 重复, 重复, NaN, NaN, false, false]; 方法一：ES6 Set() let arr = [1, 2, 3, 3, 3,...

    hightopo 评论0 收藏0

发表评论

登陆后可评论

0条评论

邹强

男|高级讲师
我要私信

TA的文章

阅读更多
最新活动
阅读需要支付1元查看
<