Как дождаться завершения нескольких асинхронных запросов?

Есть функция:

const example = async data => {

    exampleArr.map(item => {
            fetch запрос на каждый item
        }
    });

    await другой fetch запрос
};

Смысл, чтобы последний fetch запрос выполнился только тогда, когда выполнятся все запросы через map. И то как сейчас написано вроде работает, но периодически один из map запроса выполняется после последнего fetch. Просьба подсказать, что не так делаю.


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

Автор решения: Евгений Платов
const example = async data => {

    await Promise.all(exampleArr.map(item => {
            return fetch запрос на каждый item
        }
    });

    другой fetch запрос
};
→ Ссылка
Автор решения: nörbörnën

Вам нужно использовать Promise.all для того чтобы дождаться выполнения первой группы Promise.

Метод Promise.all(iterable) возвращает обещание, которое выполнится тогда, когда будут выполнены все обещания, переданные в виде перечисляемого аргумента, или отклонено любое из переданных обещаний.

Поясню на примере:

const sleep = (timeout = 500) => new Promise((resolve) =>
         setTimeout(() => resolve(Math.random()), timeout));

const example = async () => {
  const exampleArr = new Array(5).fill(1);
  
  console.log('first part');
  await Promise.all(
    exampleArr.map(item => sleep(2000))
  ).then((r) =>
    console.log(...r));

  console.log('second part');
  await sleep();
  
  console.log('done')
};

example();

→ Ссылка