TypeScript Map

This tutorial will teach the Map data structure in TypeScript with Examples.

TypeScript Map allows you to store key-value pairs, similar to the maps in other programming languages e.g. Java HashMap.

TypeScript Map Basic Usage

// Create a new Map
const myMap = new Map();

// Set values
myMap.set("key1", "value1");
myMap.set("key2", "value2");

// Get values
console.log(myMap.get("key1")); // Output: "value1"
console.log(myMap.get("key2")); // Output: "value2"

// Check if a key exists
console.log(myMap.has("key1")); // Output: true

// Get the number of key-value pairs
console.log(myMap.size); // Output: 2

// Delete a key-value pair
myMap.delete("key2");

// Check if a key exists (after deletion)
console.log(myMap.has("key2")); // Output: false

// Clear the Map
myMap.clear();

// Check the size of the Map (after clearing)
console.log(myMap.size); // Output: 0

Output:

"value1" 
"value2" 
true 
2 
false 
0 

• myMap.set(key, value) – adds a new entry in the Map.
• myMap.get(key) – retrieves the value for a given key from the Map. 
• myMap.has(key) – checks if a key is present in the Map. Returns true or false. 
• myMap.size – returns the count of entries in the Map. 
• myMap.delete(key) – deletes a key-value pair using its key. If the key is found and deleted, it returns true, else returns false. 
• myMap.clear() – deletes all entries from the Map.

Iterating over Map

const myMap = new Map();
myMap.set("key1", "value1");
myMap.set("key2", "value2");
myMap.set("key3", "value3");

// Iterate over keys
for (const key of myMap.keys()) {
  console.log(key);
}
// Output:
// "key1"
// "key2"
// "key3"

// Iterate over values
for (const value of myMap.values()) {
  console.log(value);
}
// Output:
// "value1"
// "value2"
// "value3"

// Iterate over entries (key-value pairs)
for (const [key, value] of myMap.entries()) {
  console.log(key, value);
}
// Output:
// "key1" "value1"
// "key2" "value2"
// "key3" "value3"

Iterating over keys:

for (const key of myMap.keys()) {
  console.log(key);
}

This loop iterates over the map's keys using the keys() method. The loop body logs each key to the console. In this case, it will output:

"key1"
"key2"
"key3"

Iterating over values:

for (const value of myMap.values()) {
  console.log(value);
}

This loop iterates over the values of the map using the values() method. The loop body logs each value to the console. The output will be:

"value1"
"value2"
"value"

Iterating over entries (key-value pairs):

for (const [key, value] of myMap.entries()) {
  console.log(key, value);
}

This loop iterates over the entries (key-value pairs) of the map using the entries() method. The loop body logs each key-value pair to the console. The output will be:

"key1" "value1"
"key2" "value2"
"key3" "value"

Using Objects as Keys

const myMap = new Map();

const key1 = { id: 1 };
const key2 = { id: 2 };

myMap.set(key1, "value1");
myMap.set(key2, "value2");

console.log(myMap.get(key1)); // Output: "value1"
console.log(myMap.get(key2)); // Output: "value2"

In this above example, objects are used as keys. The Map uses strict equality (===) to compare keys, so two objects with the same properties/values are considered different keys. This allows you to use objects as keys and retrieve their corresponding values from the Map.