JavaScript 中的 Promise：新手入门必看

Promises 提供了一种在单线程语言 JavaScript 中编写异步操作的方法。

以下文章简要介绍了 Promises 的概念。Promises 对 JavaScript 来说比较新（在ES6中引入），而且经常被误解。这个概念基本上是对熟悉的想法进行重新利用，以打造出别致的品牌。

Promises 是一种执行异步代码的方法。由于 JavaScript 是一种单线程语言，因此必须创建工具来实现这一点，因为它本身并不会实现。

我将通过两个详细示例来说明 Promise 是什么样子、.then语句如何链接在一起、什么原因导致.catch触发以及它可以在何处触发。最后一个主题是当 Promise 在多行代码中执行时的执行顺序，以及从外部 API 来看成功的 Promise 解析与失败的 Promise 是什么样子。

异步代码有何不同

同步代码很容易理解。它就像是自己编写的一样。

我先写下这一行。现在它先被读出。

哇哦，我们到了。此行现在正在执行。

但使用异步代码，代码文件更像是食谱。阅读一点，称量，切碎，然后添加更多大蒜……有说明、操作和文本，这些行可能以按顺序阅读开始，但不同的过程比其他过程花费的时间更长。尽管如此，应用程序或晚餐过程绝不会因为服务器响应或虾串花费的时间比预期的要长而停止。

Promise 的剖析

Promise 是一个表示最终完成异步操作的对象。它有三种状态：

• 待定：这是起点。“承诺”即使应用程序继续执行文件中更下方的代码，在某个时刻也会有这个问题的答案。

• 已实现/已解决：承诺已成功解决。满足的条件为真或已返回数据。

• 失败/拒绝：如果在履行承诺期间发生错误，则为承诺的结果。

另外，了解这些方法：

• .then：用于处理成功的承诺的 JavaScript 方法。

• .catch：如何捕获错误。

创建一个新的 Promise 类，其中包含两个参数，分别是 resolve 和 rejection。在这个非常基本的例子中，有一个值。如果字符串值正确，它将解析为“正确”，如果不正确，它将拒绝“错误”。很简单。

让我们履行诺言吧。

如果条件语句为假，则结果如下。

这是非常基础的，并且不太可能成为承诺的用例。

避免回调地狱

回调地狱：一个含糊但描述性的术语。回调太多。深度嵌套。功能通常不会受到影响，但可读性是一场噩梦，并且往往会损害功能，尤其是在代码更新时，尤其是当其他工程师正在处理它时。

上面的图片是回调地狱的开始。如果你谷歌一下回调地狱，你会发现很多更糟糕的图片，由于版权原因，本文不便一一列举。

上面的例子是基于第一个例子的。这个函数接受一个数据结构，如果它实际上是一个数组，它会解析其元素的总和，如果不是，则拒绝承诺。答案是 console.log 29。

如果传入的是字符串会怎么样？

传入 {e}  将返回错误作为错误对象，这在更高级的用例中很有用。

完美，成功了。

如果我们想取和，然后除以 2 求余数，再减去 50，该怎么办？.thens可以串联起来，如下所示。继续将数据从一个传递到另一个，然后继续。

控制台日志如下：

但如果发生错误，例如未定义的变量被其中一个值减去，则会显示错误对象。

很好的例子，但像第一个一样，也不是异步代码。

异步示例——HTTP 请求

对于此示例，我使用的是星球大战 API。以下是代码：

控制台日志如下所示：

但是如果代码稍微改变一下，将延迟时间从 1 秒改为 1/4 秒：

console.logs 将如下所示：

下面是在 API 请求中接收数据时承诺链的示例。

如果向错误的 API 发出了请求，例如： 

然后，你可以使用 console.log 输出特定消息或整个错误对象。本例中的错误对象如下所示：