How to use .map() over Map keys in Javascript

Question

When using the Javascript built in Map , how do you use .map() to iterate over the keys?

I know the for...of can be used as shown below:

const map = new Map();

map.set(0, 'Zero');
map.set(1, 'One');
map.set(2, 'Two');

for (let key of map.keys()) {
  console.log(key);
}

But this code will fail:

map.keys().map(key => {
  console.log(key);
});

Answer 1

It's Array.prototype.map actually, it's defined for arrays, so use Array.from to convert the keys to an array and then use map :

 const map = new Map(); map.set(0, 'Zero'); map.set(1, 'One'); map.set(2, 'Two'); Array.from(map.keys()).map(key => { console.log(key); });

Answer 2

You can use Array.from() :

 const map = new Map(); map.set(0, 'Zero'); map.set(1, 'One'); map.set(2, 'Two'); Array.from(map.keys()).map(key => { console.log(key); });

Hopefully that helps!

Answer 3

Map.keys() returns an iterator you can spread the iterator using spread syntax

 const map = new Map(); map.set(0, 'Zero'); map.set(1, 'One'); map.set(2, 'Two'); [...map.keys()].forEach(key => { console.log(key); })

Answer 4

You might be better off using Array.from mapping function directly to avoid creating a temporary array:

Array.from(map.keys(), k => console.log(k))

Another, more verbose, but helpful option would be to redefine array iteration methods on the iterator prototype, thus making them automatically available for all iterators:

 // http://www.ecma-international.org/ecma-262/7.0/#sec-%iteratorprototype%-object const IteratorPrototype = Object.getPrototypeOf(Object.getPrototypeOf([][Symbol.iterator]())); Object.defineProperties(IteratorPrototype, { forEach: { value: function (fn) { let n = 0; for (let x of this) { fn(x, n++, this); } }, enumerable: false }, map: { value: function (fn) { let n = 0, a = []; for (let x of this) { a.push(fn(x, n++, this)); } return a; }, enumerable: false }, reduce: { value: function (fn, init) { let n = 0; if (arguments.length === 1) { init = this.next().value; } for (let x of this) { init = fn(init, x, n++, this); } return init; }, enumerable: false }, }); ///// const map = new Map(); map.set('a', 'Zero'); map.set('b', 'One'); map.set('c', 'Two'); map.keys().map(console.log) console.log(map.values().reduce((o, k) => o + '/' + k)); function* it() { yield 'x'; yield 'y'; yield 'z'; } it().map(x => console.log(x))

Answer 5

map.forEach((_,key) => console.log(key));

Answer 6

As other answers point out, map is an Array method, so you have to convert the iterable returned by map.keys() to an array first. This is less efficient than using a for loop because there the conversion isn't required. In a library I've written there is a function that maps an iterable to another iterable without creating an array:

export const mapIterable = <From, To>(project: (value: From) => To) =>
  function* (iterable: Iterable<From>): IterableIterator<To> {
    for (const value of iterable) {
      yield project(value);
    }
  };

You'd normally use with a ponyfill for the pipeline operator .