'How to map key/value pairs of a "map" in JavaScript?

How to map key/value pairs of a "map" in JavaScript:

var map = {"a": 1, "b": 2, "c": 3};

alert(JSON.stringify(map));

I need to get an mapper containing key/value pair on each iteration:

// ["a_1", "b_2", "c_3"]
map.map((key, value) => key + "_" + value);


Solution 1:[1]

This is not a Map object. It's just a regular object. So, use Object.entries and then use map on the key value pair:

const map = {"a": 1, "b": 2, "c": 3};
const mapped = Object.entries(map).map(([k,v]) => `${k}_${v}`);
console.log(mapped);

Object.entries returns:

[["a",1],["b",2],["c",3]]

Then loop through each of those inner arrays and create the string using template literals


If you have a Map object, use Array.from(map) to get the entries of the map and use the second parameter of Array.from to go over each entry and create the desired string

Array.from(map, ([k,v]) => `${k}_${v}`)

Solution 2:[2]

It's not a map, it's an object. (You might consider using a Map, though.)

To get its properties as key/value pairs, you can use Object.entries, which you can then apply map to:

map = Object.entries(map).map(([key, value]) => key + "_" + value);

Object.entries is relatively new, but easily polyfilled for older environments.

Live Example:

var map = {"a": 1, "b": 2, "c": 3};
map = Object.entries(map).map(([key, value]) => key + "_" + value);
console.log(map);

Or, using a Map, you can use its built-in entries method, which returns an iterable, passing it into Array.from and using Array.from's mapping callback:

var map = new Map([
  ["a", 1],
  ["b", 2],
  ["c", 3]
]);
map = Array.from(map.entries(), ([key, value]) => key + "_" + value);
console.log(map);

(Or expand the iterable into an array — [...map.entries()] — and use map on it, but the above avoids a temporary throw-away array.)

In both cases, I'm using destructuring in the parameter list of the arrow function, which receives an array in [key, value] format.

Solution 3:[3]

You could take the entries of the object and join the key/value pairs.

var map = { a: 1, b: 2, c: 3 },
    result = Object.entries(map).map(a => a.join('_'));
    
console.log(result);

Solution 4:[4]

You can use Object.keys which will give an array of the keys present in that object , then use array map method on that array and access the value of each key and create a string

var map = {
  "a": 1,
  "b": 2,
  "c": 3
};

let neObj = Object.keys(map).map(item => `${item}_${map[item]}`)

console.log(neObj)

Solution 5:[5]

First [0] is for position elements and second [0] is for name key or [1] for value etc.

console.log([...map][0][0])

Example:

var map = {
  "a": 1,
  "b": 2,
  "c": 3
};
console.log([...map][0][0] + "_" + [...map][0][1])

Output:

a_1

Solution 6:[6]

Or the most simplest form would be,

let list = document.querySelector('ol');
let listitems = list.childNodes;
var list_items_array = Array.from(listitems);

let node_type_map = new Map();

node_type_map.set(1, 'Element');
node_type_map.set(2, 'Attribute');
node_type_map.set(3, 'Text Node');
node_type_map.set(8, 'comment');
node_type_map.set(9, 'Document Itself');
node_type_map.set(10, 'Doctype');

list_items_array.forEach(item => {
    console.log(node_type_map.get(item.nodeType));
})

Sources

This article follows the attribution requirements of Stack Overflow and is licensed under CC BY-SA 3.0.

Source: Stack Overflow

Solution Source
Solution 1
Solution 2
Solution 3 Nina Scholz
Solution 4 brk
Solution 5 Alexie01
Solution 6 19mddil