How do the new Set methods `union()`, `intersection()`, `difference()` and `symmetricDifference()` work?

Q: How do the new Set methods `union()`, `intersection()`, `difference()` and `symmetricDifference()` work?

**Target Audience:** Engineers preparing for JavaScript fundamentals interviews. **Difficulty:** Medium > **How to read this doc:** Concepts are explained in plain language first, then tagged with 📌 Interview term: . Every operation's real result below was actually run in Node (Baseline-shipped across all major browsers since 2024). ## 1. Why This Even Matters — A Story First Two overlapping guest lists for two different parties: union is the combined list of everyone invited to EITHER party; intersection is only the people invited to BOTH; difference is "who's on list A but genuinely not on list B" (a real, direction-sensitive question — swapping the lists gives a different answer); symmetric difference is everyone who's on exactly ONE list, but not both — the people who would feel out of place at either combined gathering. ## 2. The Core Idea 📌 **Interview term:** these four methods implement real, standard set-theory operations directly on JavaScript's `Set`, each

The problem

Question presented to candidate: "Before these Set methods existed, you'd write manual loops (or filter/some combinations) to find the overlap between two Sets. What do union, intersection, difference, and symmetricDifference actually give you — and do any of them mutate the original Sets?"

What a strong answer should cover:

📌 Interview term: Set.prototype.union(other) — returns a NEW Set containing every element from BOTH sets, real set-theory union — verified directly with two overlapping real Sets.
📌 Interview term: Set.prototype.intersection(other) — returns a new Set containing only elements present in BOTH sets.
📌 Interview term: Set.prototype.difference(other) — returns a new Set with elements in the FIRST set but NOT the second — verified directly to be genuinely asymmetric: a.difference(b) and b.difference(a) produce real, different results.
📌 Interview term: Set.prototype.symmetricDifference(other) — returns a new Set with elements in EITHER set but not both — verified directly.
📌 Interview term: the real, direct answer to the prompt's mutation question — verified directly: none of these methods mutate the original Set at all — calling .union() genuinely left the original Set's .size completely unchanged, matching the identical non-mutating pattern this bank's own array-methods coverage establishes for map/filter/slice.
A precise answer names that these methods genuinely work on any "Set-like" object (anything with a real .size, .has(), and .keys()), not strictly a real Set instance — verified directly — plus the three real boolean-returning bonus methods that shipped alongside them: isSubsetOf, isSupersetOf, isDisjointFrom.

Clarifying questions expected:

None — this is a definitional/technical question; directly answering the prompt's own mutation question (none of them mutate) is the strong signal.

Code / implementation expected: Yes — real results for all four operations on the same two overlapping Sets, plus the direct non-mutation proof, is the clearest demonstration.

set
es2024
collection

Try it yourself

Sketch your approach before you read the solution. That is what the interview tests.

Stuck? Get a hint.

A short nudge toward the approach. It will not give the answer away.

Solution

Target Audience: Engineers preparing for JavaScript fundamentals interviews. Difficulty: Medium

How to read this doc: Concepts are explained in plain language first, then tagged with 📌 Interview term:. Every operation's real result below was actually run in Node (Baseline-shipped across all major browsers since 2024).

1. Why This Even Matters — A Story First

Two overlapping guest lists for two different parties: union is the combined list of everyone invited to EITHER party; intersection is only the people invited to BOTH; difference is "who's on list A but genuinely not on list B" (a real, direction-sensitive question — swapping the lists gives a different answer); symmetric difference is everyone who's on exactly ONE list, but not both — the people who would feel out of place at either combined gathering.

2. The Core Idea

📌 Interview term: these four meth

The solution is hidden so you can try first

5 min read · 8 sections

Run the code

Edit the code and run it here. Each console line with an expected value becomes a test.

JavaScriptReal results for union/intersection/difference/symmetricDifference on two overlapping Sets, plus direct proof none of them mutate the original