how to map the array data using javascript-CodePudding

let userData = {
  myData: [{
      id: 1,
      name: 'Russell',
      country: 'Windes'
    },
    {
      id: 2,
      name: 'Smith',
      country: 'USA'
    }
  ],
  ownerData: [{
      id: 3,
      name: 'Watson',
      country: 'Australia'
    },
    {
      id: 4,
      name: 'Marcus',
      country: 'England'
    }
  ]
};

let records = arrayMapped(userData)
  .then(res => console.log(res));


async function arrayMapped(user) {
  let best4 = [];

  user.myData.forEach(async(res, i) => {

    res.myTeam = [];

    user.ownerData.forEach(async(myTeam, j) => {
      res.myTeam = myTeam;
    });

    best4.push(res);

  });

  return best4;
}

array pushing behaving weired

I was expecting myTeam id 3 should be under 1 id and myTeam 4 id would be under id 2.

but currently it is taking 4 id to all what is the reason please guide

Thanks

CodePudding user response：

It seems like you want to iterate over the two arrays in parallel, so you shouldn't use nested loops. Just use the index of the myData loop as the index into the ownerData array.

let userData = {
  myData: [{
      id: 1,
      name: 'Russell',
      country: 'Windes'
    },
    {
      id: 2,
      name: 'Smith',
      country: 'USA'
    }
  ],
  ownerData: [{
      id: 3,
      name: 'Watson',
      country: 'Australia'
    },
    {
      id: 4,
      name: 'Marcus',
      country: 'England'
    }
  ]
};

let records = arrayMapped(userData)
  .then(res => console.log(res));

async function arrayMapped(user) {
  let best4 = [];

  user.myData.forEach(async(res, i) => {
    res.myTeam = user.ownerData[i];
    best4.push(res);
  });

  return best4;
}

I notice that you have the functions declared async, but they don't do anything asynchronously. If the real functions do, see Using async/await with a forEach loop