问题描述:例如以下循环中执行一个函数,函数请求api(这里用延迟期模拟)。
参考:https://www.cnblogs.com/leungUwah/p/7932912.html
问题如下,for循环为异步 two函数还没有执行完one函数就console出来了。所以打印 0
let num = 0;
one()
function one() {
for (let i = 0; i < 5; i++) {
two()
}
console.log(num) //输出0
}
function two() {
setTimeout(() => {
num++;
}, 2000);
}
解决方法 使用ES7前端异步玩法:async/await
await 必须放在一个定义了async 的父级函数里面
<script>
let num = 0;
one()
async function one() { //定义异步函数
for (let i = 0; i < 5; i++) {
await two() //await 要等待上一次的resolve结果返回才会执行下一次循环
.then(resolve => {
console.log(num) //结果是 每隔一秒 输出 1 ,2,3,4,5
console.log(resolve) //每隔一秒输出 ok
})
}
}
function two() {
return new Promise((resolve, reject) => {
setTimeout(() => {
num++;
resolve('ok') //必须写 括号内是需要返回的数据 相当于return
}, 1000);
})
}
</script>
打印结果:
image.png
网友评论