How to use the Javascript Set() ES6 method

I recently started a #100DaysofLeetcode challenge and came across a coding problem whose solution involved using the Javascript ES6 Set() method. I dug deeper into what it was, how it works and how to use it in your day to day coding and this article will try to shed some more light into it.

What is the Set() method in Javascript

The Set() method is used to store unique values of any type, whether primitive values or object references. You can iterate through all elements in a set and values inside a set may only occur once.

Sets may look similar to Arrays but some key differences include:

Elements inside an array are indexed, they are ordered and retrieved via an index reference.
Sets do not support random access and reordering which are supported by arrays.

Creating a set

When creating a set, we write new Set() which creates a new empty Set.

const blogTags = new Set();

You can also pass in an iterable object whose values will be added to new Set created

const blogTags = new Set(["HTML", "Productivity"]);

Adding items to a set

With our created Set, we can now add more items, this is done with the add() method as shown below

const blogTags = new Set();
blogTags.add("Productivity");
blogTags.add("CSS");

output

Set(2){"Productivity","CSS"}

trying to add a duplicate value to the newly created Set will be ignored.

Searching for a specific value in a set

A set doesn't support random access but you can search for specific items inside the set with has()

const blogTags = new Set();
 blogTags.add("Productivity");
 blogTags.add("CSS")

blogTags.has("CSS"); //true
blogTags.has("Javascript"); //false

Removing values from the set

To remove a single value from the set you use delete()

const blogTags = new Set();
blogTags.add("Productivity");
blogTags.add("CSS");

blogTags.has("CSS"); //true
blogTags.delete("CSS");
blogTags.has("CSS"); //false

Since sets are iterable objects, we can loop through them and also use the spread operator. Values inside a set are arranged in the order by which they were inserted inside the set created

const blogTags = new Set();
blogTags.add("Productivity");
blogTags.add("CSS");
blogTags.add("Devops");

for(let tag of blogTags){
      console.log("Tags in the blog include", tag);
 }

output

Tags in the blog include Productivity
Tags in the blog include CSS
Tags in the blog include Devops

When and why you would use sets

Sets are not a replacement for arrays or other data structures but are useful for some specific situations including:

When you need unique values
When you don't care about random access
When the order of items does not matter

Conclusion

I jumped into the #100daysofleetcode challenge with a goal of being good at Data structures and Algorithms for interviews, but later realized that I'm learning alot of Javascript along the way. I've added more resources you can use to dive deep into the workings of the Set() method. Hope this helped and happy Coding!!

— Extra resources and deep dive

The Devsign Blog