Sets can hold values of any data type. It can be simple primitives, such as integers or strings, etc, or complex types like arrays or object literals. Values in the Set can only occur once.
In this article, you’ll learn eight JavaScript Set methods you should master today.
1. How to Create a New Set on JavaScript
You can create a new Set object using the new Set() constructor. The Set object stores unique values of any data type. This constructor accepts an iterable object as a parameter.
Output:
If you don’t specify anything in the parameter, a new empty Set is created.
Output:
If you try to create a Set with repeating elements, the duplicate elements will be removed and a unique Set will be returned.
Output:
You can also create a Set using mixed data types.
Output:
2. How to Append New Elements to a Set Object
You can append a new element to the end of the Set object using the add() method. This method accepts the value of the element to add to the Set object as a parameter, and returns the new Set object with added value.
Output:
You can directly pass the value as a parameter, or you can pass the variable as one instead.
Output:
The add() method also supports chaining.
Output:
If you try to append duplicate elements, only the first instance of the element will be saved.
Output:
3. How to Remove All Elements From a Set Object
You can remove all elements from a Set object using the clear() method. This method removes all the elements and returns undefined.
Output:
4. How to Delete a Specific Element From a Set Object
You can delete a specific element from a Set object (if it exists) using the delete() method. This method accepts the value to be deleted from the Set. If the value is found, the method returns true. Otherwise, it’ll be false.
Output:
5. How to Check If an Element Exists in a Set
You can check whether an element exists in a Set object using the has() method. This method accepts the value as a parameter to test for presence in the Set object. If the element is found, the method returns true; otherwise it’ll be false.
Output:
6. What’s the entries() Method in the JavaScript Set Object?
According to the official MDN Web Docs:
Output:
Output:
The keys and values in the Set are identical.
Output:
7. What’s the forEach() Method in the JavaScript Set Object?
The forEach() method invokes a function for each element of the Set object. This method returns undefined.
Output:
8. What’s the values() Method in the JavaScript Set Object?
The values() method returns an Iterator object that contains all the values in a Set, and it does this in insertion order.
Output:
Note: A Set object in JavaScript has no keys. But to make Sets compatible with Maps, the keys() method is used as an alias for the values() method. The keys() method behaves exactly the same as the values() method.
Now You Know How to Create Sets in JavaScript
So, there you have it. Having read this article, you should have plenty to help you master creating Sets on JavaScript.
Creating Sets is crucial for any programmer looking to up their game. Once you’ve mastered this, you can move on to perfecting other skills—such as creating Arrays.
