Дождитесь завершения асин c звонков внутри al oop - PullRequest
Новая
       32

Дождитесь завершения асин c звонков внутри al oop

0 голосов
/ 19 апреля 2020

Я знаю, что вопросы, подобные этому, задавались много раз, но некоторые из них старые и предлагают устаревшие решения, некоторые описывают решение, но не в контексте al oop, и ни один из них прямо не отвечает на мой вопрос. Я хочу знать, каков последний и лучший подход к запуску фрагмента кода после выполнения другого фрагмента кода, выполняющего набор асин c вызовов.

Вот общая структура кода как У меня есть это: 

function fetchProperty(input) {
  $.ajax({
    url: 'https://jsonplaceholder.typicode.com/todos/1' + input
  }).done(function(resp){
    return $.parseJSON(resp).title;
  });
}

inputValues = [1, 2];
outputValues = [];

$.each(inputValues, function(index, value){
  outputValues.push(fetchProperty(value));
});

console.log(outputValues); // will return an empty array

По сути, я хочу, чтобы последняя строка кода не выполнялась до тех пор, пока не завершатся все вызовы AJAX, сделанные внутри $.each(). Очевидно, я не хочу использовать async: false, потому что это устарело. Как лучше отложить console.log до тех пор, пока не будут выполнены все другие отложенные вызовы AJAX?

Ответы [ 2 ]

2 голосов
/ 19 апреля 2020

Попробуйте использовать asyn c await, как в коде ниже. Кажется, проблема в том, что выборка асинхронная c, но журнал консоли не так, что он печатает, прежде чем получить данные 

async function fetchProperty(input) {
  const resp = await $.ajax({
    url: 'http://some.api/' + input + '/foobar'
  });
   return $.parseJSON(resp).someProperty;
}

inputValues = ['this', 'that'];
outputValues = [];

$.each(inputValues, async function(index, value){
  outputValues.push(await fetchProperty(value));
});

console.log(outputValues);
1 голос
/ 20 апреля 2020

Я не уверен, что $.ajax вернет доступный объект (как Promise) или нет. Затем я сначала преобразую $.ajax в Обещание и использую ключевое слово await, чтобы получить значение из функции. Я использую for...of вместо $.each для этой задачи, потому что $.each использует стиль callback, тогда будет трудно заставить его работать с async/await. 

function fetchProperty(input) {
  return new Promise((resolve) => { // return a Promise
    $.ajax({
      url: 'https://jsonplaceholder.typicode.com/todos/' + input
    }).done(function (resp) {
      resolve(resp.title); // resolve here
    });
  });
}

async function main() {
  const inputValues = [1, 2];
  const outputValues = [];

  for (const value of inputValues) {
    outputValues.push(await fetchProperty(value));
  }
  console.log(outputValues); // the values
}

main();
...