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

您使用的方法很好，下面是使用异步函数的可靠方法：

您正在使用ajax请求，如果您正在使用JQuery发出AJAX请求，那么您正在使用promises，这是您可以使用的解决方案：

创建一个承诺数组

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

现在您已经设置好数组，请使用Promise.all函数

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

Promise.all在数组中传递的所有异步任务完成执行后被调用。

Answer 2

如果您的函数返回了诺言，请使用它们。

使用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中创建一个Promise，然后执行上述操作。或者，您可以尝试fetch

在javascript / jQuery

2 个答案: