Sets in JavaScript - How to work with the set data structure in JS

With the introduction of ES6 (ECMAScript 6) came the introduction of a new built-in JavaScript object type: the Set. You will learn about the JavaScript Set object in this blog, which enables you to handle a collection of unique values of any type efficiently.

The SameValueZero algorithm is used to determine whether each element of the Set is unique. This algorithm is similar to === (strict equal) except in one case where NaN == NaN evaluates to true so that multiple NaN is not inserted in the Set.

A new type named Set is provided by ES6 to store a collection of distinct values of any type. You can use the following syntax to construct a fresh, empty Set:

A Set can also be created from an existing array too:

As you can see in the code above duplicate integers are not passed into the set as unique values are allowed.

A string that already exists can likewise be used for this. Duplicate strings are not sent to the Set, as you can see in the sample below.

As you can see each letter in the string gets its index and is unique.

size → Returns the number of elements in the Set

The Set object provides the following useful methods:

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

Adding objects to Set:

In the code above even-though objects look the same, each object has a different reference, so they are not === An object reference means that it compares the memory address of the object and not the actual key/value pairs contained in the object.

Sets provide a simple method for determining whether a specific element is present. This may be done by calling the .has() method, which will return true or false.

The .delete() method must be used with the element to be deleted as a parameter to remove an element from a Set.

You can use the .clear() method to eliminate every element from a Set without having to delete each separately.

There are a couple of methods which can help iterate over elements in a set.

The forEach() method calls a function for each element in an array.

The for..of loop in JavaScript allows you to iterate over iterable objects (arrays, sets, maps, strings etc).

We hope that this will provide you with a clearer understanding of how to use Sets in JavaScript projects. If you've done something fascinating with a Set that I didn't list here, please let me know!