理解和處理unhandledrejection

在JavaScript中，當promise未被處理時，產生的錯誤稱為「unhandledrejection」。這個錯誤通常不會拋出異常，除非您明確處理它。在這篇文章中，我們將探討unhandledrejection的原因、如何檢測到它以及如何處理它。

一、造成unhandledrejection的原因

在JavaScript中，promise是處理異步代碼的一種方式。一個promise會在一個異步操作完成之後返回數據或錯誤。如果操作成功，promise會返回一個值。如果操作失敗，promise會拒絕並返回一個錯誤。如果您沒有處理拒絕狀態，那麼它將成為一個「unhandledrejection」。

下面是一個簡單的promise示例：

const promise = new Promise((resolve, reject) => {
  setTimeout(() => {
    reject("error");
  }, 1000);
});

promise.then(() => {
  console.log("success");
});

在上面的代碼中，promise被拒絕（reject）了，但是我們並沒有處理拒絕狀態。這將導致出現「unhandledrejection」錯誤。

二、檢測unhandledrejection

由於「unhandledrejection」通常不會拋出異常，因此我們需要手動檢測它。在Node.js中，您可以使用「unhandledRejection」事件來檢測它。例如：

process.on("unhandledRejection", (reason, promise) => {
  console.log(reason);
});

在瀏覽器環境中，您可以使用「unhandledrejection」事件來檢測它。例如：

window.addEventListener("unhandledrejection", event => {
  console.log(event.reason);
});

當promise被拒絕後，事件處理程序將被觸發，並且您可以在事件處理程序中使用事件對象（event）來訪問拒絕原因。

三、處理unhandledrejection

當出現「unhandledrejection」錯誤時，最好的處理方式是明確地處理它。您可以通過在Promise上調用catch()方法來處理unhandledrejection錯誤。例如：

const promise = new Promise((resolve, reject) => {
  setTimeout(() => {
    reject("error");
  }, 1000);
});

promise.then(() => {
  console.log("success");
}).catch((reason) => {
  console.log(reason);
});

在上面的例子中，我們添加了catch()方法以處理unhandledrejection錯誤。如果promise被拒絕，catch()方法將捕獲拒絕原因並打印錯誤信息。

您還可以使用 async/await 和 try/catch 來處理unhandledrejection錯誤。例如：

async function asyncFunction() {
  const promise = new Promise((resolve, reject) => {
    setTimeout(() => {
      reject("error");
    }, 1000);
  });
  
  try {
    const result = await promise;
    console.log(result);
  } catch (error) {
    console.error(error);
  }
}

asyncFunction();

在上面的例子中，我們使用async/await和try/catch來處理promise。如果操作失敗，catch塊將捕獲拒絕原因並打印錯誤信息。

四、總結

在處理異步操作時，請始終記住處理拒絕狀態。在JavaScript中，如果您忽略了處理拒絕狀態，那麼將會產生「unhandledrejection」錯誤。您可以使用事件監聽器和catch()方法來檢測和處理這些錯誤。使用try/catch和async/await是處理異步操作的好方法，因為它們可以讓您更容易地處理拒絕狀態。