Sets are an object type that let you create a collection of values that must be unique. This is useful in cases when you are faced with potential duplicates, but only want to store a single instance of that value. Any duplicates are ignored.
Sets are like these buckets: they're unique.
Creating a Set
Creating a set, like creating any object is extremely simple in JavaScript.
JAVASCRIPTconst set = new Set();
That's it, you're now ready to add elements to your set.
Add
Once you have created your set, adding elements to it is similar to adding elements to an array. Simply call the add
method on your set with the element you want to add. The element will be added to the set.
JAVASCRIPTconst set = new Set();
set.add("Facebook");
set.add("Twitter");
set.add("LinkedIn");
console.log(set);
JAVASCRIPT{"Facebook", "Twitter", "LinkedIn"}
Great, you added elements to your set, but watch what happens if you try adding Facebook
twice.
JAVASCRIPTconst set = new Set();
set.add("Facebook");
set.add("Twitter");
set.add("LinkedIn");
set.add("Facebook"); // duplicate
console.log(set);
JAVASCRIPT{"Facebook", "Twitter", "LinkedIn"}
Just as expected, the second Facebook
was ignored because it already existed in the set, and therefore was a duplicate.
Size
Sets give you a very straight-forward way to get back the size of your set. Simply use the size
property.
Using the same scenario above:
JAVASCRIPTconst set = new Set();
set.add("Facebook");
set.add("Twitter");
set.add("LinkedIn");
set.add("Facebook"); // duplicate
console.log(set.size);
JAVASCRIPT3
Our set only contains 3
elements despite having added four elements because one was a duplicate.
Has
When you want to check if a set contains an element, call the has
method on it. This method will return true
if the element is in the set, and false
if it's not.
JAVASCRIPTconst set = new Set();
set.add("Cake");
set.add("Muffin");
set.add("Donut");
console.log(set.has("Donut"));
console.log(set.has("Cookie"));
JAVASCRIPTtrue
false
Delete
Deleting an element from a set is as simple as calling the delete
method, and passing in the element you want removed. This will return true
if the element was deleted, and false
if it wasn't.
JAVASCRIPTconst set = new Set();
set.add("Cake");
set.add("Muffin");
set.add("Donut");
console.log(set);
set.delete("Cake");
console.log(set);
JAVASCRIPT{"Cake", "Muffin", "Donut"}
{"Muffin", "Donut"}
Clear
To wipe a set clean of all of its elements, call the clear
method on it. It resets a set as if you had just created a new one. This is useful if you want to start fresh.
JAVASCRIPTconst set = new Set();
set.add("Cake");
set.add("Muffin");
set.add("Donut");
set.clear(); // RIP elements
console.log(set);
JAVASCRIPT{}
Resources
- Getting Started with Svelte
- Git Tutorial: Learn how to use Version Control
- How to deploy a .NET app using Docker
- How to build a Discord bot using TypeScript
- How to deploy a Node app using Docker
- Getting Started with Sass
- Using Puppeteer and Jest for End-to-End Testing
- Learn how to build a Slack Bot using Node.js
- Building a Real-Time Note-Taking App with Vue and Firebase
- Getting Started with Vuex: Managing State in Vue
- Setting Up a Local Web Server using Node.js
- Using Axios to Pull Data from a REST API