How to Add a Key-Value Pair to a Map in TypeScript


How to Add a Key-Value Pair to a Map in TypeScript ?

Answer

To add a key-value pair to a map in TypeScript, you can use the set method.



✐ Examples

1 Adding a Key-Value Pair Using set Method

We can add a key-value pair to a map in TypeScript using the set method, which adds or updates an element with a specified key and value.

For example,

  1. We start by declaring and initializing a map named myMap with some key-value pairs. In this example, the map has string keys and integer values.
  2. We use the set method to add a new key-value pair to the map. The set method takes two arguments: the key and the value to be added.
  3. We print the updated map to the console using the forEach method and console.log.

TypeScript Program

let myMap: Map<string, number> = new Map([
    ['one', 1],
    ['two', 2],
    ['three', 3]
]);

// Add a key-value pair using set method
myMap.set('four', 4);

// Print the updated map
myMap.forEach((value, key) => {
    console.log(`${key}: ${value}`);
});

Output

one: 1
two: 2
three: 3
four: 4

2 Adding Multiple Key-Value Pairs Using set Method

We can add multiple key-value pairs to a map in TypeScript using the set method.

For example,

  1. We start by declaring and initializing a map named myMap with some key-value pairs. In this example, the map has string keys and integer values.
  2. We use the set method to add multiple new key-value pairs to the map. The set method takes two arguments: the key and the value to be added.
  3. We print the updated map to the console using the forEach method and console.log.

TypeScript Program

let myMap: Map<string, number> = new Map([
    ['one', 1],
    ['two', 2],
    ['three', 3]
]);

// Add multiple key-value pairs using set method
myMap.set('four', 4);
myMap.set('five', 5);

// Print the updated map
myMap.forEach((value, key) => {
    console.log(`${key}: ${value}`);
});

Output

one: 1
two: 2
three: 3
four: 4
five: 5

3 Updating an Existing Key-Value Pair Using set Method

We can update an existing key-value pair in a map in TypeScript using the set method, which updates the value of a specified key if it already exists.

For example,

  1. We start by declaring and initializing a map named myMap with some key-value pairs. In this example, the map has string keys and integer values.
  2. We use the set method to update the value of an existing key in the map. The set method takes two arguments: the key and the new value to be assigned.
  3. We print the updated map to the console using the forEach method and console.log.

TypeScript Program

let myMap: Map<string, number> = new Map([
    ['one', 1],
    ['two', 2],
    ['three', 3]
]);

// Update an existing key-value pair using set method
myMap.set('two', 22);

// Print the updated map
myMap.forEach((value, key) => {
    console.log(`${key}: ${value}`);
});

Output

one: 1
two: 22
three: 3

Summary

In this tutorial, we learned How to Add a Key-Value Pair to a Map in TypeScript language with well detailed examples.




More TypeScript Maps Tutorials

  1. How to create an Empty Map in TypeScript ?
  2. How to create a Map with Initial Key-Value Pairs in TypeScript ?
  3. How to Print a Map in TypeScript ?
  4. How to Add a Key-Value Pair to a Map in TypeScript ?
  5. How to Set a Default Value for a Key in a Map in TypeScript ?
  6. How to Update the Value for a Key in a Map in TypeScript ?
  7. How to Check if a Map is Empty in TypeScript ?
  8. How to Check if a Key Exists in a Map in TypeScript ?
  9. How to Check if a Value Exists in a Map in TypeScript ?
  10. How to Get the Value Associated with a Key in a Map in TypeScript ?
  11. How to Remove a Key-Value Pair from a Map in TypeScript ?
  12. How to Remove Key-Value Pairs from a Map Based on Values in TypeScript ?
  13. How to Clear All Key-Value Pairs from a Map in TypeScript ?
  14. How to Iterate Over Keys in a Map in TypeScript ?
  15. How to Iterate Over Values in a Map in TypeScript ?
  16. How to Iterate Over Entries (Key-Value Pairs) in a Map in TypeScript ?
  17. How to Get the Size (Number of Key-Value Pairs) of a Map in TypeScript ?
  18. How to Convert a Map to an Array of Keys in TypeScript ?
  19. How to Convert a Map to an Array of Values in TypeScript ?
  20. How to Convert a Map to an Array of Key-Value Pairs in TypeScript ?
  21. How to Merge Two Maps in TypeScript ?
  22. How to Copy a Map in TypeScript ?
  23. How to Check if Two Maps are Equal in TypeScript ?
  24. How to Sort a Map by Keys in TypeScript ?
  25. How to Sort a Map by Values in TypeScript ?
  26. How to Filter a Map Based on Keys in TypeScript ?
  27. How to Filter a Map Based on Values in TypeScript ?
  28. How to Reduce Values in a Map to a Single Value in TypeScript ?
  29. How to Convert an Array of Key-Value Pairs to a Map in TypeScript ?
  30. How to Convert a Map to a JSON String in TypeScript ?
  31. How to Convert a JSON String to a Map in TypeScript ?
  32. How to Swap Keys and Values in a Map in TypeScript ?
  33. How to Create a Map of Maps in TypeScript ?
  34. How to Iterate Over a Map of Maps in TypeScript ?