Как дождаться асинхронной функции ?(javascript)

Question

Есть код:

arr = [7, 2, 8, 4, 3];
arr2 = [];
arr.forEach(async function(item, i) {
  var z = await func(item);
  // операции над z
  arr2.push(z);
});

arr2.forEach(function(item, i) {
  console.log(item);
});

Проблема в том, что 2й цикл с arr2 начинает работу до того, как закончит первый цикл, а arr2.push(z) до того, как z получит результат.

Как исправить ?

Answer 1

Если хочется параллельно запустить несколько асинхронных функций и дождаться их результата, то лучше использовать Promise.all и arr.map. forEach здесь никак не подходит.

Пример кода, Который демонстрирует эту идею:

arr = [7, 2, 8, 4, 3];
Promise.all(arr.map(async function(item, i) {
  var z = await func(item);
  // операции над z
  return z;
})).then(arr2 => {
  arr2.forEach(function(item, i) {
    console.log(item);
  });
})

Answer 2

И откуда эта мода на forEach(). Правильно будет вот так.

( async () => {
  const arr = [7, 2, 8, 4, 3];
  const arr2 = new Array ( arr.length );
  for ( const [index,item] of arr.entries() ){
     const z = await func(item);
     // операции над z
     arr2[index] = z;
  }
  for ( const item of arr2 ){
    console.log ( item );
  }
} )()

Вот так всё выполняется в нужной последовательности.

Толково. Наглядно. И даже комментарии не нужны.

БЛОГ НА HUSL

Как дождаться асинхронной функции ?(javascript)

Ответы (2 шт):