从 JS 数组中删除重复值

2022-08-29 21:54:21

我有一个非常简单的JavaScript数组,可能包含也可能不包含重复项。

var names = ["Mike","Matt","Nancy","Adam","Jenny","Nancy","Carl"];

我需要删除重复项并将唯一值放在新数组中。

我可以指出我尝试过的所有代码,但我认为这是无用的,因为它们不起作用。我也接受jQuery解决方案。

类似的问题:


答案 1

TL;DR

使用 Set 构造函数和跨页语法

uniq = [...new Set(array)];

“聪明”但天真的方式

uniqueArray = a.filter(function(item, pos) {
    return a.indexOf(item) == pos;
})

基本上,我们迭代数组,并针对每个元素检查此元素在数组中的第一个位置是否等于当前位置。显然,对于重复元素,这两个位置是不同的。

使用过滤器回调的第三个(“this array”)参数,我们可以避免数组变量的闭包:

uniqueArray = a.filter(function(item, pos, self) {
    return self.indexOf(item) == pos;
})

虽然简洁,但此算法对于大型数组(二次时间)并不是特别有效。

用于救援的哈希表

function uniq(a) {
    var seen = {};
    return a.filter(function(item) {
        return seen.hasOwnProperty(item) ? false : (seen[item] = true);
    });
}

这是通常的做法。这个想法是将每个元素放在哈希表中,然后立即检查其是否存在。这给了我们线性时间,但至少有两个缺点:

  • 由于哈希键在JavaScript中只能是字符串或符号,因此此代码不区分数字和“数字字符串”。也就是说,会回来的uniq([1,"1"])[1]
  • 出于同样的原因,所有对象都将被视为相等:将仅返回 。uniq([{foo:1},{foo:2}])[{foo:1}]

也就是说,如果你的数组只包含基元,你不关心类型(例如,它总是数字),这个解决方案是最佳的。

来自两个世界的精华

通用解决方案结合了这两种方法:它对基元使用哈希查找和对对象进行线性搜索。

function uniq(a) {
    var prims = {"boolean":{}, "number":{}, "string":{}}, objs = [];

    return a.filter(function(item) {
        var type = typeof item;
        if(type in prims)
            return prims[type].hasOwnProperty(item) ? false : (prims[type][item] = true);
        else
            return objs.indexOf(item) >= 0 ? false : objs.push(item);
    });
}

排序|优尼

另一种选择是首先对数组进行排序,然后删除与前一个元素相等的每个元素:

function uniq(a) {
    return a.sort().filter(function(item, pos, ary) {
        return !pos || item != ary[pos - 1];
    });
}

同样,这不适用于对象(因为 所有对象都等于 )。此外,我们默默地更改原始数组作为副作用 - 不好!但是,如果您的输入已经排序,这就是要走的路(只需从上面删除即可)。sortsort

独一无二...

有时,需要根据除相等性以外的某些条件来统一列表,例如,筛选出不同但共享某些属性的对象。这可以通过传递回调来优雅地完成。此“key”回调应用于每个元素,并删除具有相等“键”的元素。由于期望返回基元,哈希表在这里可以正常工作:key

function uniqBy(a, key) {
    var seen = {};
    return a.filter(function(item) {
        var k = key(item);
        return seen.hasOwnProperty(k) ? false : (seen[k] = true);
    })
}

一个特别有用的是,它将删除物理上不同的对象,但“看起来”相同:key()JSON.stringify

a = [[1,2,3], [4,5,6], [1,2,3]]
b = uniqBy(a, JSON.stringify)
console.log(b) // [[1,2,3], [4,5,6]]

如果不是基元,则必须求助于线性搜索:key

function uniqBy(a, key) {
    var index = [];
    return a.filter(function (item) {
        var k = key(item);
        return index.indexOf(k) >= 0 ? false : index.push(k);
    });
}

在 ES6 中,您可以使用 :Set

function uniqBy(a, key) {
    let seen = new Set();
    return a.filter(item => {
        let k = key(item);
        return seen.has(k) ? false : seen.add(k);
    });
}

或 :Map

function uniqBy(a, key) {
    return [
        ...new Map(
            a.map(x => [key(x), x])
        ).values()
    ]
}

它们也都适用于非原始键。

第一个还是最后一个?

按键删除对象时,您可能希望保留“相等”对象中的第一个对象或最后一个对象。

使用上面的变体保留第一个,并使用 保留最后一个:SetMap

