Set.prototype.add()

set.add(value)

The add() method inserts a new value into a Set object. If the value already exists, the Set remains unchanged. The method returns the Set itself, enabling powerful method chaining patterns.

Syntax

set.add(value)

Parameters

Parameter	Type	Description
value	any	The value to add to the Set

Return Value

Returns the same Set object after the value has been added (or ignored if duplicate). This enables method chaining.

How Uniqueness Works

Sets use strict equality (===) to determine if a value already exists. This has important implications:

• Primitives (strings, numbers, booleans, null, undefined, symbols, bigints): Compared by value
• Objects (including arrays, functions, dates): Compared by reference, not by value

// Primitives: compared by value
const nums = new Set();
nums.add(1);
nums.add(1);           // Ignored - already exists
nums.add('hello');
nums.add('hello');     // Ignored - already exists

console.log(nums.size); // 2

// Objects: compared by reference
const obj1 = { id: 1 };
const obj2 = { id: 1 };

const objects = new Set();
objects.add(obj1);
objects.add(obj2);     // Added - different object reference!

console.log(objects.size); // 2

This reference-based comparison for objects means two seemingly identical objects are considered unique unless they’re the exact same reference in memory.

Examples

Basic Usage with Primitives

const fruits = new Set();

fruits.add('apple');
fruits.add('banana');
fruits.add('cherry');

console.log(fruits.size);      // 3
console.log([...fruits]);       // ['apple', 'banana', 'cherry']

Method Chaining

Since add() returns the Set, you can chain multiple calls:

const tags = new Set()
  .add('javascript')
  .add('typescript')
  .add('rust');

console.log([...tags]); // ['javascript', 'typescript', 'rust']

Duplicates Are Ignored

Adding a value that already exists has no effect:

const colors = new Set();

colors.add('red');
colors.add('blue');
colors.add('red');    // Ignored - already exists

console.log(colors.size);    // 2
console.log([...colors]);    // ['red', 'blue']

Adding Objects (Reference-Based Uniqueness)

Objects are added based on memory reference, not content:

const users = new Set();

const alice1 = { name: 'Alice', id: 1 };
const alice2 = { name: 'Alice', id: 1 }; // Same content, different reference

users.add(alice1);
users.add(alice2);  // Added! Different object in memory

console.log(users.size); // 2

// But the same reference does nothing:
users.add(alice1);  // Ignored - same reference
console.log(users.size); // 2

Mixed Types

Sets can hold any JavaScript value:

const mixed = new Set()
  .add(42)
  .add('hello')
  .add(true)
  .add(null)
  .add({ key: 'value' })
  .add([1, 2, 3])
  .add(() => 'function');

console.log(mixed.size); // 7

Common Patterns

Deduplicating Arrays

const nums = [1, 2, 2, 3, 4, 4, 5];
const unique = [...new Set(nums)];

console.log(unique); // [1, 2, 3, 4, 5]

Building a Set Dynamically

const input = ['a', 'b', 'a', 'c', 'b', 'd'];
const uniqueChars = new Set();

for (const char of input) {
  uniqueChars.add(char);
}

console.log([...uniqueChars]); // ['a', 'b', 'c', 'd']

Tracking Unique Events

const viewedPages = new Set();

function visitPage(url) {
  viewedPages.add(url);
  console.log(`Now tracking ${viewedPages.size} unique pages`);
}

visitPage('/home');    // Now tracking 1 unique pages
visitPage('/about');   // Now tracking 2 unique pages
visitPage('/home');    // Now tracking 2 unique pages (duplicate ignored)

Gotchas

• Object comparison is by reference: Two objects with identical content are considered different if they’re separate instances
• NaN handling: Interestingly, NaN can be added to a Set once—JavaScript’s === treats NaN as equal to itself when used with Sets
• Negative zero vs positive zero: -0 and +0 are considered equal in Set operations

See Also

• set::has — check if a value exists
• set::delete — remove a value
• set::clear — remove all values