码迷,mamicode.com
首页 > 编程语言 > 详细

JavaScript数组去重的7种方式

时间:2019-11-09 23:33:49      阅读:91      评论:0      收藏:0      [点我收藏+]

标签:ali   索引   color   UNC   lang   ant   原理   tput   display   

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种比较不容易想到;另,由于业务中一般处理的都是相同类型的数据,因此这里数组里的数据统一为数值类型,并未做混合类型的考虑。

JavaScript数组去重的7种方式

标签:ali   索引   color   UNC   lang   ant   原理   tput   display   

原文地址:https://www.cnblogs.com/rencoo/p/11828329.html

(0)
(0)
   
举报
评论 一句话评论(0
登录后才能评论!
© 2014 mamicode.com 版权所有  联系我们:gaon5@hotmail.com
迷上了代码!