你是怎么理解ES6中 Promise的?使用场景?
作用/目的:
解决回调地狱,将多层嵌套操作改为链式操作,降低了编码难度,提升了代码的可读性
状态:有三种状态pending (进行中) fulfilled (已成功) rejected (已失败)
用法:Promise对象是一个构造函数,用来生成Promise实例
const promise = new Promise(function(resolve, reject) {});
new Promise((resolve, reject)=>{resolve(value)})
resolve为成功,接收参数value,状态改变为fulfilled,不可再次改变。
new Promise((resolve, reject)=>{reject(reason)})
reject为失败,接收参数
reason,状态改变为rejected,不可再次改变。
实例方法:
then()-->实例状态发生改变的回调函数,第一个参数是resolved状态的回调函数,第二参数是rejected状态的回调函数,then方法返回的是一个新的Promise实例,也就是promise能链式书写的原因
catch()-->用于指定发生错误时的回调函数
finally()-->用于指定发生错误时的回调函数
构造函数方法:
Promise构造函数存在以下方法:
- all()-->
Promise.all()方法用于将多个Promise实例,包装成一个新的Promise实例
const p = Promise.all([p1, p2, p3]);
特征:
只有p1、p2、p3的状态都变成fulfilled,p的状态才会变成fulfilled
只要p1、p2、p3之中有一个被rejected,p的状态就变成rejected
-
race()-->
Promise.race()方法同样是将多个 Promise 实例,包装成一个新Promise 实例 特征:只要p1、p2、p3之中有一个实例率先改变状态,p的状态就跟着改变 -
allSettled()-->
romise.allSettled()方法接受一组 Promise 实例作为参数,包装成一个新的 Promise 实例,只有等到所有这些参数实例都返回结果,不管是fulfilled还是rejected,包装实例才会结束 -
resolve()-->将现有对象转为
Promise对象 -
reject()-->
Promise.reject(reason)方法也会返回一个新的 Promise 实例,该实例的状态为rejected -
try()
使用场景:
- 将图片的加载写成一个
Promise,一旦加载完成,Promise的状态就发生变化 - 通过链式操作,将多个渲染数据分别给个
then,让其各司其职。或当下个异步请求依赖上个请求结果的时候,我们也能够通过链式操作友好解决问题 - 通过
all()实现多个请求合并在一起,汇总所有请求结果,只需设置一个loading即可 - 通过
race可以设置图片请求超时