fetching async await data outside map function in node js / javascript

Question

let object = [{
  id: `01`, name: `fish`, type: `marine`,
}, {
  id: `02`, name: `fish`, type: `fresh`,
}, {
  id: `03`, name: `fish`, type: `tank`,
}, {
  id: `04`, name: `animal`, type: `pet`,
}, {
  id: `05`, name: `animal`, type: `wild`,
}, {
  id: `06`, name: `animal`, type: `zoo`,
}, {
  id: `07`, name: `food`, type: `veg`,
}, {
  id: `08`, name: `food`, type: `non-veg`,
}]

let data = []
object.map((value) => {
  data.push([value.name, value.type])
})

console.log(data)

I can fetch data outside the map function in first example but in second second example i can't fetch data

let object = [{
  id: `01`, name: `fish`, type: `marine`,
}, {
  id: `02`, name: `fish`, type: `fresh`,
}, {
  id: `03`, name: `fish`, type: `tank`,
}, {
  id: `04`, name: `animal`, type: `pet`,
}, {
  id: `05`, name: `animal`, type: `wild`,
}, {
  id: `06`, name: `animal`, type: `zoo`,
}, {
  id: `07`, name: `food`, type: `veg`,
}, {
  id: `08`, name: `food`, type: `non-veg`,
}]
    
let data=[];
let test;
object.map(async (value) => {
  test = await getValue(value.name);
  data.push([value.name,value.type,test]);            
})
console.log(data);

As in first example i can easily fetch data outside the map function fut in second function I am getting blank array how can i fetch async await data outside map function

where am i doing wrong i don't get it

getvalue() is my function which value contain in promise so that's why i am using async await to fetch value @brk — , Jul 20 '21 at 04:48
Does this answer your question? [Using async/await with a forEach loop](https://stackoverflow.com/questions/37576685/using-async-await-with-a-foreach-loop) — coagmano, Jul 20 '21 at 05:17

Alfred Huang · Answer 1 · 2021-07-20T05:21:31.940

Note that the map function yields a Promise object as a return value for each item.

And the moment when data finishes collecting all the data should come after all the Promises finishes.

So to ensure the procedure finishes, use a await Promise.all() before you use the data.

let object = [{
  id: `01`, name: `fish`, type: `marine`,
}, {
  id: `02`, name: `fish`, type: `fresh`,
}, {
  id: `03`, name: `fish`, type: `tank`,
}, {
  id: `04`, name: `animal`, type: `pet`,
}, {
  id: `05`, name: `animal`, type: `wild`,
}, {
  id: `06`, name: `animal`, type: `zoo`,
}, {
  id: `07`, name: `food`, type: `veg`,
}, {
  id: `08`, name: `food`, type: `non-veg`,
}]

let data=[];
let test;
let promises = object.map(async (value) => {
  test = await getValue(value.name);
  data.push([value.name,value.type,test]);            
})

// 1. This line matters
await Promise.all(promises);
console.log(data);

// 2. Or if you cannot use await here
Promise.all(promises).then(() => {
  console.log(data);
});

By the way, because the getValue function is asyncronous, so you possibly will got the data in a completely random order, if you care about the order, you may need another approach.

Rajesh Verma · Answer 2 · 2021-07-20T05:16:21.470

Try this you will get your response viva for loop easily. Map function uses a callback function which to be traversed on each element for given array. For more details just go throug this async/await for Array.map fuction, can also use the promise.all for the same as mentioned in post in the given link.

let object=
    [
     {
      id:`01`,
      name:`fish`,
      type:`marine`,
     },
     {
      id:`02`,
      name:`fish`,
      type:`fresh`,
     },
     {
      id:`03`,
      name:`fish`,
      type:`tank`,
     },
     {
      id:`04`,
      name:`animal`,
      type:`pet`,
     },
     {
      id:`05`,
      name:`animal`,
      type:`wild`,
     },
     {
      id:`06`,
      name:`animal`,
      type:`zoo`,
     },
     {
      id:`07`,
      name:`food`,
      type:`veg`,
     },
     {
      id:`08`,
      name:`food`,
      type:`non-veg`,
     }
    ]

    const getData = async function(){
      let data=[];
      for (var i=0; i<object.length; i++){
        let value = object[i];
        let test= await getValue(value.name);
        data.push([value.name,value.type,test]);  
      }
      return data;
    }

console.log(await getData());

score 1 · Answer 3 · answered Jul 20 '21 at 05:13

1

Use Promise.all:

const data = await Promise.all(object.map(async (value) => {
  const test = await getValue(value.name);
  return [value.name,value.type,test]
}))

console.log(data)

answered Jul 20 '21 at 05:13

Cully

6,427
4
36
58

score 0 · Accepted Answer · answered Jul 20 '21 at 12:23

let object = [{
  id: `01`, name: `fish`, type: `marine`,
}, {
  id: `02`, name: `fish`, type: `fresh`,
}, {
  id: `03`, name: `fish`, type: `tank`,
}, {
  id: `04`, name: `animal`, type: `pet`,
}, {
  id: `05`, name: `animal`, type: `wild`,
}, {
  id: `06`, name: `animal`, type: `zoo`,
}, {
  id: `07`, name: `food`, type: `veg`,
}, {
  id: `08`, name: `food`, type: `non-veg`,
}]
    
async function demo(){
    
 let data=[];
 let test;

 for( const value of object){
   test = await getValue(value.name);
   data.push([value.name,value.type,test]);
 }

 console.log(data);
}

Try this I hope this will work as you have to write your code in for loop what you are trying to achieve it will work

fetching async await data outside map function in node js / javascript

4 Answers4