为什么 fetch 会返回未决的承诺？

Question

我正在使用 fetch 来获取数据，但它一直将承诺返回为待处理。我看过很多关于这个问题的帖子，并尝试了所有的可能性，但没有解决我的问题。我想知道为什么 fetch 将 promise 返回为挂起简要说明 fetch 返回挂起状态的可能情况是什么？

我的一段代码供参考：

fetch(res.url).then(function(u){ 
    return u.json();
})
.then(function(j) { 
    console.log(j); 
});

Answer 1

正如上面的评论之一所说，这是一个在网络处理请求时调用的fetch()承诺。.then()此回调中的参数是当$.then()我们从服务器获取响应时调用的另一个承诺。

也许你应该尝试这样的事情：

fetch(res.url)
    .then(function(serverPromise){ 
      serverPromise.json()
        .then(function(j) { 
          console.log(j); 
        })
        .catch(function(e){
          console.log(e);
        });
    })
    .catch(function(e){
        console.log(e);
      });

或者用 lambda 表示法：

fetch(res.url)
    .then((serverPromise) => 
      serverPromise.json()
        .then((j) => console.log(j))
        .catch((e) => console.log(e))
    })
    .catch((e) => console.log(e));

这是我第一次在StackOverflow上发帖，所以如果我有什么错误或者您有任何建议，请告诉我，谢谢！

Answer 2

Afetch()是网络操作。为了避免在我们得到网络回复之前挂起，我们将其推迟到后台并给自己承诺它最终会完成。

所以fetch(url).then((data) => data.json())意味着我们获取 url，等待数据进入，获取数据的 json 表示并等待（data.json() 也是一个承诺）

在我们得到结果之前，承诺在pending状态中。服务器尚未回复我们的请求。

-- 阅读评论，添加一个错误处理程序可能会很好，因为这就是为什么当前的 fetch 不做任何事情的原因： fetch().then((data) => data.json()).catch((error) => console.log(error))

Answer 3

Promises是一种允许调用者在等待函数结果的同时做其他工作的方法。

请参阅MDN 上的承诺和使用承诺：

Promise 处于以下状态之一：

• 待定：初始状态，既未完成也未拒绝。
• 已完成：表示操作成功完成。
• 拒绝：表示操作失败。

在fetch(url)返回一个Promise对象。它允许使用.then(…)可以响应结果值（对请求的响应）附加“侦听器” 。将.then(…)再次返回Promise对象，它将推动给出结果。

async 和 await

您可以使用 JS 语法糖来使用 Promises：

async function my_async_fn(url) {
    let response = await fetch(url);
    console.log(response); // Logs the response
    return response;
)

console.log(my_async_fn(url)); // Returns Promise

async functions 返回一个 Promise。await关键字将函数的其余部分包装在.then(…). 这里等价于没有await和async：

// This function also returns Promise
function my_async_fn(url) {
    return fetch(url).then(response => {
        console.log(response); // Logs the response
        return response;
    });
)

console.log(my_async_fn(url)); // Returns Promise

再次参见MDN上关于 Promises 的文章。