Tableau unique JavaScript

1. Obtenir les valeurs uniques d’un tableau à l’aide de la fonction Set() en JavaScript
2. Obtenir les valeurs uniques d’un tableau à l’aide de la fonction indexOf() en JavaScript
3. Obtenir les valeurs uniques d’un tableau à l’aide de la fonction filter() en JavaScript

Ce tutoriel expliquera comment obtenir les valeurs uniques d’un tableau en utilisant les fonctions Set(), indexOf() et filter() en JavaScript.

Obtenir les valeurs uniques d’un tableau à l’aide de la fonction Set() en JavaScript

Pour obtenir des valeurs uniques à partir d’un tableau, nous pouvons utiliser la fonction Set(), qui crée un nouveau tableau avec des valeurs uniques à partir du tableau existant. Par exemple, créons un tableau avec des valeurs dupliquées, créons-en un nouveau avec des valeurs uniques à l’aide de la fonction Set(), et affichons le résultat sur la console à l’aide de la fonction console.log() en JavaScript. Voir le code ci-dessous.

var myArray = ['c', 'b', 'c', 2, 'b'];
var uniqueArray = [...new Set(myArray)]
console.log('Original Array = ', myArray);
console.log('Array with unique values = ', uniqueArray);

Production:

Original Array =  (5) ["c", "b", "c", 2, "b"]
Array with unique values =  (3) ["c", "b", 2]

Dans la sortie, le nouveau tableau ne contient aucune valeur en double.

Obtenir les valeurs uniques d’un tableau à l’aide de la fonction indexOf() en JavaScript

Pour obtenir des valeurs uniques à partir d’un tableau, nous pouvons créer notre propre fonction en utilisant la fonction indexOf() et une boucle, ce qui créera un nouveau tableau avec des valeurs uniques à partir du tableau existant. Nous utiliserons le tableau pour déplacer les éléments vers le nouveau tableau et la fonction indexOf() pour vérifier si un élément est déjà présent dans le nouveau tableau ou non.

Si l’élément n’est pas dans le nouveau tableau, il sera déplacé dans le nouveau tableau ; sinon, il restera. Par exemple, créons un tableau avec des valeurs en double, puis créons un nouveau tableau avec des valeurs uniques en utilisant notre fonction, et affichons le résultat sur la console en utilisant la fonction console.log() en JavaScript. Voir le code ci-dessous.

function uArray(array) {
  var out = [];
  for (var i = 0, len = array.length; i < len; i++)
    if (out.indexOf(array[i]) === -1) out.push(array[i]);
  return out;
}
var myArray = ['c', 'b', 'c', 2, 'b'];
var uniqueArray = uArray(myArray);
console.log('Original Array = ', myArray);
console.log('Array with unique values = ', uniqueArray);

Production:

Original Array =  (5) ["c", "b", "c", 2, "b"]
Array with unique values =  (3) ["c", "b", 2]

Ici, le nouveau tableau ne contient aucune valeur en double.

Obtenir les valeurs uniques d’un tableau à l’aide de la fonction filter() en JavaScript

Pour obtenir des valeurs uniques à partir d’un tableau, nous pouvons utiliser la fonction filter(), qui crée un nouveau tableau en filtrant les valeurs du tableau existant en fonction d’une condition particulière. La fonction filter() vérifiera chaque valeur présente dans le tableau d’origine. Si une valeur est un doublon, la fonction la supprimera ; sinon, la valeur sera ajoutée au nouveau tableau.

Par exemple, créons un tableau avec des valeurs en double, créons un nouveau tableau avec des valeurs uniques à l’aide de la fonction filter() et affichons le résultat sur la console à l’aide de la fonction console.log() en JavaScript. Voir le code ci-dessous.

var myArray = ['c', 'b', 'c', 2, 'b'];
var uniqueArray = myArray.filter((val, ind, arr) => arr.indexOf(val) === ind);
console.log('Original Array = ', myArray);
console.log('Array with unique values = ', uniqueArray);

Production:

Original Array =  (5) ["c", "b", "c", 2, "b"]
Array with unique values =  (3) ["c", "b", 2]

Comme vous pouvez le voir ici, le nouveau tableau ne contient aucune valeur en double.