js Promise

image.png
image.png image.png
image.png

then()必须返回一个promise实例才能链式操作
1.异常捕获 then只接受一个参数
catch不仅能捕捉到 throw new Error('this is error') 逻辑语法的错误
如果是本身请求有问题的话 也可以捕捉到 需要在reject('加载失败') 返回错误信息

image.png
2.也可以在then里面传两个参数，第一个成功的，第二个是失败的 上一个then需要把结果retrun 下边的then才能接受到 image.png image.png

3.多个串联 有先后顺序

image.png

4.all:返回的结果是个数组 race：返回的结果只有一个

image.png

promise实现队列

image.png

arr.reduce(callback[, initialValue]) — More From MDN
callback（一个在数组中每一项上调用的函数，接受四个函数：）
previousValue（上一次调用回调函数时的返回值，或者初始值）
currentValue（当前正在处理的数组元素）
currentIndex（当前正在处理的数组元素下标）
array（调用reduce()方法的数组）
initialValue（可选的初始值。作为第一次调用回调函数时传给previousValue的值）

image.png image.png image.png

一、promise.resolve()

1、返回一个fulfilled的promise实例，或原始promise实例。

（1）参数为空，返回一个状态为fulfilled的promise实例

（2）参数是一个跟promise无关的值，同上，不过fulfilled响应函数会得到这个参数。

（3）参数为promise实例，则返回该实例，不做任何修改。

（4）参数为thenable，立刻执行它的.then()函数

二、promise.reject()

1、返回一个rejected的promise实例，或原始promise实例。

（1）参数为空，返回一个状态为rejected的promise实例

（2）参数是一个跟promise无关的值，同上，不过rejected响应函数会得到这个参数。

（3）参数为promise实例，则返回该实例，不做任何修改。

（4）与promise.resolve相比，不认thenable。

三、promise.race()

1、类似promise.all(),区别在于它有任意一个完成就算完成。

2、常见用法

（1）把异步操作和定时器放在一起

（2）如果定时器先触发，就认为超时，告知用户。

image.png

四、promise.all()：批量执行

1、Promise.all([p1, p2, p3, …])用于将多个promise实例，包装成一个新的promise实例。

2、返回的实例就是普通promise

3、它接收一个数组作为参数。

4、数组里可以是promise对象，也可以是别的值，只有promise对象会等待状态改变。

5、当所有子promise都完成，该promise完成，返回值是全部值的数组。

五、把任何异步操作包装成promise

1、假设需求：

（1）用户点击按钮，弹出确认窗体。

（2）用户确认和取消有不同的处理。

image.png

async和await

image.png