JavaScript 承諾 && 獲取

承諾

餐廳

JavaScript 中的 Promise 只是一個待處理的任務。這就像在餐廳點餐一樣：當您下訂單時，服務員會承諾為您送上您點的食物。食物端上桌後，承諾就兌現了。如果您訂購的食物因廚房缺少關鍵原料而無法提供，那麼您可以在其他地方吃飯。

這都是異步的。當您坐在桌旁時，您可能正在與朋友聊天或滾動手機。您暫停正在做的事情，以便您可以向服務員下訂單，然後返回之前正在做的事情。

JavaScript Promise 的工作方式類似。由於 JavaScript 是單執行緒的，Promise 允許 JavaScript 引擎在等待某些操作完成時繼續執行其他任務。

JavaScript

Promise 是一種特定類型的物件。所有的承諾都以待處理狀態開始。 Promise 中的回呼函數稱為 executor，定義何時解析或拒絕 Promise。

創造一個承諾：

const order = new Promise((resolve, reject) => {
  if ( foodDelivered) {
    resolve('eat food');
  } else {
    reject('find another restaurant');
  }
})

使用承諾

order
  // wait for the asynchronous value to be fulfilled
  .then(value => console.log(value))
  // handle rejection
  .catch(error => console.log(error))
  .finally(() => console.log('all done'));

拿來

fetch 是 JavaScript 中的內建函數，回傳一個承諾。它發出 HTTP 請求並允許您使用 .then() 和 .catch() 非同步處理回應。

使用 fetch()

fetch('url')
  .then(response => response.json())
  .then(data => console.log(data))
  .catch(error => console.log(error))
  .finally(() => console.log('all done');

呼叫堆疊和事件循環

呼叫堆疊管理同步任務，追蹤它們的執行順序。這相當簡單：任務按照編寫的順序執行。

但是，非同步任務由事件循環處理。事件循環允許非同步程式碼亂序執行，讓 JavaScript 引擎無需等待即可繼續處理其他任務。

例子

這將如何執行？

console.log("console log first!");
setTimeout( _ => console.log("set timeout second!"), 0);
Promise.resolve().then(() => console.log("promise third"));
console.log("console log last!!!");

您可能期望它會按順序執行，但事實並非如此。 JavaScript 事件循環以不同的方式處理這些指令。
結果其實是這樣的：

> console log first!
> console log last!!!
> promise third
> set timeout second!

為什麼？

事件循環重新排程執行優先權：

1. 同步任務（如 console.log("console log first!") 和 console.log("console log last!!!")）會依照它們出現的順序立即執行。
2. 微任務（例如 Promise 回調）被賦予下一個優先級，並在任何其他非同步任務之前執行。
3. 巨集任務（如 setTimeout）最後處理，即使逾時設定為零。

這允許 JavaScript 引擎非同步工作，執行其他任務，而無需等待所有操作立即完成。

Unsplash 上安德魯彼得羅夫 (Andrew Petrov) 的封面照片

以上是JavaScript 承諾 && 獲取的詳細內容。更多資訊請關注PHP中文網其他相關文章！