為什麼 Fetch API 的 `.json()` 方法有不同的 Promise 行為？

Fetch API 中的Promise 處理：為什麼.json() 行為不同

使用fetch() API 時，使用.json() 時會出現行為上的細微差異。 json() 方法。這種行為可能看起來違反直覺，所以讓我們深入研究一下根本原因。

.json() 的 Promise 性質

預設情況下，.json() 會傳回解析為 JSON 反應的 Promise身體。這是因為回應正文可能無法立即可用，特別是對於較大的回應或緩慢的連接。 Promise 確保在完全解析 JSON 之前不會執行後續程式碼。

Promise 鍊和值回傳

當 .json() 在 .then() 鏈中使用時，它會傳回 Promise 物件本身，允許連結進一步的操作。但是，當直接從 .then() 處理程序傳回 .json() 時，將會傳回 Promise 的解析值（解析後的 JSON）。這是因為 .then() 處理程序期望接收一個可以進一步操作的值。

範例：

在提供的程式碼片段中：

fetch(url)
  .then(response => {
      return {
          data: response.json(),
          status: response.status
      }
  })
  .then(post => document.write(post.data));

.json() 方法連結在物件文字中，因此它會傳回一個Promise 對象，從而產生post.data屬性

替代語法：

fetch(url)
  .then(response => response.json())
  .then(post => document.write(post.title));

在此範例中，.json() 直接從.then() 處理程序傳回，因此已解析JSON 值立即返回，允許直接存取post.title 屬性。

Promise Chaining 和Nested Promises

為了避免物件文字和直接回傳值之間的差異，您可以使用以下語法：

fetch(url)
.then(response => 
    response.json().then(data => ({
        data: data,
        status: response.status
    })

此方法傳回一個嵌套的Promise，最終解析為所需的物件。

結論

.json() 的 Promise 行為取決於它在程式碼中的使用方式。連結操作時，它會傳回一個 Promise 對象，確保正確的排序。但是，當直接從 .then() 處理程序傳回 .json() 時，將傳回解析值（解析後的 JSON），以便立即使用。理解這種差異對於管理 Promise 和避免程式碼中的意外行為至關重要。

以上是為什麼 Fetch API 的 `.json()` 方法有不同的 Promise 行為？的詳細內容。更多資訊請關注PHP中文網其他相關文章！