promise与async-await
程序员文章站
2022-06-26 09:56:33
一. async/await 相对 promise 的优势 拥有更通用的作用域,使得代码有更好的易读性和可维护性。 由于其链式调用,每一个函数都有自己的作用域,如果在多层链式调用的层级中,相隔两层的链需要有相互依赖关系,则需要额外的参数传递。 场景如下: 假设有 p1 、 p2 、 p3 三个异步操 ......
一. async/await 相对 promise 的优势
async/await
拥有更通用的作用域,使得代码有更好的易读性和可维护性。
promise
由于其链式调用,每一个函数都有自己的作用域,如果在多层链式调用的层级中,相隔两层的链需要有相互依赖关系,则需要额外的参数传递。
场景如下:
假设有 p1 、 p2 、 p3 三个异步操作函数, 并且返回的结果都是 promise。
若: p2 依赖于 p1 的结果。 p3 依赖于 p2 和 p1 的结果。采用 promise 链式的代码书写如下:
p1.then(r1 => promise.all([r1, p2(r1)])) .then([r1,r2] => p3(r1, r2))
而用 async/await 的写法则比较明了:
let r1 = await p1(); let r2 = await p2(r1); let r3 = await p3(r1,r2);
再来一个例子:
有4个返回值为promise的异步操作函数, p1、p2、p3、p4。
若:p3依赖 p2 的结果, p4 依赖 p1、p3 的结果。
采用 async/await 的写法如下:
let r1 = await p1(); let r2 = await p2(); let r3 = await p3(r2); let r4 = await p4(r1,r3);
采用promise的写法如下:
promise.all([p1,p2]) .then([r1,r2] => promise.all([r1, p3(r2)])) .then([r1,r3] => p4(r1,r3))
以上写法,promise 的优势在于p1 、p2 彼此无相关依赖,应该并行执行。 而 await 的写法没有做到 p1 、 p2 并行, 故可修改如下:
let r1 = p1(); let r2 = await p2(); let r3 = await p3(r2); let r4 = await p4(await r1,r3);
上一篇: 原生JS实现省市区(县)三级联动下拉列表的详细教程
下一篇: 针灸减肥不主张“饥饿疗法”