Supprimer les doublons d'un tableau

J'ai un tableau d'objets qui ressemble à ceci:

var array = [
    {id:123, value:"value1", name:"Name1"},
    {id:124, value:"value2", name:"Name1"},
    {id:125, value:"value3", name:"Name2"},
    {id:126, value:"value4", name:"Name2"}
    ...
];

Comme vous pouvez le voir, certains noms sont répétés. Je veux obtenir un nouveau tableau avec des noms uniquement, mais si un nom se répète, je ne veux pas l'ajouter à nouveau. Je veux ce tableau:

var newArray = ["Name1", "Name2"];

J'essaye de faire ça avec map:

var newArray = array.map((a) => {
    return a.name;
});

Mais le problème est que cela renvoie:

newArray = ["Name1", "Name1", "Name2", "Name2"];

Comment puis-je définir une condition à l'intérieur map, pour qu'elle ne renvoie pas un élément qui existe déjà? Je veux faire cela avec mapou avec une autre fonctionnalité ECMAScript 5 ou ECMAScript 6.

Avec ES6, vous pouvez utiliser Setpour des valeurs uniques, après avoir mappé uniquement les noms des objets.

Cette proposition utilise une syntaxe étalée... pour collecter les éléments dans un nouveau tableau.

const array = [{ id: 123, value: "value1", name:"Name1" }, { id: 124, value: "value2", name: "Name1" }, { id: 125, value: "value3", name: "Name2" }, { id: 126, value: "value4", name: "Name2" }],
      names = [...new Set(array.map(a => a.name))];

console.log(names);

Si vous recherchez une solution JavaScript qui n'est pas ES 6 (pas de Set), vous pouvez utiliser la méthode Arrayreduce :

var array=[
  {id:123, value:"value1", name:"Name1"},
  {id:124, value:"value2", name:"Name1"},
  {id:125, value:"value3", name:"Name2"},
  {id:126, value:"value4", name:"Name2"}
];
var names = array.reduce(function (a, b) {
  if (a.indexOf(b.name) == -1) {
    a.push(b.name)
  }
  return a;
}, []);

console.log(names);

Personnellement, je ne vois pas pourquoi tout le monde a envie d'ES 6. Si c'était mon code, je préférerais prendre en charge autant de navigateurs que possible.

var array=[
{id:123, value:"value1", name:"Name1"},
{id:124, value:"value2", name:"Name1"},
{id:125, value:"value3", name:"Name2"},
{id:126, value:"value4", name:"Name2"}
];

   // Create array of unique names
var a = (function(a){
  for (var i = array.length; i--;)
    if (a.indexOf(array[i].name) < 0) a.push(array[i].name);
  return a;
})([]);

console.log(a);

Vous pouvez aussi simplement combiner mapavecfilter

var array = [
  {id:123, value:"value1", name:"Name1"},
  {id:124, value:"value2", name:"Name1"},
  {id:125, value:"value3", name:"Name2"},
  {id:126, value:"value4", name:"Name2"}
];

var unique = array
  .map( item => item.name )
  .filter( ( item, idx, arr ) => arr.indexOf( item ) == idx ) 

console.log(unique)

Vous pouvez utiliser Object.keys () pour obtenir le tableau des noms de propriétés énumérables propres à un objet donné à partir du résultat de l'objet de l'itération de la arrayvariable avec Array.prototype.reduce () où les clés sont les noms détruits

Code:

const array = [{id:123, value:"value1", name:"Name1"}, {id:124, value:"value2", name:"Name1"}, {id:125, value:"value3", name:"Name2"}, {id:126, value:"value4", name:"Name2"}],
      names = Object.keys(array.reduce((a, { name }) => (a[name] = 1, a), {}))

console.log(names)

Beaucoup de bonnes réponses ici. Je voudrais juste contribuer avec une certaine diversité dans l'espoir de vous donner une autre perspective.

Les tableaux sont de type objet en JavaScript, ils peuvent donc être utilisés comme hachage en même temps. En utilisant cette fonctionnalité, nous pouvons grandement simplifier le travail à effectuer en une seule opération de réduction avec une complexité de temps O (n).

Si vous n'êtes pas satisfait du fait que votre tableau contienne des propriétés autres que les clés du tableau, vous pouvez également envisager de conserver un objet de hachage séparé.

var array = [{id:123, value:"value1", name:"Name1"},
             {id:124, value:"value2", name:"Name1"},
             {id:125, value:"value3", name:"Name2"},
             {id:126, value:"value4", name:"Name2"}
            ],
result = array.reduce((p,c) => p[c.name] ? p : (p[c.name] = true, p.push(c.name), p), []);
console.log(result);

Je suis d'accord que si vous n'avez besoin que des namevaleurs, Setc'est la voie à suivre.

Cependant , si vous souhaitez obtenir un tableau d'objets uniques en fonction de la namepropriété, je vous suggère d'utiliser un fichier Map. Un moyen rapide de créer une carte consiste à utiliser un tableau de [key, value]tableaux:

const array = [{ id: 123, value: "value1", name:"Name1" }, { id: 124, value: "value2", name: "Name1" }, { id: 125, value: "value3", name: "Name2" }, { id: 126, value: "value4", name: "Name2" }],
      unique = new Map(array.map(obj => [obj.name, obj]));

// To get the unique objects
const uniques = Array.from(unique.values());

// Get the names like you already did:
console.log("Names:", uniques.map(obj => obj.name));

