Comment convertir Set en Array en JavaScript ?

Comment convertir Set en Array en JavaScript ?

Pour convertir un Ensemble dans un Tableau , nous devons connaître les principales caractéristiques d’un ensemble. UN ensemble est une collection d’éléments uniques, c’est-à-dire qu’aucun élément ne peut être répété. Ensemble dans ES6 sont ordonnés, c'est-à-dire les éléments du ensemble peut être itéré dans l’ordre d’insertion. La conversion d'un ensemble en tableau en JavaScript est simple grâce à la nature unique des éléments et à la structure ordonnée des ensembles.

convertir un ensemble en tableau

convertir Set en tableau en JavaScript

UN ensemble peut être converti en tableau dans Javascript des manières suivantes :

Table des matières

1. Utilisation de la méthode JavaScript Array.from()

Méthode JavaScript Array.from() renvoie un nouveau tableau à partir d'un tableau, d'un objet ou d'autres objets itérables comme Map, Set, etc. Il prend l'ensemble comme paramètre et le convertit en tableau.

Syntaxe:

const arrayName = Array.from(setName); 

Exemple : T Cet exemple convertit un Set en un Array en utilisant le Méthode Array.from()

Javascript
// Creating array from input string const mySet = new Set([1, 1, 2, 3, 4, 4, 5, 6, 5]); console.log('Elements in the set are: ', mySet); let myArr = Array.from(mySet); // Display output console.log('Elements in the Array created using Set are: ', myArr); 

Sortir
Elements in the set are: Set(6) { 1, 2, 3, 4, 5, 6 } Elements in the Array created using Set are: [ 1, 2, 3, 4, 5, 6 ] 

2. Utilisation de l'opérateur de propagation JavaScript

Le Opérateur de propagation JavaScript peut être utilisé pour déstructurer les éléments du tableau puis les affecter à la nouvelle variable sous forme de tableau.

Syntaxe:

const arrayName = [...setName]; 

Exemple: Le code ci-dessous convertit un ensemble en tableau en utilisant le opérateur de propagation .

Javascript
// Input set let mySet = new Set(['GFG', 'JS']); console.log('Elements in the set are: ', mySet); // Convert using spread operator let myArr = [...mySet]; // Display output console.log('Elements in the Array created using Set are: ', myArr); 

Sortir
Elements in the set are: Set(2) { 'GFG', 'JS' } Elements in the Array created using Set are: [ 'GFG', 'JS' ] 

3. Utilisation de la méthode JavaScript forEach()

Le Méthode arr.forEach() appelle la fonction fournie une fois pour chaque élément de l'ensemble où ils sont poussés vers un tableau à l'aide de la méthode push().

Syntaxe:

 setName.forEach((ele)=>{ arrayName.push(lui); }); 

Exemple: L'exemple de code ci-dessous utilise le Méthode forEach() pour convertir un ensemble en tableau.

Javascript
// Create input set let newSet = new Set(); let arr = []; newSet.add('Geeks'); newSet.add('for'); // Duplicate item newSet.add('Geeks'); console.log('Set Elements: ', newSet); let someFunction = function (val1) {  arr.push(val1); }; newSet.forEach(someFunction); // Display output console.log('Array Elements: ' + arr); 

Sortir
Set Elements: Set(2) { 'Geeks', 'for' } Array Elements: Geeks,for 

4. Utilisation de la méthode Lodash _.toArray()

Lodash est une bibliothèque JavaScript qui nous permet d'utiliser le _.toArray() méthode qui accepte une valeur et la convertit en tableau.

NOTE: Pour utiliser cette approche, vous devez installer la bibliothèque lodash sur votre système local à l'aide du npm je lodash commande.

Syntaxe:

const arrayName = _.toArray(setName); 

Exemple: Le code ci-dessous implémente la méthode _.toArray() de la bibliothèque lodash pour convertir un ensemble en tableau.

Javascript
// Requiring the lodash library  const _ = require('lodash'); let set = new Set(['welcome', 'to', 'GFG']); console.log('Set Elements: ', set); // Use of _.toArray() method  console.log('Array Elements: ', _.toArray(set)); 

Sortir:

Set Elements: Set(3) { 'welcome', 'to', 'GFG' } Array Elements: [ 'welcome', 'to', 'GFG' ] 

5. Utilisation de la méthode Array.from() avec une fonction de mappage

Tandis que le Méthode Array.from() est couramment utilisé pour convertir des itérables comme des ensembles en tableaux, il permet également l'utilisation d'une fonction de mappage. Cette fonction de mappage peut être utile pour transformer chaque élément de l'ensemble lors du processus de conversion.

Syntaxe:

const arrayName = Array.from(setName, mapFunction); 

Exemple: Cet exemple montre comment utiliser Array.from() avec une fonction de mappage pour convertir un ensemble en tableau avec des éléments modifiés.

Javascript
// Create a set with numerical values const numSet = new Set([1, 2, 3, 4, 5]); // Convert the set to an array, doubling each element const doubledArray = Array.from(numSet, x =>x * 2); console.log('Tableau doublé :', tableau doublé); 

Sortir
Doubled Array: [ 2, 4, 6, 8, 10 ] 

Utilisation de la méthode JavaScript Array.prototype.map avec l'opérateur Spread

Une autre approche pour convertir un ensemble en tableau en JavaScript consiste à combiner la méthode map avec l'opérateur spread. Cette méthode permet la transformation des éléments pendant le processus de conversion, similaire à Array.from() avec une fonction de mappage, mais en utilisant une syntaxe différente.

Syntaxe :

const arrayName = [...setName].map(mapFunction); 

Exemple: Dans cet exemple, nous allons convertir un Set en Array et appliquer une transformation à chaque élément à l'aide de la méthode map.

Javascript
// Create a set with string values const stringSet = new Set(['a', 'b', 'c', 'd']); // Convert the set to an array, appending a suffix to each element const suffixedArray = [...stringSet].map(x =>x + '_suffixe'); console.log('Tableau suffixé :', suffixedArray); 

Sortir
Suffixed Array: [ 'a_suffix', 'b_suffix', 'c_suffix', 'd_suffix' ]