forEach() method in Javascript for key-value pairs

Question

How to print only the value(s) in the display?

let room1 = new Map();
room1.set("candles", 8)
room1.set("fridge", 1)
room1.set("washing machine", 3)
room1.set("chairs", 4)
room1.set("sofa", 2)
room1.set("jacuzzi", 6)

let text4 = "";
room1.forEach(function(key) {
  text4 += key + "<br>"
});

document.getElementById("demo8").innerHTML = text4;

<p id="demo8"></p>

Answer 1

It's 2022. Forget forEach and use for...of. It gets key-value pairs when iterating over a Map:

let room1 = new Map();
room1.set("candles", 8)
room1.set("fridge", 1)
room1.set("washing machine", 3)
room1.set("chairs", 4)
room1.set("sofa", 2)
room1.set("jacuzzi", 6)

let text4 = "";
for(let [key,value] of room1) {
  text4 += `${key} - ${value}<br>`; // this could be key+" - "+value+"<br>" of course
};

document.getElementById("demo8").innerHTML = text4;

<p id="demo8"></p>

Answer 2

There're some solutions, follow four possibilities...

1) For a better performance use for...of instead forEach:

for(let [key] of room1) {
    text4 += key + "<br>";
};

2) Short code (spread syntax) to get the keys of your Map and convert to Array:

[...room1.keys()].forEach(function(key) {
    text4 += key + "<br>"
});

3) The same of first solution but with Array.from(...) explicit:

Array.from(room1.keys()).forEach(function(key) {
    text4 += key + "<br>"
});

4) Add the first parameter value to forEach function:

room1.forEach(function(value, key) {
    text4 += key + "<br>"
});

Example:

let room1 = new Map();
room1.set("candles", 8)
room1.set("fridge", 1)
room1.set("washing machine", 3)
room1.set("chairs", 4)
room1.set("sofa", 2)
room1.set("jacuzzi", 6)

let display = document.getElementById("demo8");
for (let [key] of room1) {
  display.innerHTML += key + "<br>";
};

<p id="demo8"></p>

Reference:

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

• https://www.geeksforgeeks.org/javascript-map-foreach-method/