前端面试题：使用 async/await 时，是否有必要加 try catch?

大叔爱吃猕猴桃

在使用 async/await 时，是否需要添加 try...catch 语句取决于你如何处理错误以及你的应用程序的需求。总体而言，添加 try...catch 是一个好的实践，因为它可以帮助你捕获并处理异步操作中的错误，从而提高代码的健壮性和可靠性。

为什么需要 `try...catch`

捕获异步操作中的错误：

async/await 本质上是基于 Promise 的语法糖。当 await 关键字后面的 Promise 被拒绝（rejected）时，它会抛出一个错误。使用 try...catch 可以捕获这个错误并进行处理，避免未捕获的异常导致程序崩溃。

   async function fetchData() {
       try {
           const response = await fetch('https://api.example.com/data');
           const data = await response.json();
           return data;
       } catch (error) {
           console.error('Error fetching data:', error);
           // Handle the error or throw it again
       }
   }

确保代码的健壮性：

即使错误发生，也可以通过 catch 块进行适当的处理（如记录错误、显示用户友好的错误信息、执行清理操作等），从而确保应用程序能够继续运行或安全地终止。

   async function performTask() {
       try {
           await task1();
           await task2();
           await task3();
       } catch (error) {
           console.error('Error performing tasks:', error);
           // Clean up or notify the user
       }
   }

特定情况下的错误处理：

有时，你可能希望在每个 await 操作后处理错误，而不是在函数级别进行统一处理。在这种情况下，可以为每个异步操作添加 try...catch 块。

   async function processMultipleTasks() {
       try {
           await task1();
       } catch (error) {
           console.error('Error in task1:', error);
           return; // Exit or handle accordingly
       }
       
       try {
           await task2();
       } catch (error) {
           console.error('Error in task2:', error);
       }
       
       // Continue with other tasks
   }

什么时候可以不使用 `try...catch`

上层调用处理：

如果你确定上层调用者会处理错误，或者你希望错误冒泡到更高的层级，可以选择不在当前 async 函数中捕获错误，而是让调用者处理。

   async function fetchData() {
       const response = await fetch('https://api.example.com/data');
       return await response.json();
   }

   async function main() {
       try {
           const data = await fetchData();
           console.log(data);
       } catch (error) {
           console.error('Error in main:', error);
       }
   }

简化代码：
- 在一些简单的或不太关键的异步操作中，你可能选择不处理错误，尤其是在开发阶段。但在生产代码中，还是建议处理错误。