在 ReactJS 中使用“then”

Question

为了便于解释“then”的重要性，谁能告诉我这段代码中发生了什么？

fetchComments().then(response => {
      this.setState({
        comments: response.comments
      });
    });

Answer 1

fetchComments返回一个承诺（可能；它可能只是一个“thenable”*）。承诺是将在稍后的时间点（通常是**）解决或拒绝的东西。then用于连接一个处理程序，该处理程序将在承诺解决时调用（并且可选地在它被拒绝时，如果您将第二个函数传递给then；否则您将使用catch）。

在这种情况下，该代码表示​​，当/如果返回的承诺fetchComments解析时，使用解析值使用该解析值的属性设置React 组件的状态comments。

在这篇 MDN 文章和Promises/A+ 规范中更多关于Promise 的信息。

* 请参阅 Promises/A+ 规范以了解什么是“thenable”。

** 如果您then在已经解决或拒绝的承诺上使用，JavaScript 中的本机承诺保证您的处理程序仍将被异步调用。一些早期的类似 Promise 的实现并非总是如此，它们要么异步调用你的回调（如果 promise 还没有解决），要么同步调用（如果已经解决），这是......混乱且无益的。JavaScript 的原生承诺和任何真正好的承诺库都保证一致的回调行为。

Answer 2

我回答这个问题有点晚，但有时可能对某人有帮助。

开始吧：

从您粘贴上面的代码，我可以给你一个提示，每当你看到一个关键字，然后在任何JavaScript代码片段，即使用承诺异步函数。

Promise : 是存储关于这些事件是否已经发生的信息的对象，如果发生了，他们的结果是什么。也是两者。所以当我们创建任何异步函数时，promise 是在这些异步函数中创建的。

Promise.then : then允许我们将事件处理程序分配给一个承诺。根据我们提供的参数，我们可以处理成功、失败或两者兼而有之， then 的返回也是一个承诺，这意味着它可以处理更多事件。

而最后去上面的代码，fetchComments是一个承诺这是一个异步函数，当响应是resolve正在更新评论的状态，另外在这里，我们也可以用处理错误场景.catch通过添加另一甚至then

最后，下面的链接有一个很好的解释：

关于 Promise 然后在 javascript 中的一个很好的教程在这里