Question

JS 怎么让整体的for同步执行而for中的异步函数异步执行

例如
function x()
{
return new Promise(
(resolve,reject)=>
{
for (let i = 0; i < 5; i++)
{
async1(
success()
{async2()
.then(
if(i==4) resolve()
)})
}
})
}
x().then(async3())

async1、2、3是异步函数
问题是，函数x会连续执行4次async1，然后直接执行async3，再回过去执行async2.
我希望能先执行4次async1然后4次async2，最后1次async3的顺序。
for内部异步函数执行顺序是无所谓的，重要的是函数x（即async1、2全部执行完毕）和async3的顺序。
换句话说执行到resolve才退出async1，进入async3。
async1用回调是因为这是个api不支持Promise
最好不要用递归，async await的写法也可以接受
网上没找到什么比较好的例子，有没有大神会修改一下代码啊
如果我说的不清楚的点，可以让我补充说明

Answer 1

看了你的问题，才百度学习的Promise，不知道是不是你要的效果。

   function async1(){
    return new Promise(function(resolve, reject) {
     setTimeout(function() {//setTimeout模拟异步
      console.log('async1 is done');
      resolve('async1 value');
     }, 6000);
    });
   }
   function async2(){
    return new Promise(function(resolve, reject) {
     setTimeout(function() {//setTimeout模拟异步
      console.log('async2 is done');
      resolve('async2 value');
     }, 3000);
    });
   }
   function async3(){//async3不需要then，所以没写return new Promise
    setTimeout(function() {
     console.log('async3 is done');
    }, 1000);
   }
   let p;
   for(let i=0;i<4;i++){
    p=async1().then(async2);
   }
   p.then(async3);

Answer 2

function async1(callback){
    setTimeout(_ => {
        console.log('async1: ' + new Date().toTimeString());
        callback();
    }, 2000);
}

function async2(){
    return new Promise(resolve => {
        setTimeout(_ => {
            console.log('async2: ' + new Date().toTimeString());
            resolve();
        }, 2000);
    })
}

function async3(){
    return Promise.resolve().then( _ => console.log('async3: ' + new Date().toTimeString()));
}

//将async1封装为promise方式
function async1_promise(callback){
    return new Promise((resolve, reject) => {
        try{
            async1((...args) => {
                typeof callback === 'function' && callback.apply(null, args);
                resolve();
            });
        }catch(e){
            reject(e);
        }
    });
}

function test1(){
    //先执行4次async1,  执行完上1个再执行下一个
    //然后执行4次async2, 执行完上1个再执行下一个
    //再执行1次async3
    async1_promise()
        .then(_ => async1_promise())
        .then(_ => async1_promise())
        .then(_ => async1_promise())
        .then(_ => async2())
        .then(_ => async2())
        .then(_ => async2())
        .then(_ => async2())
        .then(_ => async3());
}

function test2(){
    //和test1相同, 只是写法简化, 如果要执行很多次可以这么写
    var step = Promise.resolve();
    for(let i = 0; i++ < 4; step = step.then(_ => async1_promise()));
    for(let i = 0; i++ < 4; step = step.then(_ => async2()));
    step.then(_ => async3());
}

function test3(){
    //先执行4次async1,  无需等待上1个执行完就执行下一个
    //然后执行4次async2, 无需等待上1个执行完就执行下一个
    //再执行1次async3
    Promise.all(Array.from(new Array(4), _ => async1_promise()))
        .then(_ => Promise.all(Array.from(new Array(4), _ => async2())))
        .then(_ => async3());
}

如果要测试,注意不要同时运行,  需要单独运行test1, test2, test3, 在浏览器控制台查看效果.

Answer 3

function x(abc){
   for (let i = 0, k = 0; i < 4; i++){
      async1(success(){
         async2().then(()=>{
            if ( ++k == 4 ) abc();
         });
      });
   }
}
x(async3);

Answer 4

function action(){
for(var a=0;a<5;a++){
action1();
}
}
function action1(){
console.log('haha');
}
整个for循环是同步执行的，但是action1()是异步执行的

追问

很感谢你的回答，但是恐怕你没get到点。以你写的代码为例，我需要在确保5次action1执行完毕之后执行代码，但是用Promise和await好像并不能达到要求。我需要的是类似如下代码：
action()
nextAction() //确保在action内部的5次action1()运行之后，才运行该函数
按照你现在提供的代码仍然会先运行nextAction()只要action1是个时间较久的异步函数