原文:JavaScript Promises – The promise.then, promise.catch and promise.finally Methods Explained,作者:Dillion Megida
promise 是 JavaScript 中的一个对象,它将在未来的某个时间产生一个值。这通常适用于异步操作。
在应用程序中,异步操作经常发生。这可以是 API 请求、延迟的数据处理等等。
不必在数据加载之前阻止代码执行,你可以将它们定义为 promise,以便代码的其他部分继续执行。当 promise 完成时,你可以使用其中的数据。
你可以在这篇文章中了解有关 promise 的更多信息。
在某些情况下,promise 会成功,而在其他情况下,它会失败。你如何处理每个结果?
在本文的其余部分,我们将了解 promise 的 then
、catch
和 finally
方法。
JavaScript 中的 promise 状态
一个 promise 具有三种状态:
- pending(进行中):promise 仍在进行中
- fulfilled(已成功):promise 成功解决并返回一个值
- rejected(已失败):promise 返回一个错误
fulfilled 状态和 rejected 状态有一个共同点:无论一个 promise 是 fulfilled 还是 rejected,这个 promise 都是 settled(已完成)。
当 promise 的状态是 fulfilled
当一个 promise 是 fulfilled,你可以在 promise 的 then
方法中访问被处理的数据:
promise.then(value => {
// 使用值进行某些操作
})
将 then
方法想象为“这可行,然后(then)使用从 promise 返回的数据执行此操作”。如果没有数据,可以跳过 then
方法。
then
方法也有可能返回另一个 promise,因此你可以像这样链接另一个 then
方法:
promise
.then(value => {
return value.anotherPromise()
})
.then(anotherValue => {
// 使用这个值
})
当 promise 的状态是 rejected
当一个 promise 的状态是 rejected 时,你可以访问 promise 的 catch
方法中返回的错误信息:
promise.catch(error => {
// 解释错误并可能在 UI 上显示一些东西
})
promise 可能因不同的原因而 rejected。对于 API 请求,可能是网络连接失败,也可能是服务器返回的错误。如果出现错误,此类 promise 的状态将是 rejected。
将 catch
方法想象为“这不起作用,所以我 catch(捕获)了错误,这样它就不会破坏应用程序”。如果你没有发现错误,在某些情况下这可能会破坏你的应用程序。
当一个 promise 已完成
这是 promise 的最后状态。无论 promise 的状态是 fulfilled 还是 rejected,promise 已经完成(settled)。在这个完成的阶段,你终于(finally
)可以做点什么了。
当你想在 promise 完成后做某事时,promise 的 finally
方法很有用。这可以是你可能希望在 then
和 catch
方法中复制的代码。
例如,代替下面这种方式:
let dataIsLoading = true;
promise
.then(data => {
// 用数据做某事
dataIsLoading = false;
})
.catch(error => {
// 在错误的情况下做某事
dataIsLoading = false;
})
你可以像这样使用 finally
方法:
let dataIsLoading = true;
promise
.then(data => {
// do something with data
})
.catch(error => {
// do something with error
})
.finally(() => {
dataIsLoading = false;
})
无论 promise 的结果如何(fulfilled 或 rejected),都会调用 finally
方法。
总结
- promise 有
then
、catch
和finally
方法来根据 promise 的结果做不同的事情,简言之: then
:当一个 promise 成功时,你接着(then)可以使用 resolved 的数据catch
:当一个 promise 失败时,你会捕获(catch)错误,并对错误信息做一些事情finally
:当一个 promise 完成(成功或失败)时,你终于(finally)可以做某事