遍历await方法的区别：以for和forEach为例

场景举例

先简单了解一下遍历await的应用场景，有助于增进对遍历方法区别的了解。

比如我有一组学生名单

const studentNames = ['dilireba', 'zhangsan', 'xiaoming']
1

现在需要根据学生姓名到获取到数据库中对应的学生信息，

数据库查询是异步的，

此时就需要用到遍历await来查询

方法介绍

遍历方法目前有四个比较常见的：

for
for ... of ...
forEach
重写forEach

百度可自行查询详细介绍。

区别

在此处以for和 forEach为例。

先从两者的遍历结构说起：

for:

const getStudentDetails = async () {
  for(let i = 0; i < studentNames.length; i++) {
	let s = await mongodb.find(...)
  }
}
1
2
3
4
5

forEach:

const getStudentDetails = async () => {
  studentNames.forEach(async item => {
	let s = await mongodb.find(...)
  })
}
1
2
3
4
5

可以看到，for属于同步操作，而forEach中的遍历过程是在回调函数中的，

也就是异步的。

很显然， for在遍历后，可以直接得出想要的结果，而forEach是不行的。

举个例子：

DOCTYPE html>
<html lang="en">
<head>
  <meta charset="UTF-8">
  <meta http-equiv="X-UA-Compatible" content="IE=edge">
  <meta name="viewport" content="width=device-width, initial-scale=1.0">
  <title>Documenttitle>
head>
<body>
  <script>
    function test() {
      return new Promise((resolve, reject) => {
        resolve(111)
      })
    }

    const arr = [1, 2, 3]
    const arr1 = []
    const arr2 = []

    async function fn1() {
      for(let i = 0; i < arr.length; i++) {
        let r = await test()
        arr1.push(r)
      }
	  // --> 这里打印的结果，就是想要得到的结果
      console.log('fn1-arr1: ', arr1)
    }

    fn1()

    async function fn2() {
      arr.forEach(async item => {
        let r = await test()
        arr2.push(r)

        console.log('arr2: ', arr2)
      })
	  // --> 这里打印的arr2是[]
      console.log('fn2-arr2: ', arr2)
    }

    fn2()

  script>
body>
html>
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

相关阅读:
uniapp使用uviews上传多张图片
Threejs中使用Tweenjs实现动画效果和Tweenjs使用说明文档
基于 selenium 实现网站图片采集
15：00面试，15：08就出来了，问的问题有点变态。。。
uniapp数据可视化页面，引入uCharts开发（这里介绍一下图例的自定义开发，当数据上百条的情况处理）
Debian安装Docker环境
学习笔记|ADC|NTC原理|测温程序|STC32G单片机视频开发教程（冲哥）|第十九集：ADC应用之NTC
第七章查找四、分块查找
【甄选靶场】Vulnhub百个项目渗透——项目十三：SickOs 1.2（防火墙绕过，计划任务写入）
MediaCodec_Analyze-3-start

原文地址：https://blog.csdn.net/tuzi007a/article/details/126098378

遍历await方法的区别：以for和forEach为例

目录

场景举例

方法介绍

区别