Javascript------for...of...用于异步加载调用的循环事件

对于原生的for循环以及后来较为方便的forEach循环：（这两者相比for循环速度快！！！）

不管里面有回调还是异步接口，都是直接循环完了，一下子（指时间短暂或动作迅速）（指时间短暂或动作迅速）扔给下面的代码！！！

所以对于异步循环，这样子其实就违背了初衷，虽然事件正常执行，但是几乎同时完成了！

实际验证结果如下（附有gif动图，直观查看结果）

通用异步函数，有时间间隔的返回结果（测试函数）

1.  
   const nums = [1, 2, 3, 4, 5]
2.  
   // for...of...循环
3.  
   function powxy(num) {
4.  
   return new Promise(function (resolve, reject) {
5.  
   let timer = setTimeout(() => {
6.  
   resolve(num ** 2)
7.  
   clearTimeout(timer);
8.  
   }, 2000);
9.  
   })
10.  
    }

1. forEach循环试验如下：

1.  
   // forEach
2.  
   nums.forEach(async (num) => {
3.  
   const num1 = await powxy(num)
4.  
   console.log("forEach",num1);
5.  
   })

2. for...of...循环试验如下：

1.  
   // for...of... 会一个一个执行返回结果才会继续执行下一个
2.  
   // 主要用于一些异步的循环使用！！！
3.  
   ;(async function () {
4.  
   for (const iterator of nums) {
5.  
   const num2 = await powxy(iterator)
6.  
   console.log("for...of",num2);
7.  
   }
8.  
   })()

 想必下次大家使用循环有异步接口调用的时候，肯定知道要用那个会比较优化了吧(

（￣︶￣)~~~

这篇好文章是转载于：学新通技术网