How to Convert an Array of Key-Value Pairs to a Map in TypeScript


How to Convert an Array of Key-Value Pairs to a Map in TypeScript ?

Answer

To convert an array of key-value pairs to a map in TypeScript, you can iterate over the array and insert each key-value pair into the map. This method allows you to create a map from a collection of key-value pairs stored in an array.



✐ Examples

1 Converting an Array of Arrays to a Map

We can convert an array of key-value pairs to a map in TypeScript by iterating over the array and adding each key-value pair to the map.

For example,

  1. We start by declaring and initializing an array of key-value pairs named pairs. In this example, the pairs are represented as arrays with two elements: a key and a value.
  2. We declare an empty map named myMap to store the key-value pairs.
  3. We iterate over the array using the forEach method and add each pair to the map.
  4. We print the resulting map to the console using the console.log function to verify the conversion.

TypeScript Program

const pairs: [number, number][] = [
    [1, 10],
    [2, 20],
    [3, 30],
    [4, 40],
    [5, 50]
];

// Declare an empty map to store the key-value pairs
const myMap = new Map<number, number>();

// Iterate over the array and add each pair to the map
pairs.forEach(([key, value]) => {
    myMap.set(key, value);
});

// Print the resulting map
console.log('Map from array of pairs:');
myMap.forEach((value, key) => {
    console.log(`${key}: ${value}`);
});

Output

Map from array of pairs:
1: 10
2: 20
3: 30
4: 40
5: 50

2 Converting an Array of Objects to a Map

We can convert an array of objects with key and value properties to a map in TypeScript by iterating over the array and adding each object's key-value pair to the map.

For example,

  1. We start by declaring and initializing an array of objects named pairs. In this example, each object has key and value properties.
  2. We declare an empty map named myMap to store the key-value pairs.
  3. We iterate over the array using the forEach method and add each object's key-value pair to the map.
  4. We print the resulting map to the console using the console.log function to verify the conversion.

TypeScript Program

interface Pair {
    key: number;
    value: number;
}

const pairs: Pair[] = [
    { key: 1, value: 10 },
    { key: 2, value: 20 },
    { key: 3, value: 30 },
    { key: 4, value: 40 },
    { key: 5, value: 50 }
];

// Declare an empty map to store the key-value pairs
const myMap = new Map<number, number>();

// Iterate over the array and add each object's key-value pair to the map
pairs.forEach(({ key, value }) => {
    myMap.set(key, value);
});

// Print the resulting map
console.log('Map from array of objects:');
myMap.forEach((value, key) => {
    console.log(`${key}: ${value}`);
});

Output

Map from array of objects:
1: 10
2: 20
3: 30
4: 40
5: 50

3 Converting a List of Pairs to a Map

We can convert a list of key-value pairs to a map in TypeScript by iterating over the list and adding each key-value pair to the map.

For example,

  1. We start by declaring and initializing a list of key-value pairs named pairs. In this example, the pairs are represented as arrays with two elements: a key and a value.
  2. We declare an empty map named myMap to store the key-value pairs.
  3. We iterate over the list using the forEach method and add each pair to the map.
  4. We print the resulting map to the console using the console.log function to verify the conversion.

TypeScript Program

const pairs: [number, number][] = [
    [1, 10],
    [2, 20],
    [3, 30],
    [4, 40],
    [5, 50]
];

// Declare an empty map to store the key-value pairs
const myMap = new Map<number, number>();

// Iterate over the list and add each pair to the map
pairs.forEach(([key, value]) => {
    myMap.set(key, value);
});

// Print the resulting map
console.log('Map from list of pairs:');
myMap.forEach((value, key) => {
    console.log(`${key}: ${value}`);
});

Output

Map from list of pairs:
1: 10
2: 20
3: 30
4: 40
5: 50

Summary

In this tutorial, we learned How to Convert an Array of Key-Value Pairs 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 ?