Axios.get (). Then () в цикле for

Question

Как бы я запустил Axios в цикле for, каждый с соответствующей функцией .then().Затем после окончания цикла for запустите другую функцию.

Пример:

const array = ['asdf', 'foo', 'bar'];
let users = [];
for (i = 0; i < array.length; i++) {
  axios.get('/user/' + array[i].id).then(response => {
    // do something with response
    users.push(response);
  });
}

console.log(users);

Answer 1

const array = ['asdf', 'foo', 'bar'];
let users = [];
let promises = [];
for (i = 0; i < array.length; i++) {
  promises.push(
    axios.get('/user/' + array[i].id).then(response => {
      // do something with response
      users.push(response);
    })
  )
}

Promise.all(promises).then(() => console.log(users));

Метод .then() для Promise сам по себе возвращает Promise;так что вы можете собрать их и ждать их всех с помощью Promise.all().

. Обратите внимание, что даже если вы делаете это в функции async, вы не захотите await внутрицикл, потому что тогда каждый запрос будет ждать завершения предыдущего, прежде чем он даже запустится, и, по-видимому, вы хотите выполнять эти запросы параллельно.

В зависимости от вашего случая использования может выглядеть краткая асинхронная / ожидающая функциякак это:

async getMultiple(...objectsToGet) {
  let users = [];
  await Promise.all(objectsToGet.map(obj =>
    axios.get('/user/' + obj.id).then(response => {
      users.push(response);
    })
  ));
  return users;
}

console.log(getMultiple({ id: 'asdf'}, { id: 'foo' }, { id: 'bar' }));

Answer 2

Если вы используете более свежую версию javascript с поддержкой async/await, вы можете сделать следующее:

const array = ['asdf', 'foo', 'bar'];
let users = [];
for (const id in array) {
  const response = await axios('/user/' + id);
  users.push(response);
}

console.log(users);

Answer 3

Вы должны собрать все обещания внутри массива и использовать promisall следующим образом -

const array = ['asdf', 'foo', 'bar'];
let promises = [];
for (i = 0; i < array.length; i++) {
  promises.push(axios.get('/user/' + array[i].id))
}

Promise.all(promises)
  .then(responses => console.log(responses));