获取 JavaScript 数组中的所有唯一值（删除重复项）

Question

我有一组数字，需要确保它们是唯一的。我在互联网上找到了下面的代码片段，它工作得很好，直到数组中有零。我在 Stack Overflow 上发现了这个其他脚本，它看起来几乎与它一模一样，但它并没有失败。

那么为了帮助我学习，有人可以帮助我确定原型脚本出了问题吗？

Array.prototype.getUnique = function() {
 var o = {}, a = [], i, e;
 for (i = 0; e = this[i]; i++) {o[e] = 1};
 for (e in o) {a.push (e)};
 return a;
}

Answer 1

通过 JavaScript 1.6 / ECMAScript 5，您可以使用本机 filter 数组的方法，通过以下方式获取具有唯一值的数组：

function onlyUnique(value, index, array) {
  return array.indexOf(value) === index;
}

// usage example:
var a = ['a', 1, 'a', 2, '1'];
var unique = a.filter(onlyUnique);

console.log(unique); // ['a', 1, 2, '1']

本机方法 filter 将循环遍历数组，并仅保留那些传递给定回调函数 onlyUnique 的条目。

onlyUnique 检查给定值是否是第一次出现。如果不是，则一定是重复的，不会被复制。

该解决方案无需任何额外的库（如 jQuery 或prototype.js）即可工作。

它也适用于具有混合值类型的数组。