// If you ever need the complete array of unique objects, you got a ref:
console.log(JSON.stringify(uniques));

.as-console-wrapper { min-height: 100%; }

Un avantage supplémentaire de Mapest que vous obtenez à la fois la filterfonctionnalité qui élimine les non-uniques, sans perdre la connexion avec les objets source. Bien sûr, cela n'est nécessaire que si vous avez besoin de référencer plusieurs fois l'ensemble unique d'objets.

Si vous êtes limité à ES5, j'utiliserais Lodash_.uniq

var newArray = _.uniq(array.map(function(a) {
  return a.name;
}));

Avec ES6, cela devrait faire l'affaire.

var array=[
    {id:123, value:"value1", name:"Name1"},
    {id:124, value:"value2", name:"Name1"},
    {id:125, value:"value3", name:"Name2"},
    {id:126, value:"value4", name:"Name2"}
];

var set = new Set();

array.forEach((a)=>{
    set.add(a.name);
}); 

console.log(Array.from(set));

En utilisant UnderscoreJS,

array = [{id:123, value:"value1", name:"Name1"}, {id:124, value:"value2", name:"Name1"}, {id:125, value:"value3", name:"Name2"}, {id:126, value:"value4", name:"Name2"}];
get_names =  _.pluck(_.uniq(array, 'name'), 'name')
console.log(get_names)

<script src="https://cdnjs.cloudflare.com/ajax/libs/underscore.js/1.8.3/underscore-min.js"></script>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.7.1/jquery.min.js"></script>

»

Dans ES5, utilisez un objet comme dictionnaire pour les performances O ( n ).

Cela ne fonctionnera que si toutes les clés sont des chaînes.

var array = [
    {id: 123, value: "value1", name: "Name1"},
    {id: 124, value: "value2", name: "Name1"},
    {id: 125, value: "value3", name: "Name2"},
    {id: 126, value: "value4", name: "Name2"}
];

var allNames = array.map(item => item.name);

var map = {};
allNames.forEach(name => {
  map[name] = true;
});
var uniqueNames = Object.keys(map);

console.log(uniqueNames);

Vous pouvez faire la même chose dans une expression si vous le souhaitez:

var uniqueNames = Object.keys(allNames.reduce((m, n) => (m[n] = true, m), {}));

mais je trouve la forme impérative plus facile à lire.

Essaye ça:

nArr = [];
array.forEach((a) => {
    if (nArr.indexOf(a.name) < 0) { 
        nArr.push(a.name); 
    }
}); 

Utilisation array#forEach() et des array#indexOf()méthodes comme celle-ci si vous voulez encore une compatibilité maximale , une syntaxe concise:

const array = [{ id: 123, value: "value1", name:"Name1" }, { id: 124, value: "value2", name: "Name1" }, { id: 125, value: "value3", name: "Name2" }, { id: 126, value: "value4", name: "Name2" }]

// initialize an empty array named names
let names = [];

// iterate through every element of `array` & check if it's 'name' key's value already in names array if not ADD it 
array.forEach(function(element) { if (names.indexOf(element.name) === -1) names.push(element.name) });
// or use tilde like this:
//array.forEach(function(element) { if (~names.indexOf(element.name)) names.push(element.name) });

console.log(names);

Cependant, si la compatibilité est pas un problème utilisation ECMAScript 6 de l » Setobjet,array#map et des Array.from()méthodes comme celle - ci:

const array = [{ id: 123, value: "value1", name:"Name1" }, { id: 124, value: "value2", name: "Name1" }, { id: 125, value: "value3", name: "Name2" }, { id: 126, value: "value4", name: "Name2" }];

// iterate through every element from array using map and store it in Set(a Set won't have duplicates) then convert the Set back to Array(using Array.from)
let names = Array.from(new Set(array.map(element => element.name)));

console.log(names);

C'est comme ça que je l'ai fait, en utilisant un tableau vide séparé.

var array = [
   {id:123, value:"value1", name:"Name1"},
   {id:124, value:"value2", name:"Name1"},
   {id:125, value:"value3", name:"Name2"},
   {id:126, value:"value4", name:"Name2"}	    
];

var array2 = []		
		
for (i=0; i<array.length;i++){						
   if (array2.indexOf(array[i].name) == -1){				
     array2.push(array[i].name);
    }
}			

console.log(array2)	

Pour ceux qui recherchent un 1 liner

const names = array.reduce((acc, {name}) => acc.includes(name) ? acc : [name, ...acc], []);

ou sans utiliser de méthodes sur le prototype du tableau

const { reduce, includes } = Array;
const names = reduce(array, (acc, {name}) => includes(acc, name) ? acc : [name, ...acc], []);

pourrait être utile pour écrire des fonctions pures pour gérer cela

const get_uniq_values = (key, arr) => reduce(arr, (a, o) => includes(a, o[key]) ? a : [o[key], ...a], []);

var __array=[{id:123, value:"value1", name:"Name1"},{id:124, value:"value2", name:"Name1"},{id:125, value:"value3", name:"Name2"},{id:126, value:"value4", name:"Name2"}];

function __checkArray(__obj){
    var flag = true;
    for(let i=0; i < __array.length; i++){
        if(__obj.id == __array.id){
            flag = false;
            break;
        }
    }

    return flag;
}

var __valToPush = {id: 127, value: "value5", name: "Name3"};
if(__checkArray(__valToPush)){
    __array.push(__valToPush)
}