2rever的前端小站

在循环中调用异步函数

Word count: 305 / Reading time: 1 min
2019/02/28 Share
  • 如何在循环中调用异步函数
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
// 预先设定一个数组
const arr = [1,2,3,4,5]

// forEach是并行执行的,并不会等待await返回的结果,同 Promise.all()
// 加不加上 async await 是一样的
arr.forEach(async (item) => {
await delay(item)
})

// 要执行串行执行的要用for循环来执行,并且使用await
async function test {
for (var i = 0; i <arr.length; i++) {
await delay(item)
}
}


// 异步执行函数
function delay(item) {
return new Promise((res,rej) => {
setTimeout(() => {
console.log('开始任务' + item)
res(item)
console.log('结束任务' + item)
},3000)

}).then(res => console.log('真正完成了任务',item)).catch(err => console.log('出错了'))
}

//执行后可以看到返回值是串行执行的
test()

// 开始任务0
// 结束任务0
// 真正完成了任务 0
// 开始任务1
// 结束任务1
// 真正完成了任务 1
// 开始任务2
// 结束任务2
// 真正完成了任务 2
// 开始任务3
// 结束任务3
// 真正完成了任务 3
// 开始任务4
// 结束任务4
// 真正完成了任务 4
CATALOG