Skip to content

Map Iteration

Map Iteration

Introduction

Maps are directly iterable, which makes them more convenient to iterate than objects.

for…of

const map = new Map([
  ['a', 1],
  ['b', 2],
  ['c', 3]
]);

// Iterate entries (default)
for (const [key, value] of map) {
  console.log(key, value);
}
// a 1
// b 2
// c 3

keys(), values(), entries()

const map = new Map([['a', 1], ['b', 2], ['c', 3]]);

// Keys
for (const key of map.keys()) {
  console.log(key); // 'a', 'b', 'c'
}

// Values
for (const value of map.values()) {
  console.log(value); // 1, 2, 3
}

// Entries
for (const entry of map.entries()) {
  console.log(entry); // ['a', 1], ['b', 2], ['c', 3]
}

forEach

map.forEach((value, key, map) => {
  console.log(`${key}: ${value}`);
});
// a: 1
// b: 2
// c: 3

Converting to Array

const map = new Map([['a', 1], ['b', 2], ['c', 3]]);

const keys = [...map.keys()];       // ['a', 'b', 'c']
const values = [...map.values()];   // [1, 2, 3]
const entries = [...map.entries()]; // [['a',1], ['b',2], ['c',3]]
const asArray = [...map];           // [['a',1], ['b',2], ['c',3]]

Summary

Maps are directly iterable with for...of
keys(), values(), entries() return iterators
forEach(callback) provides value, key, and map
Spread operator converts Map to array of entries

Further Reading