Question 88773 in Html Question posted in
Some basic documentation can be found here.

How to iterate two maps in the javascript based on index – Html

I just created two maps in the javascript by using below lines of code.

let myMap = new Map();
let myMap1 = new Map();

I just added the below data in the respective map.

//The below is just for example and the actual is different

myMap1 = new Map([
  ['country', 'Chile'],
  ['age', 30],
]);

myMap = new Map([
  ['country', 'Austria'],
  ['age', 20],
]);

There is a reason to keep the two map here because in the real time I’m trying to get the data from two different schema to store two different data in the Maps.

Now, I’m trying to iterate the both Map in the below order

Iteration-1 : country, Chile, country, Austria. //Index 0 from both the maps

Iteration-2 : age, 30 , age, 20.  // Index 1 from both the maps.

I just want to iterate both the Maps in the single forEach and I want to take both index value and key and pass it for other logical operations.

Can someone assist me to solve this?

I tried the below way to iterate one Map but not sure how to do for two Maps

myMap.forEach (function(value, key) {
                            let array = key.split(":::");
                            htmlSkelton += 
                            "<tr>"+
                            "<th scope='row'>"+(counter++) +"</th>"+
                            "<td>"+array[1]+"</td>"+
                            "<td>"+array[0]+"</td>"+
                            "<td>"+value+"</td>"+
                            "</tr>"
                          })
Tags:

3

Answers


  1. 0

    Since both maps have the same keys, you can simply iterate over one map, and use its keys to access the other map.

    myMap1 = new Map([
  ['country', 'Chile'],
  ['age', 30],
]);

myMap2 = new Map([
  ['country', 'Austria'],
  ['age', 20],
]);

myMap1.forEach((v1, k) => {
  let v2 = myMap2.get(k);
  console.log(k, v1, v2);
});
    Login or Signup to reply.
  2. 0

    Use string interpolation instead of concatenation to make the code more readable:

    const map1 = new Map([
  ['country', 'Chile'],
  ['age', 30],
]);

const map2 = new Map([
  ['country', 'Austria'],
  ['age', 20],
]);

map1.forEach((v1, k) => {
  const v2 = map2.has(k) ? map2.get(k) : null;
  console.log(`${k}: ${v1}, ${v2}`);
});

    There are several ways to do this, see if this one fully suits you.

    Login or Signup to reply.
  3. 0

    It seams reduce can be used here. Complexity is O(n), additional memory is required for an aggregate array:

    const map1 = new Map([
  ['country', 'Chile'],
  ['age', 30],
]);

const map2 = new Map([
  ['country', 'Austria'],
  ['age', 20],
]);

const arr = [...map1.entries(), ...map2.entries()];

/** 
 * Generates a structure like: 
 * {
 *   age: [30, 20],
 *   country: ["Chile", "Austria"]
 * }
 */
const result = arr.reduce((acc, [k, v]) => {
  if (acc[k]) {
    acc[k].push(v);
  } else {
    acc[k] = [v];
  }
  return acc;
}, {});


console.log(result);
    Login or Signup to reply.
Please signup or login to give your own answer.

Back To Top
Search