1.Promise介绍与基本使用
-
作用:Promise是异步编程的一种解决方案,promise对象用来封装一个异步操作并可以获取其成功/失败的结果值
-
常见的就是异步编程就是网络请求,定时器等
Promise定时器体验
// resolve 解决 函数类型的数据
// reject 拒绝 函数类型的数据
const p = new Promise((resolve,reject) => {
// 内部封装一个异步任务
setTimeout(() => {
let n = rand(1, 100);
if(n <= 30) {
// 成功时调用resolve
resolve(n) // 将promise对象的状态设置为 成功
} else {
// 失败时调用reject
reject(n) // 将promise对象的状态设置为 失败
}
}, 2000)
}
// 我们需要用到promise对象上的方法then()来进行输出
// 两个参数都是函数类型的值,第一个函数是对象成功时的回调,第二个参数是对象失败时的回调
p.then((value) => {
console.log('成功数字' + value)
},(reason) => {
console.log('失败数字' + reason)
})
// 补充 除了封装异步参数之外还可以获取异步任务当中成功或者失败的结果值 例如上面n被当作结果值,然后在
// 下面的回调函数当中就可以拿到并处理这个结果值 value和reason是约定俗成的参数命名
Promise的状态改变
实例对象中的一个属性 [PromiseState] 其对应的值有如下三个
- pending 未决定的(默认)
- resolved / fullfilled 解决
- rejected 失败
状态的改变只有如下这两种,且一个promise对象只能改变一次
- pending变为resolve
- pending变为rejected
Promise对象的值
实例对象中的一个属性 [PromiseResult] 保存着异步任务【成功/失败】的结果
如下两个函数可以修改这个属性的值
- resolve
- reject
如Promise定时器体验中传入参数n设置这个属性的值,然后在then()方法回调中取出这个属性的值
Promise的工作流程
2.Promise API
- Promise.prototype.then方法:(onResolved,onRejected) => {}
(1) onResolved函数:成功的回调函数(value) => {}
(2) onRejected函数:失败的回调函数(reason) => {}
补充:返回值是一个新的promise对象 - Promise.pprototype.catch方法:(onRejected) => {}
(1) onRejected函数:失败的回调函数(reason) => {} - Promise.resolve方法(value) => {}
(1) value:成功的数据或promise对象
说明:返回一个成功/失败的promise对象,如果传入的参数为非promise类型的对象,则返回的结果为成功的promise对象,如果传入的参数为promise对象,则参数的结果决定了resolve的结果 - Promise.reject方法(value) => {}
(1) reason:失败的原因
说明:返回一个失败的promise对象 - Promise.all方法:(promise) => {}
(1) promise:包含n个promise的数组
说明:返回一个新的promise,只有所有的promise都成功才成功,只要有一个失败就直接失败 - Promise.race方法:(promises) => {}
(1) promises:包含n个promise的数组
说明:返回一个新的promise,第一个完成的promise的结果状态就是最终的结果状态