js中for循环里面有异步请求怎么解决

JavaScript014

js中for循环里面有异步请求怎么解决,第1张

axios.post('/operationlog/list', moduleParams).then((res) =>{if (res.status === 200) { this.moduleList = res.data.items

stepParams.append('category', "")

stepParams.append('needPlayback', true) for (let i = 0i <this.moduleList.lengthi++) {

stepParams.set('category', this.moduleList[i].category)

axios.post('/operationlogitem/list', stepParams).then((res) =>{ console.log(res.data.items)

}).catch((e) =>{ console.log(e)

})

}

}

}

代码如上,根据外层请求获取到多个不同的category,但是for循环是同步,里面的post请求是异步的,所以始终以最后一项的category为参数发送请求.请问如何修改代码按照每一项的category参数发送post请求

看了你的问题,才百度学习的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=0i<4i++){

    p=async1().then(async2)

   }

   p.then(async3)

按照js同步执行的顺序,函数调用会首先执行for循环,循环5次开启了5个延迟器,延时器内部的回调函数将会异步执行,会在延时1s后进入消息队列等待执行。循环了5次,所以此时i的值为5,然后同步执行console.log打印5,第一次同步执行结束,然后开始执行消息队列的异步任务,打印5个5,中间的undefined是函数调用无返回值返回的。

执行顺序和第一题相同,不同的是延时器被包裹在了一个立即执行函数内容,并把每一次循环的i作为参数传入,此时循环内部的函数形成了一个私有作用域,每一次的i变量被独立保存了起来,因此每一次循环的i的值都会被打印出来。

延时器内部回调函数是异步函数,将在延时结束后,进入消息队列等待执行,因此同步的console.log("CCCC")最优先执行,然后延时0ms的延时器的回调先进入消息队列,1000ms后第一个延时器的回调再进入消息队列等待执行,因此先执行0ms的回调打印DDDD,再执行1000ms的回调打印BBBB。

这里与上一题不同的是中间多了一个执行3s的同步while循环,因此执行顺序是这样的:

第一个延时器延时1s后内部异步回调函数进入消息队列等待执行,

等待while循环3s后打印"CCCC",

循环结束后第一个延时器内部的回调已经进入消息队列第一个执行位置等待执行。

第二个延时器延时0s后内部异步回调函数进入消息队列等待执行,延时结束后排到第一个延时器的回调函数后面,

因此异步队里内部先打印"BBBB",再打印"DDDD"