/
/
Quick Intro to Sets in JavaScript
Share on facebook
Share on twitter
Share on linkedin
Share on whatsapp
Share on email

Quick Intro to Sets in JavaScript

Sets in JavaScript are a new data type that provides an efficient way to work with unique values. They allow you to determine if one value is present in the collection quickly, and they can be used as iterators, which means we can use them for loops without needing any additional code other than the set itself.

📌 To explore sets further, let’s look at some examples of what they’re capable of doing. Sets come with some pretty cool features:

  • Sets don’t have duplicate members, so it’s easy to know if one has been added or removed from the set (no more worrying about duplicates!).
  • We can also use sets as iterators, which means we don’t need any special looping logic when using.

📌 If you’re looking to learn more about how they work, this blog post is the place to be! Let’s get started! We’ll go over what sets are and their use cases and some best practices when working with them.

🧯Creating New Sets In JavaScript.

When you want to create sets in javascript, you always do it with the set constructor set(), preceded by the new keyword.

const mySet = new Set();

🧯Set.add() – Adding values to Sets.

You can add values to a set using the add() method. This method accepts either one value or an iterable. Iterable means an array of values.

mySet.add('JS');
mySet.add(314);
mySet.add(false);
mySet.add({ name: 'Ron' });

console.log(mySet); // Output: 👉 mySet {"JS", 314, false, {name: "Ron"}}

🧯Set.remove() – Removing values from Sets.

Using the delete() method, You pass the value as an argument when you call it. If deletion is successful, delete() will return true. If not, it will return false.

const fruitSet = new Set(['🍍', '🍎', '🍇']);
fruitSet.delete('🍇');

console.log(fruitSet); // Output: 👉 fruitSet {"🍍", "🍎"}

🧯Set.clear() – Removing all values from Sets.

Sometimes, you may want to remove all values from the set. This can be done using the clear() method.

const myVegSet = new Set(['🥕', '🌶️ ', '🌽']);
myVegSet.clear();

console.log(myVegSet); // Output: 👉 myVegSet {}

🧯Set.has() – Checking for existing values in Sets.

The has() method is probably the simplest way to test if the set contains a specific value.

const junkFoodSet = new Set(['🍕', '🍔']);

junkFoodSet.has('🍕'); // Output: 👉 true
junkFoodSet.has('🍰 '); // Output: 👉 false

🧯 Set.size() – Finding out how big a set is size.

When you want to know how many items are in an array, you can use its length property.

const skillSet = new Set(['JavaScript', 'React', 'HTML', 'CSS']);

console.log(skillSet.size); // Output: 👉 4

🧯How To Iterating over Sets with .forEach().

const sportSet = new Set(['⚽️ ', '🏀', '🏈']);
sportSet.forEach((sport) => {
    console.log(sport);
}); 

// Output: 👉 "⚽" "🏀, "🏈"

Conclusion 🎁

Now you know what sets are in JavaScript and how to create them. Next, try out some of these examples for yourself. You may have a basic understanding of the data structures now, but there is always more to learn! I hope this article helped clarify any misconceptions so that you can continue learning about JavaScript through our blog posts. Happy coding!

Recent Snippet

How to use reduce over an array of objects

To get the maximum or the minimum value from an array, we can use Math.max() and pass as arguments the numbers from which we want to pick.

How to get the highest or the lowest value in an array

To get the maximum or the minimum value from an array, we can use Math.max() and pass as arguments the numbers from which we want to pick.