JS Capsules: Sets

JS Capsules: Sets

Divine Orji's photo
Divine Orji
·Sep 23, 2022·

3 min read

Subscribe to my newsletter and never miss my upcoming articles

Table of contents

  • Introduction
  • Syntax
  • Properties and Methods
  • Conclusion
  • Resources

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.

Resources

 
Share this