如何處理現代JavaScript中的錯誤和承諾

始終使用.catch（）處理承諾拒絕並防止未經手的拒絕。 2。使用async/等待嘗試/捕獲以進行可讀的錯誤處理，以確保在嘗試塊中等待所有承諾。 3。 。 4.在瀏覽器中使用“未置換拒絕”或在node.js中使用“未徵用”以進行調試，但始終明確處理拒絕。 5。使用Promise.All（）所有承諾必須成功，並且Promise.allSettled（）優雅地處理部分失敗。 6.拋出描述性的上下文錯誤，以改善調試和維護跨層的錯誤上下文。始終應用這些實踐可確保可靠，可維護的異步JavaScript代碼。

正確處理錯誤和承諾在現代JavaScript中至關重要，尤其是在使用異步操作（例如API呼叫，文件處理或計時器）時。如果無法正確管理，則被拒絕的拒絕或無聲失敗可能會導致難以追踪的錯誤。這是使用現代模式有效處理錯誤並有效承諾的方法。

1。使用.catch()用於承諾拒絕處理

每當您與Promise合作時（無論是從fetch返回， async函數還是基於自定義的邏輯）始終使用.catch()處理潛在的拒絕。

 fetch（'https://api.example.com/data'）
  。
  。
  .catch（錯誤=> {
    Console.Error（發生錯誤：'，錯誤）；
  }）;

即使您期望承諾能夠成功解決，網絡問題，CORS問題或畸形的JSON也會引起拒絕。跳過.catch()風險可能會拒絕承諾，這可能會使您的應用在嚴格的環境中崩潰。

？提示： .catch()從鏈中的任何前一步都捕獲錯誤 - 無論是網絡故障，解析錯誤，甚至是.then()回調中的異常。

2。使用async/await try/catch

現代JavaScript偏愛async/await語法，以清潔，更可讀的異步代碼。但是，使用這種樣式，您必須使用try/catch塊來處理錯誤。

異步函數fetchdata（）{
  嘗試 {
    const響應=等待提取（'https://api.example.com/data'）;
    const data =等待響應.json（）;
    console.log（data）;
  } catch（錯誤）{
    Console.Error（'錯誤獲取數據：'，錯誤）;
  }
}

這種方法反映了同步錯誤處理，並使調試更容易。 try塊內部的任何被拒絕的承諾都會跳到catch塊。

⚠️常見錯誤：忘記在async功能中的承諾await 。這不會立即拋出 - 它會返回被拒絕的承諾，可能繞開您的try/catch 。總是await內部try 。

3。始終處理.then()回調中的錯誤

即使在.then()中，也可能發生錯誤 - 例如解析邏輯，無效的數據轉換或手動throw語句。這些自動被承諾鏈捕獲，可以在下游處理。

 fetch（'/data.json'）
  然後（res => res.json（））
  。然後（data => {
    如果（！data.userid）{
      投擲新錯誤（“缺少用戶ID”）；
    }
    返回數據；
  }）
  .catch（err => {
    Console.Error（'驗證或解析失敗：'，err）;
  }）;

這意味著您不需要嵌套.catch() try/catch .then()

4。避免拒絕

當拒絕承諾時，會發生無人拒絕，但沒有.catch() 。現代瀏覽器和Node.js對這些記錄警告，未來版本可能會將其視為運行時錯誤。

全球監視未經處理的拒絕（用於開發或記錄）：

在瀏覽器中：

 window.addeventlistener（'Unhandledledection'，event => {
  console.warn（'未經手的承諾拒絕：'，event.reason）;
  //可選地防止默認（抑制警告）
}）;

在node.js中：

 process.on（'Unhandled Repoction'，（原因，承諾）=> {
  Console.Error（'未經拒絕的拒絕：'，Promise，'原因：'，原因）;
  //日誌或發送到錯誤跟踪服務
}）;

？將其用於調試或監視，但不要依靠它作為您的主要錯誤處理。始終明確處理拒絕。

5。使用Promise.all()和Promise.allSettled()明智

處理多個承諾時：

• Promise.all()失敗了 - 一種拒絕會導致整個事情拒絕。
• Promise.allSettled()等待所有人完成，無論成功或失敗如何。

根據您的需求選擇：

 //第一個錯誤失敗
嘗試 {
  const結果=等待承諾。
    fetch（'/api/user'），
    fetch（'/api/posts'），
  ）;
} catch（錯誤）{
  //一個失敗的請求失敗了一切
}

 //優雅地處理部分失敗
const結果=等待承諾。
  fetch（'/api/user'），
  fetch（'/api/posts'），
）;

results.foreach（（結果，索引）=> {
  if（result.status ==='earlield'）{
    console.log（'成功：'，result.value）;
  } 別的 {
    Console.Error（“失敗：”，Result.Reason）;
  }
}）;

想要彈性時使用allSettled() ；當所有操作都必須成功時，請使用all() 。

6。拋出有意義的錯誤

而不是通用消息，而是提供上下文，以便調試更容易。

異步函數getuser（id）{
  嘗試 {
    const res =等待提取（`/api/users/$ {id}`）;
    如果（！res.ok）{
      投擲新錯誤（`http $ {res.status}：$ {res.statustext}`）;
    }
    返回等待res.json（）;
  } catch（錯誤）{
    投擲新錯誤（```無法獲得用戶$ {id}：$ {error.message}`）;
  }
}

這保留了出了問題和何處的鏈條。

基本上，乾淨的承諾錯誤處理歸結為一致性：始終處理拒絕，更喜歡async/await try/catch的可讀性，而永遠不要忽略失敗的可能性。它不是浮華的，但可以使您的應用程序保持穩定。

以上是如何處理現代JavaScript中的錯誤和承諾的詳細內容。更多資訊請關注PHP中文網其他相關文章！