Introduction
A Set is a collection of unique values. The emphasis on unique is because a Set cannot store the same data more than once. It stores each piece of data as a unique key with an inherent value of true.
It was introduced in JavaScript ES6 and can store primitive data types and objects.
Syntax
new Set(x);
// -> where x is an iterable i.e.: a string or an array
// -> if there is no 'x', it starts as an empty Set
One use case for Set is storing user ids. To illustrate:
const userIDs = new Set();
const ab001c = { firstName: 'Mark', lastName: 'Cuban' };
const ab002c = { firstName: 'Jeff', lastName: 'Bezos' };
const ab003c = { firstName: 'Bill', lastName: 'Gates' };
userIDs.add(ab001c); // adds ab001c to the Set
userIDs.add(ab002c); // adds ab002c to the Set
userIDs.add(ab003c); // adds ab003c to the Set
userIDs.add(ab001c); // will not add ab001c to the Set, because it already exists
Here, you created a new Set object for userIDs and added some user ids to it. If a user id already exists in the set, it will not be re-added.
Properties and Methods
Properties
Set.prototype.size: This property returns the number of values in a given set.
For instance:
console.log(userIDs.size);
// 3
Methods
Set.prototype.add(): Adds data to your set. If the data already exists, it does not add it.
const ab004c = { firstName: 'Warren', lastName: 'Buffet' };
userIDs.add(ab004c); // Adds ab004c to userIDs
Set.prototype.delete(): Removes data from your set. If the data does not exist, nothing gets deleted.
userIDs.delete(ab001c); // Deletes ab001c from userIDs
userIDs.delete(ab005c); // ab005c does not exist, so nothing gets deleted
Set.prototype.has(): Checks if the specified data exists in your set and returns a boolean.
userIDs.has(ab003c); // returns true because ab003c exists
userIDs.has(ab001c); // returns false because ab001c no longer exists
Set.prototype.entries(): Returns an Iterator object with data from your set in [value, value] pairs.
userIDs.entries();
/*
[Set Entries] {
[
{ firstName: 'Jeff', lastName: 'Bezos' },
{ firstName: 'Jeff', lastName: 'Bezos' }
],
[
{ firstName: 'Bill', lastName: 'Gates' },
{ firstName: 'Bill', lastName: 'Gates' }
],
[
{ firstName: 'Warren', lastName: 'Buffet' },
{ firstName: 'Warren', lastName: 'Buffet' }
]
}
*/
Set.prototype.values(): Returns an Iterator object with all the values in your set.
userIDs.values();
/*
[Set Iterator] {
{ firstName: 'Jeff', lastName: 'Bezos' },
{ firstName: 'Bill', lastName: 'Gates' },
{ firstName: 'Warren', lastName: 'Buffet' }
}
*/
Set.prototype.keys(): Returns an Iterator object with all the values in your set, same as Set.prototype.values().
Set.prototype.forEach(): Executes a callback function on each value in your set.
userIDs.forEach((x) => console.log(x));
// logs each value in userIDs to your console
Set.prototype.clear(): Deletes all values from a set.
userIDs.clear();
console.log(userIDs); // Set(0) {}
Conclusion
This article taught you about JavaScript’s Set object and how to work with it. To learn more about Set, check out these resources below.