zoukankan      html  css  js  c++  java
  • JavaScript数组去重的7种方式

    1.利用额外数组
    function unique(array{
        if (!Array.isArray(array)) return;

        let newArray = [];
        for(let i=0, len=array.length; i<len; i++) {
            let itemAtIndex = array[i];
            if (!newArray.includes(itemAtIndex)) { // newArray.indexOf(itemAtIndex) === -1
                newArray.push(itemAtIndex);
            }
        }

        return newArray;
    }
    2.indexOf与lastIndexOf
    function unique(array{
        if (!Array.isArray(array)) return;

        for(let i=0; i<array.length; i++) {
            let itemAtIndex = array[i];
            if (array.indexOf(itemAtIndex) !== array.lastIndexOf(itemAtIndex)) {
                array.splice(i, 1);
                i--; // array 与 array.length change
            }
        }

        return array; // 顺序可能会改变
    }

    注: 利用额外数组配合indexOf与lastIndexOf 取出未重复出现的元素

    function unique(array{
        if (!Array.isArray(array)) return;

        let newArray = [];
        for(let i=0, len=array.length; i<len; i++) {
            let itemAtIndex = array[i];
            if (array.indexOf(itemAtIndex) === array.lastIndexOf(itemAtIndex)) {
                newArray.push(itemAtIndex);
            }
        }

        return newArray;
    }
    3.filter
    function unique(arr{
        return arr.filter(function(item, index, arr{
          // 取出元素, 该元素在数组中第一次出现的索引 === 当前索引值
          return arr.indexOf(item, 0) === index;
        });
    }
    4.双层for循环
    function unique(array{
        if (!Array.isArray(array)) return;

        for(var i=0; i<array.length; i++) {

            for(var j=i+1; j<array.length; j++) {
                if (array[j] === array[i]) {
                    array.splice(j, 1);
                    j--; // array 与 array.length change
                }
            }

        }

        return array;
    }
    5.利用sort排序后, 相邻元素不相等
    function unique(array{
        if(!Array.isArray(array)) return;

        array.sort();
        for (let i=0; i<array.length; i++) {
            if (i <= array.length-2) {
                if (array[i+1] === array[i]) {
                    array.splice(i+11);
                    i--; // array 与 array.length change
                }
            }
        }

        return array; // 顺序可能会改变
    }
    6.利用对象key唯一的特性(这个方法还能标记出重复元素的数量); 另, map原理与object一致
    function unique(array{
        if (!Array.isArray(array)) return;

        let obj = {};
        for(let i=0, len=array.length; i<len; i++) {
            let itemAtIndex = array[i];
            obj[itemAtIndex] = '';
        }

        let newArray = [];
        for(let key in obj) {
            newArray.push(Number(key));
        }

        return newArray; // 顺序可能会改变
    }
    7.利用ES6 set
    function unique(array{
        if (!Array.isArray(array)) return;
        return Array.from(new Set(array)); // [...new Set(array)] 
    }

    测试函数及测试用例

    function ensureEqual(a, b, message{
        if (JSON.stringify(a) !== JSON.stringify(b)) {
            console.log(`***测试失败, ${JSON.stringify(a)} 不等于 ${JSON.stringify(b)}${message}`);
        }
    };

    ensureEqual(unique([1,2,3,3,4,4,5,5,6,1,9,3,25,4]), [1,2,3,4,5,6,9,25], 'test1');

    以上就是JavaScript数组去重的较为常规的方式;其中,第3种比较不容易想到;另,由于业务中一般处理的都是相同类型的数据,因此这里数组里的数据统一为数值类型,并未做混合类型的考虑。

  • 相关阅读:
    docker 构建带健康检查的redis镜像
    HP服务器 开启ILO
    [转]如何取得当前正在执行的shell脚本的绝对路径?
    解决方案:centos运行shell脚本时报“$' ': 未找到命令”
    Js控制滚动条
    json_decode时含有中文是解码问题(json_decode返回为null)
    Phaser开源2d引擎 html5游戏框架中文简介
    js 开启video全屏模式
    修改mysql用户名密码 和 PHPmysqlAdmin对应密码修改
    用javascript判断一个html元素是否存在的五种方法:
  • 原文地址:https://www.cnblogs.com/rencoo/p/11828329.html
Copyright © 2011-2022 走看看