The Basics: JavaScript Set

Set is one of a handful of Data Structures built into the JavaScript language. It is similar to the Array in that is it used to store a a collection of data with one key difference, it doesn't allow duplicate entries.

You rarely ever see Set used in the wild compared to other Data Structures, and that's not by chance. It has a very limited set of APIs, making it less suitable for most use cases. As a matter of fact, other than ensuring uniqueness of data, it doesn't seem like it has much use.

Let's take a look at how to create and use Sets

Creating a Set

var uniqueData = new Set()

Unlike Array and Object which have reserved characters for creating a new instance, there is only one way to create a Set, and that is by using the new Set() constructor

The Set() constructor take 0 or 1 argument which MUST be an iterable or an Array-like value (String, Array). In more technical terms, the argument must implement the iterator protocol

// All valid ways to create a set ✅
var uniqueList = new Set()
var uniqueList = new Set(undefined)✅
var uniqueList = new Set([1, 2])✅
var uniqueList = new Set("12")✅

// Number, Boolean, and Object, are not valid arguments ❌
var uniqueData = new Set(1)
var uniqueData = new Set({})
var uniqueData = new Set(false)

Set Operations

Add

var uniqueList = new Set()
uniqueList.add(2)

The add() method, like the name suggests, is used to add an item to a set. It accepts any type of value, and returns the set, including the newly added item. If the item already exists, add() does nothing and just returns the set unchanged. Because the add() method returns the set, you could chain multiple add() methods

uniqueList.add(3).add(4)

or other set methods

uniqueList.add(3).delete(3)

Delete

var uniqueList = new Set()
uniqueList.add(1)

uniqueList.delete(1) // deletes 1 from the set

delete() removes an item from a set if it exists, and does nothing otherwise. It returns true if the item was deleted successfully and false if the item doesn't exist in the set

Has

var uniqueList = new Set()
uniqueList.add(1)

uniqueList.has(1) // true
uniqueList.has(2) // false

.has() checks for the occurrence of an item within a set. It returns true or false depending on whether the item exists

Clear

var uniqueList = new Set()
uniqueList.add(1)
uniqueList.add(2)

uniqueList.clear() // removes both 1 and 2

.clear() deletes every item from a set

Keys, Values

.values() returns an Iterator that we can use to loop over the values in the Set. Not to be confused with the implementation of Object.values(object) which returns an Array

var uniqueList = new Set()
uniqueList.add(1)
uniqueList.add(2)

for (var value of uniqueList.values()) {
  console.log(value) //
}

// 1
// 2

.keys() has the exact same functionality of .values() and is basically just an alias

Entries

.entries() returns an Iterator just like .values(), with the only difference being that it returns a two-element Array for every iteration. But since Sets have no keys, the value just gets repeated twice. So what's the point you ask? Apparently it's solely > to keep the API similar to the Map object

var uniqueList = new Set()
uniqueList.add(1)
uniqueList.add(2)

for (var value of uniqueList.entries()) {
  console.log(value) //
}

// [1, 1]
// [2, 2]