Last updated: Mar 4, 2024
Reading timeยท3 min
To sort a Set
in JavaScript:
Array.from()
method to convert the Set
to an array.Array.sort()
method to sort the array.Set
object.// โ Sort a Set containing Strings const set1 = new Set(['c', 'b', 'a']); const sortedArray = Array.from(set1).sort(); console.log(sortedArray); // ๐๏ธ ['a', 'b', 'c'] const sortedSet = new Set(sortedArray); console.log(sortedSet); // ๐๏ธ {'a', 'b', 'c'}
If you need to sort a Set
containing numbers, you have to pass a function to
the Array.sort()
method.
// โ Sort a Set containing Numbers const set1 = new Set([300, 100, 700]); // ๐๏ธ sorts numbers in Ascending order const sortedArray = Array.from(set1).sort((a, b) => a - b); console.log(sortedArray); // ๐๏ธ [100, 300, 700] const sortedSet = new Set(sortedArray); console.log(sortedSet); // ๐๏ธ {100, 300, 700}
We used the Array.from() method to
convert the Set
object to an array, so we can call the
Array.sort() method on the
array.
Notice that when sorting numbers, we have to pass a function as a parameter to
the sort()
method, whereas with strings, we don't.
The parameter we passed to the sort()
method is a function that defines the
sort order.
If you don't provide the parameter, the array elements get converted to strings and sorted according to their UTF-816 code unit values.
This is not what we want when working with Set
objects that contain numbers,
however, it is exactly what we want when comparing strings.
After we have sorted the array, we pass it to the
Set() constructor to convert it back to
a Set
.
If you have to do this often, define reusable functions.
function sortStringSet(set) { const sortedArray = Array.from(set).sort(); const sortedSet = new Set(sortedArray); return sortedSet; } // ๐๏ธ Set(3) { 'a', 'b', 'c' } console.log(sortStringSet(new Set(['c', 'b', 'a']))); // ๐๏ธ Set(3) { 'a', 'c', 'z' } console.log(sortStringSet(new Set(['c', 'z', 'a'])));
The sortStringSet()
function takes a Set
containing strings as a parameter
and sorts the Set
.
You can also define a sortNumbersSet()
function.
function sortNumbersSet(set) { const sortedArray = Array.from(set).sort((a, b) => a - b); const sortedSet = new Set(sortedArray); return sortedSet; } // ๐๏ธ Set(3) { 100, 300, 700 } console.log(sortNumbersSet(new Set([700, 100, 300]))); // ๐๏ธ Set(3) { 100, 500, 600 } console.log(sortNumbersSet(new Set([500, 600, 100])));
The function takes a numeric Set
as a parameter and sorts the Set
.
Alternatively, you can use the
spread syntax (...) to
convert the Set
to an array.
// โ Sort a Set object that contains strings const set1 = new Set(['c', 'b', 'a']); const sortedArray = [...set1].sort(); console.log(sortedArray); // ๐๏ธ [ 'a', 'b', 'c' ] const sortedSet = new Set(sortedArray); console.log(sortedSet); // ๐๏ธ {'a', 'b', 'c'}
If your Set
object contains numbers, pass a function to the Array.sort()
method.
const numbersSet = new Set([300, 100, 700]); const sortedNumbers = [...numbersSet].sort((a, b) => a - b); console.log(sortedNumbers); // ๐๏ธ [100, 300, 700] const sortedNumbersSet = new Set(sortedNumbers); console.log(sortedNumbersSet); // ๐๏ธ {100, 300, 700}
The code samples achieve the same result as the ones that used the
Array.from()
method.
The spread syntax (...) simply unpacks the elements of the Set
into an array.
You can learn more about the related topics by checking out the following tutorials: