JavaScript 里的 Promise Chaining
JavaScript Promise
2023-09-14 09:03:56 时间
Promise 通常被定义为最终将可用的值的代理(proxy)。
问题背景
回调:我们有一系列异步任务要一个接一个地执行——例如,加载脚本。 我们怎样才能很好地编码呢?
Promise 提供了一些方法来做到这一点:Promise 链。
它看起来像这样:
new Promise(function(resolve, reject) {
setTimeout(() => resolve(1), 1000); // (*)
}).then(function(result) { // (**)
alert(result); // 1
return result * 2;
}).then(function(result) { // (***)
alert(result); // 2
return result * 2;
}).then(function(result) {
alert(result); // 4
return result * 2;
});
这个思路是结果通过 .then 处理程序链传递。
其流程是:
- 初始 promise 在 1 秒内 resolve (*)
- 然后调用 .then 处理程序,then 方法返回一个新创建的 Promise(以 2 值解析)。
- 下一个 then 获取前一个的结果,对其进行处理(加倍)并将其传递给下一个处理程序。
以此类推。
切记,每次调用 .then
都会返回一个新的 Promise,这样我们就可以调用下一个 .then
了。
当处理程序返回一个值时,它成为该 Promise 的结果,因此下一个 .then 被调用。
初学者经常犯的错误,对同一个
promise 对象反复调用 then 方法。这并不是 Promise 的链式调用。
let promise = new Promise(function(resolve, reject) {
setTimeout(() => resolve(1), 1000);
});
promise.then(function(result) {
alert(result); // 1
return result * 2;
});
promise.then(function(result) {
alert(result); // 1
return result * 2;
});
promise.then(function(result) {
alert(result); // 1
return result * 2;
});
我们在这里所做的只是对一个 Promise 的几个处理程序。 他们不会将结果传递给对方; 相反,他们独立处理它。
所有 .then 在同一个 Promise 上得到相同的结果——那个 Promise 的结果。 所以在上面的代码中所有 alert 显示相同值:1。
在实践中,我们很少需要多个处理程序来处理一个 Promise。 chaining 调用的使用频率更高。
相关文章
- javascript内置对象速查(一)
- JavaScript浮点运算的问题
- Windows Store App JavaScript 开发:页面加载
- javascript语法
- Javascript加载速度慢解决办法
- [Javascript] Memoization
- [ES2019] Use JavaScript ES2019 flatMap to Map and Filter an Array
- [Javascript] Convert a Callback-Based JavaScript Function to a Promise-Based One
- [RxJSv& Javascript] forkJoin (reactive Promise.all) & Map
- javascript document.write
- [Javascript] Wait for the Fastest JavaScript Promise to Be Fulfilled with Promise.any()
- [Javascript] Check Promise is Promise
- [Javascript] Use a custom sort function on an Array in Javascript
- [Javascript] Promise-based functions should not throw exceptions
- javascript: 用图片加载演示promise的应用(chrome 107.0.5304.110)
- 使用关键字创建具有局部作用域的JavaScript变量
- 快速排序(Quicksort)的Javascript实现
- 使用 Promise 来改写 JavaScript 的加载逻辑