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

2022-04-18  本文已影响0人  WebDog369

今天在逛知乎时看到了一个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有先后顺序要求,并且需要及时按顺序执行异步操作的场景。

上一篇 下一篇

猜你喜欢

热点阅读