for await...of 是基于对 iterable(可迭代) 的实现，这种实现比较适合用于有依赖关系的内容。如较大文件的加载，可以通过在阅读到某一个点的时候触发下一段文件的加载，以达到提升用户体验感的效果。

使用案例如下：

const getData3 = async () => {
  const data = await timeout();
  const curr = new Date();
  console.log(curr);
  let str = [];
  for await (el of data) {
    const element = await getEl(el);
    console.log(element, new Date() - curr);
    str.push(element);
  console.log(str);
getData3();
效果如下：
 
因为使用了 await 去等待上一个异步调用结果返回之后，再去执行下一个异步调用，因此消耗的时间也更多。
 
其执行流程大概如下：
 
整体来说，在循环体内调用异步函数有以下三种方法：
 
 
传统 for循环
 
最传统的解决方案
 
 
Promise.all, await 和 map 的结合
 
可以近似同步地并行调用循环体内的 API，如果需要在数组之中循环调用 API，并且 API 之间彼此没有什么关联，那么使用这个方案可以极大的提升用户体验感
 
 
for await...of
 
for of 的异步支持版本，可以串行调用 API，在不使用其他关键字的情况下与传统的 for循环 效果一样
 
但是，因为 for of 是基于迭代器实现的，这也就代表着可以通过重写迭代器去实现一些特殊的业务场景，如：
 
  
 
视频渐进式下载
 
 
页面内容分段加载
 
这种效果在小说网站中用的还挺多的，为了防盗，部分小说网站在 VIP 章节中都是用图片代替文字。
 
 
…
 
 
                    本文主要分析在循环体中怎么调用异步函数，并且满足循环调用异步函数，并在异步函数值返回之后，再处理后续业务的同步需求。这篇文章是受到和 六卿 在群里讨论问题时启发而写的，主要讨论的问题就只在循环体内进行异步调用。他也写了自己的总结: node 中循环异步的问题[‘解决方案‘]_源于 map 循环和 for 循环对异步事件配合 async、await 的支持。
				
在一个列表循环里，对数据进行赋值，调用接口，循环外后面的代码需等待所有请求执行完成后再去执行。
2. for await…of实现（推荐）
这种方法是es6新语法，其介绍如下：for…of 针对可迭代对象身上的（array, map, set, string, typedarray, argements）
迭代的是对象列表中的值（value） ，一般情况遍历数组for…in 针对对象的属性进行无序遍历，除了symbol类的属性
遍历的是属性，一般情况适用于对象遍历该方法使用起来，相比Promise.all要
function doubleList(list) {
    return new Promise(function (resolve) {
        setTimeout(function () {
            let doublelist = []
            for(let item of list){
            	doublelist.push(item*2)
				
问题描述：for循环中，异步调用后端接口无效（同时执行所有任务，导致页面卡死）
提示：循环不能是异步的，for循环是同步任务，内部的异步任务会在for循环执行完成后执行
解决方法：循环中使用递归。使用递归函数在事件循环的单独轮次中执行迭代，在事件循环的单独轮次中执行递归，不会导致调用栈溢出。
（）事件循环的每个轮次中调用其他事件处理程序的调用栈最初是空的）
这个问题涉及事件循环：
				
目前来说,JS实现异步编程的最好方法还是: ①. Promise , ②. aysnc await方法
基本原则:如果只用Promise, 那异步过程只在Promise里, 如果想执行Promise后返回结果, 那就用 aysnc/await 调用Promise
Promise 方法
简单说，它的思想是，每一个异步任务返回一个Promise对象，该对象有一个then方法，允许指定回调函数。比如...
首先来看下mdn中的介绍
forEach() 方法按升序为数组中含有效值的每一项执行一次 callback 函数，那些已删除或者未初始化的项将被跳过。（说白了就是去循环数组中的元素，每循环一次就调用一次传入的函数。并且在被调用时，不会改变原数组）
arr.forEach(callback(currentValue [, index [, arrSelf]])[, thisArg])
callback
为数组中每个元素执行的函数，该函数接收一至三
				
上一篇博文“利用HTML5新特性localstorage把用户数据暂时存储在客户端，用于之后上传”里提到了用for循环，但是今天发现for循环不起作用。最终post请求只执行了一次，代码如下
for(i=localStorage.length-1;i>=0;i--){//从后往前依次取每条localstorage
	local_key=localStorage.key(i);
	if(local
				
Event Loop（事件循环）
Event Loop 即事件循环，是指浏览器或 Node 的一种解决 javaScript 单线程运行时不会阻塞的一种机制，也就是我们经常使用异步的原理。
之所以称之为事件循环，是因为它经常按照类似如下的方式来被实现：
while (queue.waitForMessage()) {
  queue.processNextMessage();
如果当前没有任...
				
在 JavaScript 中，循环语句有 `for`、`while`、`do-while` 和 `for-of` 四种。其中，`for` 循环可以实现类似 `foreach` 的功能。
`for` 循环的语法如下：
```javascript
for (initialization; condition; increment) {
  // 代码块
其中，`initialization` 用于初始化循环计数器，`condition` 用于定义循环条件，`increment` 用于更新循环计数器的值。每次循环执行时，都会检查 `condition` 是否为真，如果为真则执行循环体中的代码块，并更新循环计数器的值。例如，可以使用 `for` 循环遍历数组中的元素：
```javascript
const arr = [1, 2, 3, 4, 5];
for (let i = 0; i < arr.length; i++) {
  console.log(arr[i]);
以上代码会输出数组 `arr` 中的每个元素。
另外，ES6 引入了 `for-of` 循环语句，可以更加方便地遍历数组、字符串等可迭代对象，具体用法如下：
```javascript
const arr = [1, 2, 3, 4, 5];
for (const item of arr) {
  console.log(item);
以上代码也会输出数组 `arr` 中的每个元素，相比于 `for` 循环，`for-of` 循环更加简洁、易读。需要注意的是，`for-of` 循环不能遍历普通对象，因为普通对象不是可迭代对象。