## 链式调用:基于 Promise 处理多次 Ajax 请求【重要】
实际开发中,我们经常需要同时请求多个接口。比如说:在请求完`接口1`的数据`data1`之后,需要根据`data1`的数据,继续请求接口 2,获取`data2`;然后根据`data2`的数据,继续请求接口 3。
换而言之,现在有三个网络请求,请求 2 必须依赖请求 1 的结果,请求 3 必须依赖请求 2 的结果,如果按照往常的写法,会有三层回调,会陷入“回调地狱”。
这种场景其实就是接口的多层嵌套调用。有了 Promise 之后,我们可以把多层嵌套调用按照**线性**的方式进行书写,非常优雅。也就是说:Promise 可以把原本的**多层嵌套调用**改进为**链式调用**。
代码举例:(多次 Ajax 请求,链式调用)
```html
Document
```
上面代码中,then 是可以链式调用的,后面的 then 可以拿到前面 resolve 出来的数据。
这个举例很经典,需要多看几遍。
## return 的函数返回值
return 后面的返回值,有两种情况:
- 情况 1:返回 Promise 实例对象。返回的该实例对象会调用下一个 then。
- 情况 2:返回普通值。返回的普通值会直接传递给下一个 then,通过 then 参数中函数的参数接收该值。
我们针对上面这两种情况,详细解释一下。
### 情况 1:返回 Promise 实例对象
举例如下:(这个例子,跟上一段 Ajax 链式调用 的例子差不多)
```html
Document
```
### 情况 2:返回 普通值
```html
Document
```
## Promise 的常用 API:实例方法【重要】
Promise 自带的 API 提供了如下实例方法:
- promise.then():获取异步任务的正常结果。
- promise.catch():获取异步任务的异常结果。
- promise.finaly():异步任务无论成功与否,都会执行。
代码举例如下。
写法 1:
```html
Document
```
写法 2:(和上面的写法 1 等价)
```html
Document
```
**注意**:写法 1 和写法 2 的作用是完全等价的。只不过,写法 2 是把 catch 里面的代码作为 then 里面的第二个参数而已。
## Promise 的常用 API:对象方法【重要】
Promise 自带的 API 提供了如下对象方法:
- Promise.all():并发处理多个异步任务,所有任务都执行成功,才能得到结果。
- Promise.race(): 并发处理多个异步任务,只要有一个任务执行成功,就能得到结果。
下面来详细介绍。
### Promise.all() 代码举例
代码举例:
```html
Document
```
### Promise.race() 代码举例
代码举例:
```html
Document
```