Выполнить функцию после N асинхронных вызовов в javascript / jQuery

Question

У меня 7 вызовов асинхронных функций, после чего мне нужно выполнить функцию. Пример структуры кода.

код

<script>
(function(){

   f1();
   f2();
   f3();
   f4();
   f5();
   f6();
   f7();

   // execute final() when f1-f7 async function have executed. 
    //  All the function have ajax request
   final();

});
</script>

Мой текущий подход

<script>
    (function(){
       var finalExecuted = false;
       f1();
       f2();
       f3();
       f4();
       f5();
       f6();
       f7();

       // execute final() when f1-f7 async function have executed. 
        //  All the function have ajax request

      setInterval(function(){ 
       if($.active == 0 && !finalExecuted) {
         final();
         finalExecuted = true;
       } },500); 

       });
 </script>

Это правильный подход? Все функции f1-f7 являются разными функциями и извлекают разные значения из API.

Answer 1

Если ваши функции возвращают обещание, используйте их.

Используя async/await:

(async function(){
       let res1 = await f1();
       let res2 = await f2();
       let res3 = await f3();
       ...

       if(res1 && res2 && res3 && ... && resN)
          final();
       });

Используя Promise:

let promise1 = f1(); // some Promise in f1()
let promise2 = f2();
...
let promises = [promise1, promise2, ...];
Promise.all(promises).then((res) => final());

Если нет?Почему ты не используешь это?создайте Обещание в onload или onreadystatechange, затем сделайте то же, что и выше.Или вы можете попробовать Получить

Answer 2

Подход, который вы использовали, хорош. Надежный подход к работе с асинхронными функциями будет следующим:

вы используете запросы ajax, если вы используете JQuery для выполнения запросов AJAX, тогда выработая с обещаниями, вот решение, которое вы можете использовать:

Создание массива обещаний

var myPromises = [f1(),f2(),f3(),f4(),f5(),f6(),f7()];

теперь, когда у вас настроен массив, используйте функцию Promise.all

Promise.all(myPromises).then(function(vals){
    // write your code here
});

Promise.all вызывается, когда все ваши асинхронные задачи, переданные в массиве, завершены.