Set Data Structure in JavaScript : Everything You Ever Wanted to Know

In this tutorial, we will learn about how to use and when to use Set Data Structure in JavaScript.

What is Set Data Structure in JavaScript?

Sets is JavaScript's' new data structure which is introduced in ES6.

Basically, sets is just a collection of unique values, so that means that a set can never have any duplicate value

Also, Sets is iterable so we can loop over them.

Sets are not intended to replace array, so whenever you might need store values in order and that might contain duplicates always use arrays.  

Creating a Set

const numberUnique = new Set([4,58,8,4,8]);
console.log(numberUnique);
Output : 4,58,8

Creating an empty set
const set = new Set();

Properties

We can get the size of the number of elements using size property

const number = new Set([1,2,3,4,5])
console.log(number.size); 
Output : 5

Methods

add():

The add() method appends the element passed to the end of a Set object and returns the Set object.

var set1= new Set([1, 2, 3, 4 ]);
set1.add(5);
console.log(set1); 
// Output : Set(5) {1, 2, 3, 4, 5}

We can also chain add method as below:

set1.add(5)
    .add(6)
    .add(7);
set1; //  Set(5) {1, 2, 3, 4, 5,6,7,8}

has():

Using has() method we cab check if an element with the specified value exists in a Set object or not, and false if the value is not present in the Set 

const numbers= new Set([1, 2, 3, 4 ]);
numbers.has(2); //true
numbers.has(8); //false

delete():

The delete() method removes the specified element from a Set object.

Returns true if an element in the Set is deleted, otherwise it returns false.

const numbers = new Set([1, 2]);
numbers.delete(2); //true
numbers; //Set(1) {1}
numbers.delete(8); false.

clear():

The clear()method empties theSet object.

const numbers = new Set(1, 2]);
numbers.size; // 2
numbers.clear(); 
numbers.size; // 0

Use cases

Case 1: Extract string

const hobby = 'cricket';
var mySet = new Set(hobby);  
//Set(5) {"c", "r", "i", "c", "k","e","t"}

Case 2: Removing duplicate elements from an array

Bascially, main use cases of sets is to remove duplicate from array

const names= [ 'pizza', 'pasta', 'pizza', 'soup'];
var uniqueNames = [...new Set(names)]
uniqueNames = [ 'pizza', 'pasta', 'soup'];

Case 3: Count letters in the name

new Set('how are you').size // 9

Difference Between Set and Array:

• Set objects store unique values, whereas array can have duplicate values
• In an array, we need to use the indexOf method to check the availability of element in the array, but in a set we can use the has method, which is compared to be faster than indexOf method.

Conclusion:

I hope this article is helpful to you.

If you found this post informative, then please share it on your social media.