function uniqByKeepFirst(a, key) {
    let seen = new Set();
    return a.filter(item => {
        let k = key(item);
        return seen.has(k) ? false : seen.add(k);
    });
}


function uniqByKeepLast(a, key) {
    return [
        ...new Map(
            a.map(x => [key(x), x])
        ).values()
    ]
}

//

data = [
    {a:1, u:1},
    {a:2, u:2},
    {a:3, u:3},
    {a:4, u:1},
    {a:5, u:2},
    {a:6, u:3},
];

console.log(uniqByKeepFirst(data, it => it.u))
console.log(uniqByKeepLast(data, it => it.u))

图书馆

下划线Lo-Dash 都提供了方法。他们的算法基本上类似于上面的第一个片段,归结为:uniq

var result = [];
a.forEach(function(item) {
     if(result.indexOf(item) < 0) {
         result.push(item);
     }
});

这是二次的,但是有很好的附加好东西,比如包装本机,按键统一的能力(用他们的话说),以及对已经排序的数组的优化。indexOfiteratee

如果你正在使用jQuery,并且无法忍受任何没有一美元的东西,它就像这样:

  $.uniqArray = function(a) {
        return $.grep(a, function(item, pos) {
            return $.inArray(item, a) === pos;
        });
  }

这又是第一个片段的变体。

性能

函数调用在JavaScript中很昂贵,因此上述解决方案虽然简洁,但并不是特别有效。为了获得最佳性能,请替换为循环并删除其他函数调用:filter

function uniq_fast(a) {
    var seen = {};
    var out = [];
    var len = a.length;
    var j = 0;
    for(var i = 0; i < len; i++) {
         var item = a[i];
         if(seen[item] !== 1) {
               seen[item] = 1;
               out[j++] = item;
         }
    }
    return out;
}

这块丑陋的代码与上面的片段#3相同,但速度快了一个数量级(截至2017年,它的速度只有原来的两倍 - JS核心人员做得很好!

function uniq(a) {
    var seen = {};
    return a.filter(function(item) {
        return seen.hasOwnProperty(item) ? false : (seen[item] = true);
    });
}

function uniq_fast(a) {
    var seen = {};
    var out = [];
    var len = a.length;
    var j = 0;
    for(var i = 0; i < len; i++) {
         var item = a[i];
         if(seen[item] !== 1) {
               seen[item] = 1;
               out[j++] = item;
         }
    }
    return out;
}

/////

var r = [0,1,2,3,4,5,6,7,8,9],
    a = [],
    LEN = 1000,
    LOOPS = 1000;

while(LEN--)
    a = a.concat(r);

var d = new Date();
for(var i = 0; i < LOOPS; i++)
    uniq(a);
document.write('<br>uniq, ms/loop: ' + (new Date() - d)/LOOPS)

var d = new Date();
for(var i = 0; i < LOOPS; i++)
    uniq_fast(a);
document.write('<br>uniq_fast, ms/loop: ' + (new Date() - d)/LOOPS)

断续器

ES6 提供了 Set 对象,这使得事情变得容易得多:

function uniq(a) {
   return Array.from(new Set(a));
}

let uniq = a => [...new Set(a)];

请注意,与python不同,ES6集是按插入顺序迭代的,因此此代码保留了原始数组的顺序。

但是,如果您需要一个具有唯一元素的数组,为什么不从一开始就使用集合呢?

发电机

基于生成器的“懒惰”版本可以在相同的基础上构建:uniq

  • 从参数中获取下一个值
  • 如果已经看到它,请跳过它
  • 否则,请生成它并将其添加到已看到的值集中

function* uniqIter(a) {
    let seen = new Set();

    for (let x of a) {
        if (!seen.has(x)) {
            seen.add(x);
            yield x;
        }
    }
}

// example:

function* randomsBelow(limit) {
    while (1)
        yield Math.floor(Math.random() * limit);
}

// note that randomsBelow is endless

count = 20;
limit = 30;

for (let r of uniqIter(randomsBelow(limit))) {
    console.log(r);
    if (--count === 0)
        break
}

// exercise for the reader: what happens if we set `limit` less than `count` and why

答案 2

使用jQuery快速而肮脏:

var names = ["Mike","Matt","Nancy","Adam","Jenny","Nancy","Carl"];
var uniqueNames = [];
$.each(names, function(i, el){
    if($.inArray(el, uniqueNames) === -1) uniqueNames.push(el);
});