对于不支持本机方法 filter 和 indexOf 的旧浏览器 (过滤器 和 indexOf。

如果您想保留最后一次出现的值，只需将 indexOf 替换为 lastIndexOf 即可。

使用 ES6，这可以缩短为：

// usage example:
var myArray = ['a', 1, 'a', 2, '1'];
var unique = myArray.filter((value, index, array) => array.indexOf(value) === index);

console.log(unique); // unique is ['a', 1, 2, '1']

感谢 Camilo Martin 在评论中提供提示。

ES6 有一个原生对象 Set 存储唯一值。要获取具有唯一值的数组，您现在可以执行以下操作：

var myArray = ['a', 1, 'a', 2, '1'];

let unique = [...new Set(myArray)];

console.log(unique); // unique is ['a', 1, 2, '1']

Set 的构造函数采用一个可迭代对象，例如数组，而展开运算符 ... 将集合转换回数组。感谢 Lukas Liese 在评论中提供提示。

Answer 2

更新了 ES6/ES2015 的答案：使用 设置和展开运算符 (感谢le-m），单行解决方案是

let uniqueItems = [...new Set(items)]

：

[4, 5, 6, 3, 2, 23, 1]

Answer 3

我将所有答案分为 4 个可能的解决方案：

1. 使用对象 { } 防止重复
2. 使用辅助数组 [ ]
3. 使用 filter + indexOf
4. 奖励！ ES6 设置 构造函数。

以下是答案中找到的示例代码：

使用对象 { } 防止重复

function uniqueArray1( ar ) {
  var j = {};

  ar.forEach( function(v) {
    j[v+ '::' + typeof v] = v;
  });

  return Object.keys(j).map(function(v){
    return j[v];
  });
} 

使用辅助数组 [ ]

function uniqueArray2(arr) {
    var a = [];
    for (var i=0, l=arr.length; i<l; i++)
        if (a.indexOf(arr[i]) === -1 && arr[i] !== '')
            a.push(arr[i]);
    return a;
}

使用 filter + indexOf

function uniqueArray3(a) {
  function onlyUnique(value, index, self) { 
      return self.indexOf(value) === index;
  }
  
  // usage
  var unique = a.filter( onlyUnique ); // returns ['a', 1, 2, '1']
  
  return unique;
}

使用 ES6< /strong> [...new Set(a)]

function uniqueArray4(a) {
  return [...new Set(a)];
}

我想知道哪个更快。我制作了示例 Google 表格来测试功能。注意：ECMA 6 在 Google Sheets 中不可用，因此我无法对其进行测试。

这是测试结果：

我希望看到使用对象 { } 的代码会获胜，因为它使用哈希。所以我很高兴测试显示该算法在 Chrome 和 IE 中获得了最佳结果。感谢 @rab 提供的代码。

更新 2020

Google 脚本启用了 ES6 引擎。现在我用 Set 测试了最后一个代码，它看起来比对象方法更快。

Answer 4

您还可以使用 underscore.js。

console.log(_.uniq([1, 2, 1, 3, 1, 4]));

<script src="http://underscorejs.org/underscore-min.js"></script>

这将返回：

[1, 2, 3, 4]

Answer 5

One Liner，纯 JavaScript

使用 ES6 语法

list = list.filter((x, i, a) => a.indexOf(x) == i)

x --> item in array
i --> index of item
a --> array reference, (in this case "list")

采用 ES5 语法

list = list.filter(function (x, i, a) { 
    return a.indexOf(x) == i; 
});

浏览器兼容性：IE9+

Answer 6

这里的许多答案可能对初学者没有用。如果对数组进行重复数据删除很困难，他们真的了解原型链，甚至了解 jQuery 吗？

在现代浏览器中，一个干净简单的解决方案是将数据存储在 Set，它被设计为唯一值的列表。

const cars = ['Volvo', 'Jeep', 'Volvo', 'Lincoln', 'Lincoln', 'Ford'];
const uniqueCars = Array.from(new Set(cars));
console.log(uniqueCars);

Array.from 对于将 Set 转换回数组非常有用，这样您就可以轻松访问数组具有的所有出色方法（功能）。还有其他方法可以完成同样的事情。但您可能根本不需要 Array.from，因为 Sets 有很多有用的功能，例如 forEach。

如果您需要支持旧版 Internet Explorer，因此无法使用 Set，那么一种简单的技术是将项目复制到新数组，同时事先检查它们是否已在新数组中。

// Create a list of cars, with duplicates.
var cars = ['Volvo', 'Jeep', 'Volvo', 'Lincoln', 'Lincoln', 'Ford'];
// Create a list of unique cars, to put a car in if we haven't already.
var uniqueCars = [];

// Go through each car, one at a time.
cars.forEach(function (car) {
    // The code within the following block runs only if the
    // current car does NOT exist in the uniqueCars list
    // - a.k.a. prevent duplicates
    if (uniqueCars.indexOf(car) === -1) {
        // Since we now know we haven't seen this car before,
        // copy it to the end of the uniqueCars list.
        uniqueCars.push(car);
    }
});

为了使其可以立即重用，我们将其放入一个函数中。

function deduplicate(data) {
    if (data.length > 0) {
        var result = [];

        data.forEach(function (elem) {
            if (result.indexOf(elem) === -1) {
                result.push(elem);
            }
        });

        return result;
    }
}

因此，为了消除重复项，我们现在就这样做。

var uniqueCars = deduplicate(cars);

当函数完成时，deduplicate(cars) 部分变成我们命名的结果。

只需将您喜欢的任何数组的名称传递给它即可。

Answer 7

此后我找到了一个使用 jQuery 的好方法

arr = $.grep(arr, function(v, k){
    return $.inArray(v ,arr) === k;
});

注意：此代码是从 Paul Irish 的鸭子中提取的打卡帖子 - 我忘了注明出处：P

Answer 8

神奇的

a.filter( e => !(t[e]=e in t) ) 

O(n) 性能 - 我们假设您的数组位于 a 和 t={} 中。说明此处 (+Jeppe< /a> 展示次数。）

let unique = (a,t={}) => a.filter(e=>!(t[e]=e in t));

// "stand-alone" version working with global t:
// a1.filter((t={},e=>!(t[e]=e in t)));

// Test data
let a1 = [5,6,0,4,9,2,3,5,0,3,4,1,5,4,9];
let a2 = [[2, 17], [2, 17], [2, 17], [1, 12], [5, 9], [1, 12], [6, 2], [1, 12]];
let a3 = ['Mike', 'Adam','Matt', 'Nancy', 'Adam', 'Jenny', 'Nancy', 'Carl'];

// Results
console.log(JSON.stringify( unique(a1) ))
console.log(JSON.stringify( unique(a2) ))
console.log(JSON.stringify( unique(a3) ))

Answer 9

我们可以使用 ES6 集来做到这一点：

var duplicatesArray = [1, 2, 3, 4, 5, 1, 1, 1, 2, 3, 4];
var uniqueArray = [...new Set(duplicatesArray)];

console.log(uniqueArray); // [1,2,3,4,5]

Answer 10

最简单、最快（在 Chrome 中）的方法：

Array.prototype.unique = function() {
    var a = [];
    for (var i=0, l=this.length; i<l; i++)
        if (a.indexOf(this[i]) === -1)
            a.push(this[i]);
    return a;
}

简单地遍历数组中的每个项目，进行测试如果该项目已在列表中，如果不在列表中，则推送到返回的数组。

根据 JSBench 的说法，这个函数是我能在任何地方找到的最快的函数 - 不过请随意添加您自己的函数。

非原型版本：

function uniques(arr) {
    var a = [];
    for (var i=0, l=arr.length; i<l; i++)
        if (a.indexOf(arr[i]) === -1 && arr[i] !== '')
            a.push(arr[i]);
    return a;
}

排序

当还需要对数组进行排序时，以下是最快的：

Array.prototype.sortUnique = function() {
    this.sort();
    var last_i;
    for (var i=0;i<this.length;i++)
        if ((last_i = this.lastIndexOf(this[i])) !== i)
            this.splice(i+1, last_i-i);
    return this;
}

或非原型：

function sortUnique(arr) {
    arr.sort();
    var last_i;
    for (var i=0;i<arr.length;i++)
        if ((last_i = arr.lastIndexOf(arr[i])) !== i)
            arr.splice(i+1, last_i-i);
    return arr;
}

这也是 在大多数非 Chrome 浏览器中比上述方法更快。

Answer 11

["Defects", "Total", "Days", "City", "Defects"].reduce(function(prev, cur) {
  return (prev.indexOf(cur) < 0) ? prev.concat([cur]) : prev;
 }, []);

[0,1,2,0,3,2,1,5].reduce(function(prev, cur) {
  return (prev.indexOf(cur) < 0) ? prev.concat([cur]) : prev;
 }, []);

Answer 12

原始值

带有 Set（推荐）

var array = ["FreePhoenix888", "FreePhoenix888", "konard", "FreePhoenix888"];

let set = [...new Set(array)];

console.log(set); // ["FreePhoenix888", "konard"]

没有设置

function filterUniqueObjects(value, index, array) {
  return array.indexOf(value) === index;
}

// usage example:
var array = ["FreePhoenix888", "FreePhoenix888", "konard", "FreePhoenix888"];
var arrayOfUniqueItems = array.filter(filterUniqueObjects);

console.log(arrayOfUniqueItems); // ["FreePhoenix888", "konard"]

对象

此示例展示了如何不仅过滤原始值数组，还过滤对象数组。我添加了注释，以便您更轻松地了解可以根据您的要求进行更改的内容。

let array = [
  { name: '@deep-foundation/core', version: '0.0.2' },
  { name: '@deep-foundation/capacitor-device', version: '10.0.1' },
  { name: '@deep-foundation/capacitor-device', version: '10.0.2' },
];

// Of course you can inline this function as filter argument uniqueArray.filter((item, index, self) => self.findIndex(innerItem => innerItem.name === item.name) === index);
function filterUniqueObjects(value, index, self) {
  return (
    self.findIndex(
      // Modify this function as you desire. You may want to calculate uniqueness depending only on specific fields, not all
      (obj) => obj.name === value.name
    ) === index
  );
};

let uniqueArray = array
  .reverse() // If you want latest duplicates to remain
  .filter(filterUniqueObjects)
  .reverse(); // To get back to original order after first reverse

console.log(uniqueArray)

Answer 13

这个问题已经得到了很多回答，但并没有满足我的特殊需求。

许多答案都是这样的：

a.filter((item, pos, self) => self.indexOf(item) === pos);

但这不适用于复杂对象的数组。

假设我们有一个像这样的数组：

const a = [
 { age: 4, name: 'fluffy' },
 { age: 5, name: 'spot' },
 { age: 2, name: 'fluffy' },
 { age: 3, name: 'toby' },
];

如果我们想要具有唯一名称的对象，我们应该使用 array.prototype.findIndex 而不是 array.prototype.indexOf：

a.filter((item, pos, self) => self.findIndex(v => v.name === item.name) === pos);

Answer 14

在查看了这里所有 90+ 答案后，我发现还有一个空间：

Array.includes 有一个非常方便的第二个参数："fromIndex"，因此通过使用它，每次迭代filter 回调方法将从[当前索引] + 1 开始搜索数组，其中保证不包含< em>当前在查找中过滤了项目，并且还节省了时间。

注意 - 此解决方案不会保留顺序，因为它从从左到右删除了重复的项目，但如果 Array< /em> 是对象的集合。

//                

Answer 15

这个原型 getUnique 并不完全正确，因为如果我有一个像这样的数组： ["1",1,2,3,4,1,"foo"] 它将返回 ["1","2","3","4"] 并且 "1" 是字符串，1 是整数；他们是不同的。

这是一个正确的解决方案：

Array.prototype.unique = function(a){
    return function(){ return this.filter(a) }
}(function(a,b,c){ return c.indexOf(a,b+1) < 0 });

使用：

var foo;
foo = ["1",1,2,3,4,1,"foo"];
foo.unique();

上面将产生["1",2,3,4,1,"foo"]。

Answer 16

[...new Set(duplicates)]

这是最简单的一个，引用自MDN 网络文档。

const numbers = [2,3,4,4,2,3,3,4,4,5,5,6,6,7,5,32,3,4,5]
console.log([...new Set(numbers)]) // [2, 3, 4, 5, 6, 7, 32]

Answer 17

这是因为 0 在 JavaScript 中是一个假值。

如果数组的值为 0 或任何其他虚假值，则 this[i] 将为虚假值。

Answer 18

Array.prototype.getUnique = function() {
    var o = {}, a = []
    for (var i = 0; i < this.length; i++) o[this[i]] = 1
    for (var e in o) a.push(e)
    return a
}

Answer 19

无需扩展 Array.prototype （据说这是一种不好的做法）或使用 jquery/underscore，您可以简单地过滤数组。

通过保留最后一次出现：

    function arrayLastUnique(array) {
        return array.filter(function (a, b, c) {
            // keeps last occurrence
            return c.indexOf(a, b + 1) < 0;
        });
    },

或第一次出现：

    function arrayFirstUnique(array) {
        return array.filter(function (a, b, c) {
            // keeps first occurrence
            return c.indexOf(a) === b;
        });
    },

嗯，它只是 javascript ECMAScript 5+，这意味着只有 IE9+，但对于本机 HTML/JS 的开发（Windows Store App、Firefox OS、Sencha、Phonegap、Titanium，.. .)。

Answer 20

简单的。

return Array.from(new Set(a));

Answer 21

现在使用集合，您可以删除重复项并将它们转换回数组。

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

console.log([...new Set(names)])

另一种解决方案是使用 sort &筛选

var names = ["Mike","Matt","Nancy", "Matt","Adam","Jenny","Nancy","Carl"];
var namesSorted = names.sort();
const result = namesSorted.filter((e, i) => namesSorted[i] != namesSorted[i+1]);
console.log(result);

Answer 22

如果您使用 Prototype 框架，则无需执行“for”循环，您可以使用 http://prototypejs.org/doc/latest/language/Array/prototype/uniq/ 像这样：

var a = Array.uniq();  

这将产生一个没有重复项的重复数组。我在搜索一种计算不同数组记录的方法时遇到了您的问题，因此在 uniq() 之后我使用了 size() 并且得到了简单的结果。
ps 抱歉，如果我输入错误，

请编辑：如果您想转义未定义的记录，您可能需要在之前添加 compact() ，如下所示：

var a = Array.compact().uniq();  

Answer 23

我遇到了一个稍微不同的问题，我需要从数组中删除具有重复 id 属性的对象。这有效。

let objArr = [{
  id: '123'
}, {
  id: '123'
}, {
  id: '456'
}];

objArr = objArr.reduce((acc, cur) => [
  ...acc.filter((obj) => obj.id !== cur.id), cur
], []);

console.log(objArr);

Answer 24

如果您可以接受额外的依赖项，或者您的代码库中已经有其中一个库，则可以使用 LoDash（或 Underscore）从数组中删除重复项。

用法

如果您的代码库中还没有它，请使用 npm 安装它：

npm install lodash

然后按如下方式使用它：

import _ from 'lodash';
let idArray = _.uniq ([
    1,
    2,
    3,
    3,
    3
]);
console.dir(idArray);

输出：

[ 1, 2, 3 ]

Answer 25

在 ES6/更高版本中

仅获取唯一值

  let a = [
           { id: 1, name: "usman" },
           { id: 2, name: "zia" },
           { id: 3, name: "usman" },
          ];
const unique = [...new Set(a.map((item) => item.name))];
console.log(unique); // ["usman", "zia"]

获取唯一对象

const myObjArray = [
                       { id: 1, name: "usman" },
                       { id: 2, name: "zia" },
                       { id: 3, name: "usman" },
                   ];
// Creates an array of objects with unique "name" property values.
let uniqueObjArray = [
  ...new Map(myObjArray.map((item) => [item["name"], item])).values(),
];

console.log("uniqueObjArray", uniqueObjArray);

Answer 26

我不知道为什么 Gabriel Silveira 以这种方式编写该函数，但对我来说同样有效且无需缩小的更简单的形式是：

Array.prototype.unique = function() {
  return this.filter(function(value, index, array) {
    return array.indexOf(value, index + 1) < 0;
  });
};

或在 CoffeeScript 中：

Array.prototype.unique = ->
  this.filter( (value, index, array) ->
    array.indexOf(value, index + 1) < 0
  )

Answer 27

用简单的方法查找唯一的数组值

function arrUnique(a){
  var t = [];
  for(var x = 0; x < a.length; x++){
    if(t.indexOf(a[x]) == -1)t.push(a[x]);
  }
  return t;
}
arrUnique([1,4,2,7,1,5,9,2,4,7,2]) // [1, 4, 2, 7, 5, 9]

Answer 28

看来我们已经失去了拉斐尔的答案，它多年来一直是公认的答案。这是（至少在 2017 年）性能最佳的解决方案如果您没有混合类型数组 ：

Array.prototype.getUnique = function(){
    var u = {}, a = [];
    for (var i = 0, l = this.length; i < l; ++i) {
        if (u.hasOwnProperty(this[i])) {
            continue;
        }
        a.push(this[i]);
        u[this[i]] = 1;
    }
return a;
}

如果您确实有混合类型数组，则可以序列化哈希键：

Array.prototype.getUnique = function() {
    var hash = {}, result = [], key; 
    for ( var i = 0, l = this.length; i < l; ++i ) {
        key = JSON.stringify(this[i]);
        if ( !hash.hasOwnProperty(key) ) {
            hash[key] = true;
            result.push(this[i]);
        }
    }
    return result;
}

Answer 29

奇怪的是，以前没有建议过这一点。要通过数组中的对象键（下面的id）删除重复项，您可以执行以下操作：

const uniqArray = array.filter((obj, idx, arr) => (
  arr.findIndex((o) => o.id === obj.id) === idx
)) 

Answer 30

对于具有一些唯一 id 的基于对象的数组，我有一个简单的解决方案，您可以通过它按线性复杂度进行排序

function getUniqueArr(arr){
    const mapObj = {};
    arr.forEach(a => { 
       mapObj[a.id] = a
    })
    return Object.values(mapObj);
}