js按顺序执行多个异步函数

今天跟同事吃饭,无意间谈到了一个技术问题。

假如有多个异步函数,按照某个顺序执行异步函数,结果依然按照此顺序返回。

emmm...,按照自己的理解,随意写了一个方法。

主要用到Promise方法,话不多说,直接上代码:

1. 定义异步函数p1、p2和p3。

 1     var p1 = function (){
 2         return new Promise((resolve, reject) => {
 3             setTimeout(() => {
 4                 resolve('p1')
 5             }, 1000);
 6         })
 7     }
 8     var p2 = function (){
 9         return new Promise((resolve, reject) => {
10             setTimeout(() => {
11                 resolve('p2')
12             }, 500);
13         })
14     }
15     var p3 = function (){
16         return new Promise((resolve, reject) => {
17             setTimeout(() => {
18                 resolve('p3')
19             }, 100);
20         })
21     }

2. 将异步函数,按照自己定义的顺序,放到一个数组里

1 var fnArr = [p2, p1, p3];

3. 定义函数

 1 var run = function (arr, start = 0){
 2      if(start > arr.length || start < 0) return; // 参数start不能超过    arr.length,不能为负数
 3      var next = function (i){
 4          if(i < arr.length){
 5               var fn = arr[i];
 6               fn().then(res => {
 7                   console.log(res);
 8                   i++;
 9                   next(i)
10               })
11           }
12       }
13       next(start)
14  }
run(fnArr); // 执行方法

4. 输出结果,如图:

综上所述。

如果文章中存在错误的地方,麻烦请大家在评论中指正,以免误人子弟,谢谢!
原文地址:https://www.cnblogs.com/zhaoyongblog/p/12869497.html