Promise 是异步编程中最重要的 API 之一，它可以将异步代码变得更加易读和清晰。在 ES9 中，Promise 增加了两个新的实例方法：Promise.prototype.then() 和 Promise.prototype.catch()，这些新的方法可以处理 Promise 的结果，并使代码更加简单和易于维护。
Promise.prototype.then()
Promise.prototype.then() 是一个回调函数，它在 Promise 对象解析时执行。Promise 对象在解决时会传递一个解析值，该值可用于处理结果。
正常情况下，如果 Promise 解决后没有任何问题，我们可以使用 then() 方法来处理结果。例如，假设我们有一个返回 Promise 的函数 fetchUserData()：
function fetchUserData(id) {
return fetch(`/users/${id}`)
.then(res => res.json())
.then(data => {
console.log(`User data:`, data);
});
}这个函数将获取一个用户的 JSON 数据，并在成功时将数据记录到控制台。
现在，我们可以使用 then() 方法调用该函数，并将它的返回值分配给一个变量：
const promise = fetchUserData(123);
promise.then(() => {
console.log(`Fetch completed.`);
});在上述示例代码中，我们首先调用 fetchUserData() 函数，它返回一个可解析的 Promise 对象。我们使用 then() 方法来处理解析之后的结果，将一条日志写入控制台告诉我们 fetchUserData() 函数的请求已经成功解析。
Promise.prototype.catch()
与 then() 方法不同，Promise.prototype.catch() 对象处理 Promise 的任何问题，包括解决和拒绝两种情况。使用 catch() 方法，我们可以在出现错误时处理 Promise。例如，以下代码：
promise.catch(() => {
console.error(`Fetch failed.`);
});在上述示例代码中，我们使用 catch() 方法来处理 Promise 在解析时发生的任何错误。如果发生错误，我们将在控制台中打印一条错误消息，告诉我们 fetchUserData() 函数的请求失败了。
在 Promise 中，我们经常使用 then() 和 catch() 方法来处理异步请求的结果。请注意，我们可以使用 Promise.prototype.finally() 方法在 Promise 运行完毕时执行一些代码，但它不接收任何参数并且不影响 Promise 的解析。
深入理解 Promise.prototype.then() 和 Promise.prototype.catch()
在处理 Promise 的解析和拒绝方面，我们可以将 then() 和 catch() 看作是对同一 Promise 的两个回调函数。这些回调函数可在 Promise 对象解析和拒绝时触发，并处理 Promise 对象传递的值。
- then()：当 Promise 解析时调用。
- catch()：当 Promise 拒绝时调用。
在处理 Promise 时，我们经常使用链式编程模式。Promise 会在链中传递并在每个 then() 方法中调用回调函数，直到遇到一个 catch() 方法处理 Promise 的问题。例如：
fetch(`/users/123`)
.then(res => res.json())
.then(data => { /* 处理数据 */ })
.catch(error => { /* 处理错误 */ });在上述代码示例中，我们使用 fetch() 函数从服务器中提取 JSON 数据。我们使用链式 then() 方法来处理数据，如果出现问题，则使用 catch() 方法来处理错误。如果 Promise 解析或拒绝，它将继续被传递，并在链中执行所有的回调函数。
Promise.prototype.then() 和 Promise.prototype.catch() 的示例代码
以下是 Promise.prototype.then() 和 Promise.prototype.catch() 的完整代码示例：
-- -------------------- ---- -------
-------- ----------------- -
------ ---------------------
--------- -- -----------
---------- -- -
----------------- ------- ------
---
-
----- ------- - -------------------
--------------- -- -
------------------ -------------
---
---------------- -- -
-------------------- ----------
---在上述代码示例中，我们使用 fetchUserData() 函数从服务器提取 JSON 数据。该函数返回一个 Promise 对象，我们在 then() 方法中处理解析之后的数据，在 catch() 方法中处理拒绝或解析期间出现的任何错误。
结论
使用 ES9 中的 Promise.prototype.then() 和 Promise.prototype.catch() 方法能够让我们更好地处理 Promise 的结果。我们可以使用 then() 方法来处理解析时传递的值，在 catch() 方法中处理拒绝和任何错误。在处理 Promise 时，我们通常会使用链式编程模式，以便将 Promise 对象传递到链中，直到找到一个 catch() 方法来处理问题。
来源：JavaScript中文网 ，转载请注明来源 https://www.javascriptcn.com/post/674d4d1da336082f254bd604