为什么Body.json（）返回Promise？[重复]

Question

我从JS开始，实际上喜欢异步方面（来自Python），但我不确定为什么有些函数返回Promise。具体来说，下面使用getch的代码让我想知道json（）返回了什么：

fetch('https://freegeoip.net/json/8.8.8.8')
  .then((response) => {
    return response.json()
  })
  .then((json) => {
    Object.keys(json).forEach((key) => {
      console.log("got " + key)
    })
  })

除了流之外，我们在get之后得到的HTTP响应是一个文本块，客户端稍后会对其进行解释，以提取标题、正文和其他有趣的元素，作为HTTP内容分析的一部分。

关键是这个文本块是一块的，所以第一个然后是（）已经有了整个响应——为什么JSON主体的解析是异步操作，不同于第二个中的foreach>然后（）？

换句话说，为什么我不能让下面的代码工作？

fetch('https://freegeoip.net/json/8.8.8.8')
  .then((response) => {
    Object.keys(response.json()).forEach((key) => {
      console.log("got " + key)
    })
  })

注意：如果第一个代码没有正确运行，请尝试禁用您的adblocker（使用ERR\u-BLOCKED\u-BY\u-CLIENT）。第二个是故意不正确的。

Answer 1

你说得对——两个片段都做同样的事情。在第一段，以下部分：

.then((response) => {
  return response.json()
})

只是在第一步中处理响应并传递结果。这个简单的案例不需要将其分为两个步骤，所以您可以轻松地使用第二个示例。

在某些情况下，它可能很有用。

Answer 2

您的第二个代码段不起作用，因为响应。json（）akabody。json（）不会立即解析。

这是因为正文。JSON（）流和使用Promise异步返回响应；然后必须由然后（）回调捕获，以便读取/操作。

这就是Promises的本质。

然而，这种语法流仍然可以通过利用asyncawait来实现。

fetch('https://freegeoip.net/json/8.8.8.8')
.then(async (response) => {
  Object.keys(await response.json()).forEach((key) => {
    console.log("got " + key)
  })
})