TypeScript Set

Note: If you're new to TypeScript, check our Getting Started with TypeScript tutorial first.

In TypeScript, a Set is a built-in object that stores unique values of any type, ensuring that no duplicate values are allowed.

// Create a new Set that only holds numbers
const numbers = new Set<number>();

// Add items to the Set
numbers.add(1);
numbers.add(2);
numbers.add(1); // Duplicate, will be ignored

console.log(numbers); 

// Output: Set(2) { 1, 2 }

Create TypeScript Set

In TypeScript, you can create a Set using the new Set() constructor. You can also specify the type of elements it will hold using generics.

// Create an empty Set of numbers
const set1 = new Set<number>();
console.log(set1);

Output

Set(0) {}

Here, we have created an empty set. You can directly insert values in the set while creating it as:

const set1 = new Set<number>([10, 20, 30]);
console.log(set1); // Output: Set(3) { 10, 20, 30 }

// Create a Set of strings
const stringSet = new Set<string>(["apple", "banana", "cherry"]);
console.log(stringSet); 

// Create a Set of any type (mixed types)
const anySet = new Set<any>([1, "hello", { count: true }]);
console.log(anySet); 

Set(3) { 'apple', 'banana', 'cherry' }
Set(3) { 1, 'hello', { count: true } }

Adding New Elements

You can add elements to a Set using the add() method. For example,

const set1 = new Set<number>([10, 20,30]);

set1.add(40);
set1.add(50);
set1.add(20);

console.log(set1);

Output

Set(5) { 10, 20, 30, 40, 50 }

Here, we have added elements 40 and 50 to the Set.

Notice how we tried to add the duplicate value 20, but it was ignored because a Set only stores unique values.

Access Set Elements

You can access Set elements using the values() method, and check if an element exists using the has() method. For example,

const set1 = new Set<number>([1, 2, 3]);

// Access the elements of a Set
console.log(set1.values()); 

// Check if an element exists in the Set
console.log(set1.has(1)); 

Output

[Set Iterator] { 1, 2, 3 }
true

Removing Elements

You can remove elements using the delete() method, or clear the entire Set using the clear() method. For example,

const set1 = new Set<number>([1, 2, 3]);

// Remove a specific element
set1.delete(2);
console.log(set1.values()); // [Set Iterator] { 1, 3 }

// Remove all elements
set1.clear();
console.log(set1.values()); // [Set Iterator] {  }

Output

[Set Iterator] { 1, 3 }
[Set Iterator] {  }

Iterate Sets

You can iterate through a Set using a for...of loop or the forEach() method. Let's take a look at an example using the for...of loop.

const set1 = new Set<number>([1, 2, 3]);

// Loop through the Set
for (let value of set1) {
    console.log(value);
}

Output

1
2
3

TypeScript WeakSet

A WeakSet is similar to a Set, but it can only contain object types — primitive types like numbers and strings are not allowed. For example,

const weakSet = new WeakSet<object>();

let obj = { message: 'Hi', sendMessage: true };

// Add an object to the WeakSet
weakSet.add(obj);

console.log(weakSet); 

Output

WeakSet { <items unknown> }

The output WeakSet { <items unknown> } is normal — TypeScript (or JavaScript) hides WeakSet contents to support memory management, since its items can be garbage collected.

WeakSet Methods

WeakSets are not iterable and do not have size(), keys(), or values() methods.

Key Differences: Set vs. WeakSet

Also Read:

• TypeScript Object Type