Promise Chaining 和 Aync/await 有什麼不同

今天，我對這兩種處理非同步操作的方式之間的區別一無所知，所以我決定閱讀和研究寫這篇文章- 作為對自己的提醒而且，誰知道呢，也許可以幫助其他開發人員更好地理解這種差異。

當時我或多或少知道如何解釋，他們都是做同樣的事情，then()帶來的是解析後的數據，而resolve和reject則用來以成功或錯誤結束。 async/await 必須等待結果才能繼續下一步。這並不完全錯誤，但可以用更好的方式來解釋。

承諾

Promise，顧名思義，就是一個資料回傳的“promise”，會經歷三個主要狀態：

1. Pending：初始狀態，當 Promise 尚未解決或拒絕時。
2. 已完成：操作已成功完成。
3. 已拒絕：操作失敗，錯誤被捕獲。

const minhaPromise = new Promise((resolve, reject) => {
  let sucesso = true; // Apenas um exemplo condicional

  if (sucesso) {
    resolve("Operação concluída com sucesso!");
  } else {
    reject("Ocorreu um erro na operação.");
  }
});

承諾鏈

這是在 async/await 之前處理 Promise 的最常見方式。我們使用 then()、catch() 和 finally() 方法。

• then()：用於接收並操作解析成功的資料。
• catch()：用來處理promise被拒絕時的錯誤。
• finally()：用於執行程式碼，無論結果為何。

minhaPromise
  .then((mensagem) => {
    console.log(mensagem); // "Operação concluída com sucesso!"
  })
  .catch((erro) => {
    console.error(erro); // Se der erro, isso será executado.
  })
  .finally(() => {
    console.log("Finalizando a execução da Promise"); // Sempre será executado.
  });

異步/等待

標記為 async 的函數會自動傳回 Promise，而 await 用於「暫停」執行，直到 Promise 解決。

async function buscarDados() {
  try {
    const response = await fetch("https://jsonplaceholder.typicode.com/todos/1");
    const data = await response.json();
    console.log("Dados recebidos:", data);
  } catch (error) {
    console.error("Erro ao buscar dados:", error);
  }
}

buscarDados();

差別

Promise 鏈會導致程式碼變得非常嵌套，尤其是當我們連續使用多個 then() 時，使閱讀變得更加困難。

Async/await 讓您以更類似於同步程式碼的方式編寫非同步程式碼，使邏輯更易於閱讀和理解。程式碼變得更加清晰，尤其是當我們需要處理多個非同步操作時。

此外，使用 try/catch 和 async/await 來處理錯誤的方式比僅在 Promises 中使用 catch 更直觀。

以上是Promise Chaining 和 Aync/await 有什麼不同的詳細內容。更多資訊請關注PHP中文網其他相關文章！