在前端开发中，Promise 是一种非常常用的异步编程方式。它使得我们可以更加方便和清晰地处理异步操作，不再需要使用回调函数嵌套带来的可读性问题。在 Promise 中，我们可以通过 then() 方法来处理操作成功的结果，catch() 方法来处理操作失败的结果。
然而，在实际开发过程中，我们难免会遇到一些异常错误。比如说，服务器返回的数据格式不正确，某些关键变量为 undefined 等等。如何在 Promise 中处理这些异常错误，让我们的代码更加稳定，这是本文想要探讨的问题。
Promise 中异常错误的处理
在 Promise 中处理异常错误，我们需要先了解 Promise 的执行流程。当 Promise 对象被创建时，它处于 Pending（等待）状态。当 Promise 中的异步任务执行完成时，Promise 就会进入到 Fulfilled（完成）状态，然后执行 then() 方法中的回调函数。如果异步任务执行失败，Promise 就会进入到 Rejected（拒绝）状态，然后执行 catch() 方法中的回调函数。
而在执行异步任务的过程中，如果遇到了异常错误，比如语法错误、变量未定义等，就会抛出异常。如果这个异常没有被 catch() 方法捕获，就会像普通的异常一样，直接停止程序的执行。
下面，我们就来看一下在 Promise 中常见的两种异常错误，以及如何处理它们。
TypeError 异常
TypeError 异常通常抛出在变量为 undefined 或者 null 时，试图对其进行属性或方法调用时。比如下面例子中的变量 foo 和 bar 都是 undefined，我们试图调用它们的属性或方法，就会出现 TypeError 异常。
let foo; let bar = 'hello'; console.log(foo.length); // TypeError: Cannot read property 'length' of undefined console.log(bar.toUpperCase()); // HELLO
在 Promise 中，如果发生了 TypeError 异常，我们可以将 catch() 方法添加到 Promise 链式调用中，来处理这种异常错误。
-- -------------------- ---- -------
-----------------
-------- -- -
--- ----
------------------------
--
------------ -- -
------------------- -- ---------- ------ ---- -------- -------- -- ---------
--在上面的例子中，我们在 then() 方法中定义了一个没有赋值的变量 foo，并试图调用它的 length 属性。由于 foo 是 undefined，这会抛出 TypeError 异常，但是我们在 Promise 的调用链中添加了 catch() 方法，所以这个异常被捕获了并输出到了控制台。
SyntaxError 异常
SyntaxError 异常通常抛出在代码语法错误的时候，比如缺少分号、括号配对不正确等。比如下面例子中的代码，缺少一个右括号，就会抛出 SyntaxError 异常。
let foo = [
{ name: 'alice', age: 20 },
{ name: 'bob', age: 18 },
{ name: 'charlie', age: 22 }
};
console.log(foo);在 Promise 中，如果发生了 SyntaxError 异常，我们同样可以将 catch() 方法添加到 Promise 链式调用中，来处理这种异常错误。
-- -------------------- ---- -------
-----------------
-------- -- -
--- --- - -
- ----- -------- ---- -- --
- ----- ------ ---- -- --
- ----- ---------- ---- -- -
--
-----------------
--
------------ -- -
------------------- -- ------------ ---------- ----- ---
--在上面的例子中，我们在 then() 方法中定义了一个没有正确闭合的数组 foo，并在下一行输出了它的值。这会抛出 SyntaxError 异常，但是我们同样在 Promise 的调用链中添加了 catch() 方法，所以这个异常被捕获了并输出到了控制台。
Promise 中通过 try-catch 处理异常错误
除了在 Promise 调用链的 catch() 方法中处理异常错误，我们还可以使用 JavaScript 中的 try-catch 语句，来处理 Promise 中的异常错误。
例如，在下面的例子中，我们在 Promise 中使用 try-catch 语句，处理了一个 JSON 格式不正确的异常错误。
-- -------------------- ---- -------
-----------------
-------- -- -
--- -
----- ---- - -- ------- ------- ------ -- ---
----- ------ - -----------------
--------------------
- ----- ------- -
------------------- -- ------------ ---------- ----- - -- ---- -- -------- --
-
--在 try 代码块中，我们定义了一个 JSON 格式的字符串，并试图将其解析成一个 JavaScript 对象 parsed。由于 JSON 格式不正确，这会抛出 SyntaxError 异常，但是我们使用了 try-catch 语句，成功捕获并输出到了控制台。
结语
在实际的开发中，我们难免会遇到各种各样的异常错误。通过本文的学习，相信大家已经对如何在 Promise 中处理异常错误有了更深入的了解。记得在使用 try-catch 语句处理异常错误时，一定要注意 try 代码块中的代码尽量不要包含异步操作，以免影响代码的性能和稳定性。
来源：JavaScript中文网 ，转载请注明来源 https://www.javascriptcn.com/post/6793c2a0504e4ea9bd81ad7f
