为什么来自JavaScript fetch API的响应对象是一个承诺？

Question

使用JavaScript fetch API从服务器请求时，您必须执行类似

的操作

fetch(API)
  .then(response => response.json())
  .catch(err => console.log(err))

在这里，response.json()正在履行其承诺。

问题是，如果你想捕获404的错误，你必须解决响应承诺，然后拒绝获取承诺，因为只有在catch时才会结束网络错误。所以fetch调用就像

fetch(API)
  .then(response => response.ok ? response.json() : response.json().then(err => Promise.reject(err)))
  .catch(err => console.log(err))

这是一个更难以阅读和推理的东西。所以我的问题是：为什么需要这个？将承诺作为回应价值有什么意义？有没有更好的方法来解决这个问题？

Answer 1

如果您的问题是＆＃34;为什么response.json()会回复承诺？＆＃34;然后@Bergi在评论中提供线索：＆＃34;它等待身体加载＆＃34;。

如果您的问题是＆＃34;为什么不是response.json一个属性？＆＃34;那么那将需要fetch延迟返回其响应，直到正文已加载，对某些人来说可能没问题，但不是每个人都可以。

此polyfill应该可以满足您的需求：

var fetchOk = api => fetch(api)
  .then(res => res.ok ? res : res.json().then(err => Promise.reject(err)));

然后你可以这样做：

fetchOk(API)
  .then(response => response.json())
  .catch(err => console.log(err));

反向不能进行多层填充。

Answer 2

因为有时我们需要对加载过程进行精确控制（从接收第一条数据到接收最后一条数据）。

在现实世界中，json 可能不是一个很好的例子，因为它相对较小。但是成像一个大图片逐渐加载的情况（从马赛克到清晰）。那样的话，等到数据接收完毕再通知程序就晚了。

由于 fetch() 是一个比较低级的 api，否则你可以使用 axios 之类的。