Open In App

How to convert Set to Array in JavaScript ?

Last Updated : 03 May, 2024
Improve
Improve
Like Article
Like
Save
Share
Report

To convert a Set into an Array, we need to know the main characteristics of a set. A set is a collection of unique items, i.e. no element can be repeated. Set in ES6 are ordered i.e. elements of the set can be iterated in the insertion order. Converting a Set to an Array in JavaScript is straightforward thanks to Sets’ unique element nature and ordered structure.

convert-set-to-array

convert Set to Array in JavaScript

A set can be converted to an array in JavaScript in the following ways:

1. Using JavaScript Array.from() Method

JavaScript Array.from() Method returns a new Array from an array, object or other iterable objects like Map, Set, etc. It takes the set as parameter and converts it to an array.

Syntax:

const arrayName = Array.from(setName);

Example: This example converts a Set into an Array using the Array.from() method

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);

Output
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. Using JavaScript Spread Operator

The JavaScript Spread Operator can be used to destructure the elements of the array and then assign them to the new variable in the form of an array.

Syntax:

const arrayName = [...setName];

Example: The below code converts a set into an array using the spread operator.

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);

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

3. Using JavaScript forEach() Method

The arr.forEach() method calls the provided function once for each element of the set where they are pushed to an array using the push() method.

Syntax:

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

Example: The below code example uses the forEach() method to convert a set into an array.

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);

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

4. Using Lodash _.toArray() Method

Lodash is an JavaScript library that allows us to use the _.toArray() method which accepets a value and convert it to an array.

NOTE: To use this approach, you need to install the lodash library into your local system using the npm i lodash command.

Syntax:

const arrayName = _.toArray(setName);

Example: The below code implements the _.toArray() method of the lodash library to convert a set into an array.

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));

Output:

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

5. Using the Array.from() Method with a Mapping Function

While the Array.from() method is commonly used to convert iterables like sets to arrays, it also allows the usage of a mapping function. This mapping function can be useful for transforming each element of the set during the conversion process.

Syntax:

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

Example: This example demonstrates how to use Array.from() with a mapping function to convert a set into an array with modified elements.

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("Doubled Array:", doubledArray);

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




Like Article
Suggest improvement
Share your thoughts in the comments

Similar Reads