美文网首页
关于ES9中 for await of ... 异步迭代器

关于ES9中 for await of ... 异步迭代器

作者: WebDog369 | 来源:发表于2022-04-18 14:55 被阅读0次

    今天在逛知乎时看到了一个ES9的异步迭代器for await of ...,于是就随便写写来测试了一下效果,以下是测试案例。

      function timer(t) {
                return new Promise (resolve => {
                    setTimeout(() => {
                        resolve(t)
                    }, t)
                })
            }
            // 第一种循环方式 结果为异步 4000ms后依次输出 1000 2000 3000 4000
            for(const timeFn of [timer(4000), timer(3000), timer(2000), timer(1000)]) {
                timeFn.then(res => {
                    console.log(res)
                })
            }
            
            // 第二种循环方式 结果为同步 10000ms 后输出 4000 3000 2000 1000
            (async function () {
                for (const timeFn of [await timer(4000), await timer(3000), await timer(2000), await timer(1000)]) {
                    console.log(timeFn)
                }
            })()
            
            // 第三种循环方式 ES9写法 结果为同步 4000ms后输出 4000 3000 2000 1000
            (async function () {
                for await (const timeFn of [timer(4000), timer(3000), timer(2000), timer(1000)]) {
                    console.log(timeFn)
                }
            })()
    

    经过上面的测试,我们可以将以上三种写法使用在三个不同的场景中。
    第一种:正常的for of ... 遍历执行一些异步方法,适用于对异步result无顺序要求的场景。
    第二种:for of [await ...]的遍历方式适用于所有异步result都完成后再执行某方法的场景。
    第三种:for await of ...的遍历方式适用于对异步result有先后顺序要求,并且需要及时按顺序执行异步操作的场景。

    相关文章

      网友评论

          本文标题:关于ES9中 for await of ... 异步迭代器

          本文链接:https://www.haomeiwen.com/subject/ussdertx.html