在这颗圣诞树中，我们使用更高的作用域保变量 valueA ，因为 valueA 作用域在所有的 then 作用域外面，所以 functionC 可以拿到第一个 functionA 完成的值。
这是一个很有效扁平化 .then 链"正确"的语法，然而，这种方法我们需要使用两个变量 valueA 和 v 来保存相同的值。
方案3：使用一个多余的数组
function executeAsyncTask () { return functionA() .then(valueA => { return Promise.all([valueA, functionB(valueA)]) }) .then(([valueA, valueB]) => { return functionC(valueA, valueB) }) }
在函数 functionA 的 then 中使用一个数组将 valueA 和 Promise 一起返回，这样能有效的扁平化圣诞树(回调地狱)。
方案4：写一个帮助函数
const converge = (...promises) => (...args) => { let [head, ...tail] = promises if (tail.length) { return head(...args) .then((value) => converge(...tail)(...args.concat([value]))) } else { return head(...args) } } functionA(2) .then((valueA) => converge(functionB, functionC)(valueA))
这样是可行的，写一个帮助函数来屏蔽上下文变量声明。但是这样的代码非常不利于阅读，对于不熟悉这些魔法的人就更难了。
使用 async/await 我们的问题神奇般的消失
async function executeAsyncTask () {
const valueA = await functionA()
const valueB = await functionB(valueA)
return function3(valueA, valueB)
}
使用 async/await 处理多个平行请求
和上面一个差不多，如果你想一次执行多个异步任务，然后在不同的地方使用它们的值可以使用 async/await 轻松搞定。
async function executeParallelAsyncTasks () { const [ valueA, valueB, valueC ] = await Promise.all([ functionA(), functionB(), functionC() ]) doSomethingWith(valueA) doSomethingElseWith(valueB) doAnotherThingWith(valueC) }
数组迭代方法
你可以在 map 、 filter 、 reduce 方法中使用async函数，虽然它们看起来不是很直观，但是你可以在控制台中实验以下代码。
1.map
function asyncThing (value) { return new Promise((resolve, reject) => { setTimeout(() => resolve(value), 100) }) } async function main () { return [1,2,3,4].map(async (value) => { const v = await asyncThing(value) return v * 2 }) } main() .then(v => console.log(v)) .catch(err => console.error(err))
2.filter
function asyncThing (value) { return new Promise((resolve, reject) => { setTimeout(() => resolve(value), 100) }) } async function main () { return [1,2,3,4].filter(async (value) => { const v = await asyncThing(value) return v % 2 === 0 }) } main() .then(v => console.log(v)) .catch(err => console.error(err))
3.reduce
function asyncThing (value) { return new Promise((resolve, reject) => { setTimeout(() => resolve(value), 100) }) } async function main () { return [1,2,3,4].reduce(async (acc, value) => { return await acc + await asyncThing(value) }, Promise.resolve(0)) } main() .then(v => console.log(v)) .catch(err => console.error(err))
解决方案：
[ Promise { <pending> }, Promise { <pending> }, Promise { <pending> }, Promise { <pending> } ] [ 1, 2, 3, 4 ] 10
如果是map迭代数据你会看到返回值为 [ 2, 4, 6, 8 ] ，唯一的问题是每个值被 AsyncFunction 函数包裹在了一个 Promise 中
所以如果想要获得它们的值，需要将数组传递给 Promise.All() 来解开 Promise 的包裹。
main() .then(v => Promise.all(v)) .then(v => console.log(v)) .catch(err => console.error(err)) 一开始你会等待 Promise 解决，然后使用map遍历每个值 function main () { return Promise.all([1,2,3,4].map((value) => asyncThing(value))) } main() .then(values => values.map((value) => value * 2)) .then(v => console.log(v)) .catch(err => console.error(err))
这样好像更简单一些？
如果在你的迭代器中如果你有一个长时间运行的同步逻辑和另一个长时间运行的异步任务，async/await版本任然常有用
这种方式当你能拿到第一个值，就可以开始做一些计算，而不必等到所有 Promise 完成才运行你的计算。尽管结果包裹在 Promise 中，但是如果按顺序执行结果会更快。
关于 filter 的问题
你可能发觉了，即使上面filter函数里面返回了 [ false, true, false, true ] ， await asyncThing(value) 会返回一个 promise 那么你肯定会得到一个原始的值。你可以在return之前等待所有异步完成，在进行过滤。
Reducing很简单，有一点需要注意的就是需要将初始值包裹在 Promise.resolve 中
重写基于callback的node应用成