zoukankan      html  css  js  c++  java
  • javascript数组去重方法汇总

     前言


     数组去重已经是一个老生常谈的问题了,依然经久不息,经过岁月的变迁es标准的升级迭代,似乎有越来越多的方法和方式供我们使用,那么那种方式才是最优的?那种才是最简洁的?这个我们一起来探讨。

    省略:传统的递归方法,这里我就不说了,是最传统也是最笨的方法。

    方法一:es5使用filter


    使用Array.prototype.filter()方法,对元素进行过滤;

    相关资料:Array.prototype.filter()

    var array = [2, "2", 2, "2"];
    // es5 使用filter
    function unique(array) {
        var obj = {};
        return array.filter(function (item, index) {
            var fullItem = (typeof item + item);
            return obj.hasOwnProperty(fullItem) ? false : (obj[fullItem] = true);
        });
    }
    console.log(unique(array)); //[2,"2"]

    方法二:使用es6 Set


    Set里的元素只能出现一次,即元素是唯一的。

    下面的代码中也使用了(...)扩展语句,简单来说就是把数组转换成n个对象的方法。

    相关链接:Set

    var array = [2, "2", 2, "2"];
    //es6 使用Set特性(Set元素只会出现一次,即元素是唯一的)
    let unique = (array) => [...new Set(array)]; //(...)扩展语句,简单来说就是把数组参数转换为多个对象参数
    console.log(unique(array)); //[2,"2"]

    方法三:使用es6 Map


    Map也是es6新出的数据类型,方法set、has、get、clear、delete、keys都挺好用的。

    相关链接:Map

    var array = [2, "2", 2, "2"];
    //es6 Map 本质使用的还是Array.prototype.filter()
    function unique(array) {
    let m = new Map();
    return array.filter((item) => !m.has(item) && m.set(item, 1));
    }
    console.log(unique(array));

    总结


    个人觉得最优的方案是第二种!欢迎补充,欢迎指正~

  • 相关阅读:
    js数字格式化(加千分位逗号)
    [css]解决iframe在ios设备上无法滚动
    判断当前是否在微信浏览器环境
    TortoiseGit 提交代码每次需要输入用户名和密码?
    如何编写jQuery插件
    函数作用域
    HTTP动词
    如何减少全局变量污染?
    mysql表大字段最大长度限制设置
    update left join 多表关联更新
  • 原文地址:https://www.cnblogs.com/vipstone/p/8336229.html
Copyright © 2011-2022 走看看