先说需求，根据数组中的ID值，对每个ID发送请求，获取数据进行操作。
首先肯定考虑用forEach 或者 map对数组进行遍历，然后根据值进行操作，但是请求是个异步操作，forEach又是一个同步操作，等同于同时发出多个异步请求，并不能确定具体返回的数据是哪个请求。（我这里的返回数据中有ID值，可以根据ID查找，这不就是太low了嘛，每次拿到返回来的数据，还得遍历一遍原数组才行）
那么我们如何才能做到即遍历数组又发送请求，同时根据返回值进行操作呐。
解释几点：（不想看的人直接跳结果）
async函数：返回一个promise对象，可以使用then方法添加回调函数。当函数执行的时候，一旦遇到await就会先返回，等到触发的异步操作完成，再接着执行函数体后面的语句。
await会获取promise的成功回调resolve（）返回值，并且只能使用在async函数中（这表面这个函数中有异步操作）同时await将异步变成同步，增加了代码逻辑可读性。注意一点，既然是异步promise就有可能会有rejected的结果，所以一般使用try···catch···或者.catch 来处理请求出错
结果：
当需要同时发起多个异步，可以使用promise.all
// const aa = this.testNumArray.map((item) => {
// return this.getFetch(item);
// });
// const bb = Promise.all(aa);
// bb.then((val) => {
// console.log(val, ‘bb-result‘);
// });
这里的getFetch就是发送的异步请求；
如果后一步的异步请求需要依赖于前一步的数据，即当一个异步请求完结后拿到数据才可以继续发送下一个请求，可以将for of和async/await结合使用
foo = async (array: any) => {
for (let i of array) {
const item = await this.getFetch(i);
console.log(item);
}
};
注意await这里等到的值，一定是一个promise对象（虽然他也可以处理非promise对象，同样可以作为resolve（）的值进行输出）
这里解释一下，为何forEach是没有作用的，forEach的第一个参数是一个函数，他的源码中并没有对可遍历对象的异步进行处理，所以他是一个即时操作的回调函数，并不能达到我们异步的需求。
参考网址https://developer.mozilla.org/zh-CN/docs/Web/JavaScript/Reference/Global_Objects/Array/forEach#polyfill
源码：
// Production steps of ECMA-262, Edition 5, 15.4.4.18
// Reference: http://es5.github.io/#x15.4.4.18
if (!Array.prototype.forEach) {
Array.prototype.forEach = function(callback, thisArg) {
var T, k;
if (this == null) {
throw new TypeError(‘ this is null or not defined‘);
}
// 1. Let O be the result of calling toObject() passing the
// |this| value as the argument.
var O = Object(this);
// 2. Let lenValue be the result of calling the Get() internal
// method of O with the argument "length".
// 3. Let len be toUint32(lenValue).
var len = O.length >>> 0;
// 4. If isCallable(callback) is false, throw a TypeError exception.
// See: http://es5.github.com/#x9.11
if (typeof callback !== "function") {
throw new TypeError(callback + ‘ is not a function‘);
}
// 5. If thisArg was supplied, let T be thisArg; else let
// T be undefined.
if (arguments.length > 1) {
T = thisArg;
}
// 6. Let k be 0
k = 0;
// 7. Repeat, while k < len
while (k < len) {
var kValue;
// a. Let Pk be ToString(k).
// This is implicit for LHS operands of the in operator
// b. Let kPresent be the result of calling the HasProperty
// internal method of O with argument Pk.
// This step can be combined with c
// c. If kPresent is true, then
if (k in O) {
// i. Let kValue be the result of calling the Get internal
// method of O with argument Pk.
kValue = O[k];
// ii. Call the Call internal method of callback with T as
// the this value and argument list containing kValue, k, and O.
callback.call(T, kValue, k, O);
}
// d. Increase k by 1.
k++;
}
// 8. return undefined
};
}
这里看不懂没有关系，记住一点，红色的代码就是直接执行回调函数。
同时，人家官方都说了：如果使用 promise 或 async 函数作为 forEach() 等类似方法的 callback 参数，最好对造成的执行顺序影响多加考虑，否则容易出现错误
let ratings = [5, 4, 5];
let sum = 0;
let sumFunction = async function (a, b) {
return a + b;
}
ratings.forEach(async function(rating) {
sum = await sumFunction(sum, rating);
})
console.log(sum);
// Expected output: 14
// Actual output: 0
那么问题来了，既然forEach不行，那么for ··· of 为何可以呐？难道for ··· of比较牛逼嘛？
那话如果这么说，for ··· of真滴比较牛逼，因为for循环内置的是一个迭代器，通过Symbol.iterator对可迭代对象的循环。
这里就有一个面试常问到的地方，就是for···of和for···in有什么区别？
当然是遍历的值不同了（of：键值对，in：key值），还有原理实现上的不同，for···of只能对可迭代对象进行遍历循环。for···of可以视为一个迭代器，那么他也有迭代器能终止迭代的属性（break throw continue return）
注意：
原文：https://www.cnblogs.com/1258478q/p/14623106.html