INTRODUCTION

JavaScript's Set was introduced in ECMAScript 6 (ES6) because it provides a useful and efficient data structure for storing and manipulating a collection of unique values. By introducing Set in ES6, the JavaScript language was enhanced with a new data structure that is specifically designed for storing and manipulating a collection of unique values. Sets have become an important part of the JavaScript language and are widely used in modern JavaScript development.

Get ready to dive deep into the world of Sets in JavaScript with my comprehensive guide.

SET

A Set is a new data structure in JavaScript (introduced in ES6) that allows you to store unique values of any type. Sets are similar to arrays but do not allow duplicate values and are not indexed like arrays. This makes Sets a good choice for storing a collection of unique values, such as the data of a group of all employees.

How Sets are Different than Arrays?

1. Sets only store unique values: In a Set, all values must be unique. In contrast, the array can also hold duplicate values.

2. Sets Data Structure is not indexed, which means that like the arrays we cannot access the element by using an index.

3. Both Sets and Arrays have different built-in methods to manipulate, delete and add values to them.

Syntax and How to Create Set?

Syntax

const ourSet = new Set()
console.log(ourSet)
// Set {} (Empty Set)

Example of Set

We use 'new Set( )' constructor method

const ourSet = new Set ([ 1 , 2, true , false ])
console.log(ourSet)
//  Set(4) { 1, 2, true, false }

Discover the Power of Set Methods in JavaScript! 🚀🚀🚀

1.| add ( ) ➕

This method, adds the new value in a Set

Here is an example

const ourSet = new Set ([ 1 , 2, true , false ]);
ourSet.add(45);
console.log(ourSet)
// Set (5){ 1 , 2, true , false, 45}

2.|delete( ) 💩

This method removes the described value from a Set

Here is an example

const ourSet = new Set ([ 1 , 2, true , false ]);
ourSet.delete(1);
console.log(ourSet)
// Set (3){ 2, true , false }

3.| has( ) 🚩

This method returns true if the value is present in a Set, false otherwise

Here is an example

const ourSet = new Set ([ 1 , 2, true , false ]);
ourSet.has(2)
console.log(ourSet.has(2)); // true

4|. clear( ) ➖

This method removes all the values from the Set.

Here is an example

const ourSet = new Set([1, 2, true, false]);
ourSet.clear();
console.log(ourSet); // Set {}

5.| size( ) 🍔

This method returns the number values in the Set.

Here is an example

const ourSet = new Set([1, 2, true, false]);
console.log(ourSet.size); // 4

Iteration Over the Set

In JavaScript, there are several ways to iterate over the elements in a Set. Here are a few of the most common methods:

1. By for...of loop : This is the easiest way to iterate over the elements in a Set. The for...of loop creates a loop that iterates over the elements in a Set, allowing you to access the value of each element on each iteration.

   Here is an example :

    const ourSet = new Set([1, 2, true, false]);
    for(let elements of ourSet) console.log(elements)
    // 1
    // 2
    // true
    // false
   

2. By forEach( ) method: The forEach() method allows you to iterate over the elements in a Set and perform a specific function on each element. The forEach() method takes a callback function as an argument, which is executed once for each element in the Set.

   Here is an example :

const ourSet = new Set([1, 2, true, false]);
ourSet.forEach((value,key)=>console.log(`${key}:: ${value}`))
// 0:: 1
// 1:: 2
// 2:: true
// 3:: false

1. By the entries( ) method: The entries() method returns an iterator object that contains the key/value pairs for each element in the Set. You can use a for...of loop to iterate over the key/value pairs returned by the entries() method.

   Here is an example :

    const ourSet = new Set([1, 2, true, false]);
    for(let [_,element] of ourSet.entries()){
    console.log(element)
    }
   
    // 1
    // 2
    // true
    // false
   

   Conclusion

   

   In conclusion, sets are a useful and powerful feature in JavaScript that allows you to store and manipulate a collection of unique values. With the introduction of ECMAScript 6 (ES6), sets have become even more powerful with the addition of new methods such as forEach() and for...of loop that make it easy to iterate over the elements of a set. It is important to note that sets are unordered so the iteration may not give you the same order every time. Overall, sets are a great choice when you need to store unique values and perform common set operations such as adding, removing, and checking for the presence of elements in a collection.

   Thank You!

   

   Thank you for reading my blog about sets in JavaScript! I hope that you found it informative and useful.

   Sets are an important and powerful feature in JavaScript and I'm glad that I could share my knowledge about them with you. I understand that sometimes understanding new features and concepts may be a little tricky, I hope my blog made it a little easy for you.

   If you found this blog helpful and would like to stay updated on other topics related to JavaScript and web development, please consider subscribing to my newsletter. I'll send you updates about new blog posts and other useful resources.

   Also, I would greatly appreciate it if you could take a moment to leave a reaction and a comment on the blog post. Your feedback helps me understand what you found most valuable and what you'd like me to cover in the future.

   Thank you again for your interest in my blog, and I hope to see you soon!