7 New JavaScript Set Methods
Tags: webdev, javascript, programming, typescript
Published: 2024-07-13 14:38:15

TL;DR: JavaScript’s `Set` data structure has added 7 new APIs that are very useful and can reduce the need for libraries like lodash. They are:

- [intersection()](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Set/intersection?utm_source=webdeveloper.beehiiv.com&utm_medium=newsletter&utm_campaign=7-new-javascript-set-methods) returns a new set with elements in both this set and the given set.

- [union()](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Set/union?utm_source=webdeveloper.beehiiv.com&utm_medium=newsletter&utm_campaign=7-new-javascript-set-methods) returns a new set with all elements in this set and the given set.

- [difference()](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Set/difference?utm_source=webdeveloper.beehiiv.com&utm_medium=newsletter&utm_campaign=7-new-javascript-set-methods) returns a new set with elements in this set but not in the given set.

- [symmetricDifference()](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Set/symmetricDifference?utm_source=webdeveloper.beehiiv.com&utm_medium=newsletter&utm_campaign=7-new-javascript-set-methods) returns a new set with elements in either set, but not in both.

- [isSubsetOf()](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Set/isSubsetOf?utm_source=webdeveloper.beehiiv.com&utm_medium=newsletter&utm_campaign=7-new-javascript-set-methods) returns a boolean indicating if all elements of a set are in a specific set.

- [isSupersetOf()](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Set/isSupersetOf?utm_source=webdeveloper.beehiiv.com&utm_medium=newsletter&utm_campaign=7-new-javascript-set-methods) returns a boolean indicating if all elements of a set are in a specific set.

- [isDisjointFrom()](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Set/isDisjointFrom?utm_source=webdeveloper.beehiiv.com&utm_medium=newsletter&utm_campaign=7-new-javascript-set-methods) returns a boolean indicating if this set has no elements in common with a specific set.

* * *

## 1. Set.prototype.intersection()

The `intersection()` method of `Set` instances takes a set and returns a new set containing elements in both this set and the given set.

**Venn diagram:**

 ![](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Set/intersection/diagram.svg)

**Example:**

 ![](https://media.beehiiv.com/cdn-cgi/image/fit=scale-down,format=auto,onerror=redirect,quality=80/uploads/asset/file/c6924708-aa64-44d5-95c4-48f4c4323a1d/image.png?t=1719724029)

## 2. Set.prototype.union()

The `union()` method of `Set` instances takes a set and returns a new set containing elements which are in either or both of this set and the given set.

**Venn diagram:**

 ![](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Set/union/diagram.svg)

**Example:**

 ![](https://media.beehiiv.com/cdn-cgi/image/fit=scale-down,format=auto,onerror=redirect,quality=80/uploads/asset/file/8c005186-523c-4eb6-90c4-0fe83fb74798/image.png?t=1719723996)

## 3. Set.prototype.difference()

The `difference()` method of `Set` instances takes a set and returns a new set containing elements in this set but not in the given set.

**Venn diagram:**

 ![](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Set/difference/diagram.svg)

**Example:**

 ![](https://media.beehiiv.com/cdn-cgi/image/fit=scale-down,format=auto,onerror=redirect,quality=80/uploads/asset/file/4fd50628-2073-4c13-92a1-1e5a8ee0b85a/image.png?t=1719724096)

## 4. Set.prototype.symmetricDifference()

The `symmetricDifference()` method of `Set` instances takes a set and returns a new set containing elements which are in either this set or the given set, but not in both.

**Venn diagram:**

 ![](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Set/symmetricDifference/diagram.svg)

**Example:**

 ![](https://media.beehiiv.com/cdn-cgi/image/fit=scale-down,format=auto,onerror=redirect,quality=80/uploads/asset/file/064c06c7-3e98-4d39-9022-896fa233b122/image.png?t=1719724154)

## 5. Set.prototype.isSubsetOf()

The `isSubsetOf()` method of `Set` instances takes a set and returns a boolean indicating if all elements of this set are in the given set.

**Venn diagram:**

 ![](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Set/isSubsetOf/diagram.svg)

**Example:**

 ![](https://media.beehiiv.com/cdn-cgi/image/fit=scale-down,format=auto,onerror=redirect,quality=80/uploads/asset/file/d405af6f-beb7-44ba-b842-5ce71ca8c505/image.png?t=1719724214)

## 6. Set.prototype.isSupersetOf()

The `isSupersetOf()` method of `Set` instances takes a set and returns a boolean indicating if all elements of the given set are in this set.

**Venn diagram:**

 ![](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Set/isSupersetOf/diagram.svg)

**Example:**

 ![](https://media.beehiiv.com/cdn-cgi/image/fit=scale-down,format=auto,onerror=redirect,quality=80/uploads/asset/file/cc8d72ee-1a45-45c7-b561-2dd8d8ff19c8/image.png?t=1719724355)

 ![](https://media.beehiiv.com/cdn-cgi/image/fit=scale-down,format=auto,onerror=redirect,quality=80/uploads/asset/file/473f729d-c842-46a3-a7c9-109c2e949259/image.png?t=1719724508)

## 7. Set.prototype.isDisjointFrom()

The `isDisjointFrom()` method of `Set` instances takes a set and returns a boolean indicating if this set has no elements in common with the given set.

**Venn diagram:**

 ![](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Set/isDisjointFrom/diagram.svg)

**Example:**

 ![](https://media.beehiiv.com/cdn-cgi/image/fit=scale-down,format=auto,onerror=redirect,quality=80/uploads/asset/file/002fde88-1d80-4f39-898e-a99cc979a30c/image.png?t=1719724438)

 ![](https://media.beehiiv.com/cdn-cgi/image/fit=scale-down,format=auto,onerror=redirect,quality=80/uploads/asset/file/bb249c08-b562-4d01-b94c-5b274ccc7e07/image.png?t=1719724472)

* * *

_If you find my content helpful, please_ [**_consider subscribing_**](https://webdeveloper.beehiiv.com/subscribe?utm_source=webdeveloper.beehiiv.com&utm_medium=newsletter&utm_campaign=7-new-javascript-set-methods)_. I send a_ **_weekly newsletter every Sunday_** _with the latest web development updates. Thanks for your support!_