Pedro Renato Mello
Pedro Renato Mello

Reputation: 88

Can't acess variable outside forEach loop JavaScript

I want to get the allItems variable outside the function, but I just can get an empty array. The first console.log shows the array I wanted, but the second it's just [].

var allItems = [];    
orderPads.forEach(async  element => {
        
        element.orders_fk.forEach(async elem => {
            
            let itemsArray = await OrderedItem.find({ order_fk: elem });
            
            
            itemsArray.forEach(async e => {
                 
                let temp = e.toObject();
                const mesa = await Table.findById(element.mesa);
                temp.mesa = mesa.name;
                
                allItems.push(temp)
                console.log(allItems)
                
            })
        })
    });
console.log(allItems)

I've already looked for answers online, but nothing seems to work in this case. Thank you for the help!

Upvotes: 4

Views: 8753

Answers (1)

somethinghere
somethinghere

Reputation: 17330

Async functions don't do what you think they do in forEach. Foreach will wait for every loop, but since it won't return a Promise, you can't actually wait for all loops (the forEach) to be done - the method will just return the current null immediately. Then you log that once. You might notice that your last log is logged first, and your others later, indicating that forEach was completed, but the loops completed later, and your array only filled up after your first log.

Personally, I would suggest using a for loop itself instead, which does not actually take you out of the async flow:

const allItems = [];   

for( const element of orderPads ){
for( const elem of element.orders_fk ){

  const itemsArray = await OrderedItem.find({ order_fk: elem });
  
  for( const e of itemsArray ){
  
    const temp = e.toObject();
    const mesa = await Table.findById(element.mesa);
    temp.mesa = mesa.name;

    allItems.push(temp)
    console.log(allItems)
    
  }
  
}}

console.log(allItems)

for loops are core constructs in Javascript, while forEach is in essence a simplistic wrapper for a for loop in Arrays that was never intended for asynchronous use.

Upvotes: 4

Related Questions