異步迭代器(for-await-of)：循環(huán)等待每個Promise對象變?yōu)閞esolved狀態(tài)才進入下一步。

我們知道 for...of 是同步運行的，看如下代碼

  function TimeOut(time) {
   return new Promise(function (resolve, reject) {
    setTimeout(function () {
     resolve(time)
    }, time)
   })
  }
  async function test() {
   let arr = [TimeOut(2000), TimeOut(1000), TimeOut(3000)]
   for (let item of arr) {
    console.log(Date.now(), item.then(console.log))
   }
  }
  test() 

上面打印結果如下圖

圖片

上述代碼證實了 for of 方法不能遍歷異步迭代器，得到的結果并不是我們所期待的，于是 for await of 就粉墨登場啦！

ES9 中可以用 for...await...of 的語法來操作

 function TimeOut(time) {
   return new Promise(function (resolve, reject) {
    setTimeout(function () {
     resolve(time)
    }, time)
   })
  }
  async function test() {
   let arr = [TimeOut(2000), TimeOut(1000), TimeOut(3000)]
   for await (let item of arr) {
    console.log(Date.now(), item)
   }
  }
  test() // 1560092345730 2000// 1560092345730 1000// 1560092346336 3000復制代碼

for await of 環(huán)等待每個Promise對象變?yōu)閞esolved狀態(tài)才進入下一步。所有打印的結果為 2000，1000，3000