如何使用 Promise

上节课我们介绍了Promise的两大属性以及Promise的基本工作流程，那么这节课我们来说一说如何来使用Promise。

`Promise API`

首先我们先来介绍一下Promise的一些API。那么Promise常见的API有哪些呢：

Promise构造函数：Promise(excutor){}
Promise.prototype.then方法：(onResolved, onRejected) => {}
Promise.prototype.catch方法：onRejected => {}
Promise.resolve方法：value => {}
Promise.reject方法：reason => {}
Promise.all方法：promises => {}
Promise.race方法：promises => {}

`Promise`构造函数

构造函数是我们最常用的一个API了，因为不用这个API我们怎么初始化Promise对象呢？所以这算是我们必用的一个API，那么这个API的结构是什么样子呢：

excutor函数，(resolve, reject) => {}这个是Promise构造函数的参数，而且也是一个函数，可以用箭头函数也可以用匿名函数
resolve函数，value => {}这是excutor函数的一个参数，由内部定义，供异步任务成功时调用
reject函数，reason => {}这是excutor函数的另一个参数，由内部定义，供异步任务失败时调用

另外还有一点要说明一下：excutor函数会在Promise内部立即同步调用，异步任务在excutor中执行

`Promise.prototype.then`方法

这个就是我们在实例化一个Promise对象之后要调用的then方法，我们知道then方法是用来指定回调的，这个方法的结构我们其实也比较熟悉了：

onResolved函数：value => {}，这是当我们异步任务成功时调用的函数
onRejected函数：reason => {}，这是当我们异步任务失败时调用的函数

而且这个方法会返回出一个新的Promise对象，当然我们并没有接触过，后面我们再对这方面来做相应的介绍。

`Promise.prototype.catch`方法

这个方法我们目前还没用过。当然了这个方法也是用来指定回调的，但是这个方法只能指定失败的回调。我们来看一下它的结构：

onRejected函数：reason => {}，异步任务失败时的回调函数

我们来演示一下：

let p = new Promise((resolve, reject) => {
  reject("error");
});
p.catch(reason => console.log(reason));

我们来看这段代码，我们实例化了一个Promise对象，并且直接执行了reject函数，那么Promise对象的状态就会被修改成rejected，然后我们再调用catch方法，并打印出我们传入的reason，我来看一下效果：

控制台中成功打印出了我们传入的reason其实catch方法是通过then方法来做了一个独立的封装，所以说catch方法也会返回一个新的Promise对象。

`Promise.resolve`方法

这个方法和我们用过很多次的那个Promise中执行异步任务成功时调用的函数不是同一个函数，这个方法有点特殊，这个方法不属于Promise的实例对象。那么我们应该也能猜到，这个方法属于Promise函数对象自身方法，和类的静态方法类似。我们之前说的then方法以及catch方法这两个方法都属于Promise实例对象，和类方法类似，类方法存放在原型对象上供实例对象使用，这里也是一样。而resolve方法不一样。这个方法是属于Promise函数自身的，相当于静态方法。

那么这个方法有什么作用呢？我们先来看一下这个结构：value => {}

这个方法可以接收一个参数value，然后返回一个新的状态为成功或者失败的Promise对象，我们来演示一下：

let p = Promise.resolve(123);
console.log(p);

我们调用Promise.resolve方法并且声明一个变量p来接收该方法的返回值，然后打印p看一下结果：

我们看一下，控制台中打印出了p是一个Promise对象，状态是成功的，而且值就是我们传入的值，我上面说过resolve方法会返回一个状态为成功或者失败的Promise对象，我们现在生成的是成功的。那么什么时候是失败的呢？

我们这里讲一下：

只要我们在调用Promise.resolve方法的时候传入的参数不是Promise对象，那么返回的新的Promise对象的状态就都是成功的，而且新的Promise的结果就是我们传入的值。

如果我们在调用Promise.resolve方法的时候传入的是一个Promise对象，那么返回的新的Promise对象的值就是我们传入的Promise的值，状态也是我们传入的Promise对象的状态。

我们来演示一下：

let p = Promise.resolve(
  new Promise(
    (resolve, reject) => { 
      reject("Error") 
    }
  )
);
console.log(p);

我们来看一下这段代码，我们在调用Promise.resolve方法是传入了一个失败的Promise对象，我们来看一下结果是什么样子：

我们看到控制台输出的是会有个失败的Promise对象，而且结果值是我们传入的Promise对象的结果值。但是下面还有一个报错是这么回事呢？因为我们这里有一个失败的Promise对象，而我们后续也没有指定相应的回调来处理这个失败的情况导致的报错。

以上就是Promise.resolve方法的介绍

`Promise.reject`方法

这个方法和Promise.resolve方法一样，也相当于静态方法，而且也是用来快速生成一个新的Promise对象。但是这个方法只能生成状态为失败的Promise对象。这个方法的结构也很简单，reason => {}接收reason参数，该参数是失败的原因，返回一个失败的Promise对象。而且生成的Promise对象的结果值就是我们传入的值。

这里要注意的一点是，如果我们传入的是一个Promise对象，不论传入的这个对象是成功的还是失败的，我们生成的新的Promise对象都是失败的，而且结果是我们传入的Promise对象，而不再是Promise对象的结果值了。

`Promise.all`方法

这个方法也相当于静态方法，这个方法的结构也比较简单：

promises => {}这个方法会接受一个参数，但是这个参数是一个数组，这个数组里面都是Promise对象，而这个方法的返回结果也是一个Promise对象，但是返回的Promise对象的状态就要由这个数组参数来决定了，只有当数组中所有的Promise对象都是成功的时候，返回的Promise对象才是成功的，否则返回的Promise对象就是失败的。

但是如果说数组中所有的Promise对象都是成功的，那么返回的Promise对象的结果是什么呢？如果返回的Promise对象是成功的，那么数组中所有的Promise的结果会组成一个新的数组，来作为返回的Promise对象的结果。如果返回的Promise对象是失败的，那么返回的Promise对象的结果就是数组中失败的Promise对象的结果。

我们要注意的一点是，如果是数组中有多个Promise对象都是失败的，那么返回的Promise对象的结果是数组中按顺序第一个失败的Promise对象的结果。

`Promise.race`方法

这个方法和Promise.all方法类似，首先也相当于静态方法，其次结构一样，接受一个数组做参数，数组中都是Promise对象，并且返回一个新的Promise对象。

但是呢，这个数组中这么多Promise对象第一个完成的Promise对象的状态决定了Promise.race方法返回的Promise对象的状态。只要第一个完成的Promise对象是成功的那么的返回的新的Promise就是成功的。而且第一个完成的Promise的结果也就会是返回的Promise对象的结果。

以上便是我们Promise中常用的API

Copyright statement：The articles of this site are all original if there is no special explanation, indicate the source please when you reprint.

Link of this article：https://work.lynchow.com/article/apis_of_promise/

如何使用 Promise

Promise API

Promise构造函数

Promise.prototype.then方法

Promise.prototype.catch方法

Promise.resolve方法

Promise.reject方法

Promise.all方法

Promise.race方法