ES6总结系列之 Promise对象 篇
1. 含义
何为 Promise?
Promise 是异步编程的一种解决方案
Promise 简单说就是一个容器,里面保存着某个未来才会结束的事件(通常是一个异步操作)的结果
Promise 两个特点:
①对象的状态不受外界影响,只有异步操作的结果,可以决定当前是那种状态pending(进行中), fulfilled(已成功), rejected(已失败) ②状态只改变一次,状态转变只有两种可能,改变后称resolved(定型) 1)pending --> fulfilled 2)pending --> rejected
Promise 三个缺点:
①无法取消Promise, 一旦新建它就会立即执行,无法中途取消 ②如果不设置回调函数,Promise内部抛出的错误,不会反应到外部 ③当处于pending状态时,无法得知目前进展到哪一个阶段(刚刚开始还是即将完成)
2. 基本用法
Promise 对象是一个构造函数,用来生成 Promise 实例
const promise = new Promise(function(resolve, reject) {
// ... some code
if (/* 异步操作成功 */){
resolve(value);
} else {
reject(error);
}});
-
创建实例 ①
resolve,reject是两个函数,有JavaScript引擎提供 ②resolve作用,将Promise状态从“未完成”变为“成功”,即从pending转为resolved ③reject作用,从pending转为rejected ④resolve,reject都可向外传出参数 -
实例生成后,可以用then方法分别指定resolved状态和rejected状态的回调函数,第二个参数可不传
promise.then(function(value) {//value为resolve(value)中传出的
// success},
function(error) {//error为reject(error)中传出的
// failure});
3. Promise.prototype.then()
then 方法返回的是一个新的Promise实例,可链式调用,并将return的返回值作为参数传入第二个回调函数
getJSON("/posts.json").then(function(json) {
return json.post;
}).then(function(post) {
// ...
});
4. Promise.prototype.catch()
catch方法是.then(null, rejection)或.then(undefined, rejection)的别名,用于指定发生错误时的回调函数。 一般来说,不要在then()方法里面定义 Reject 状态的回调函数(即then的第二个参数),总是使用catch方法。理由是第二种写法可以捕获前面then方法执行中的错误,也更接近同步的写法(try/catch)
// badpromise
.then(function(data) {
// success
}, function(err) {
// error
});
// goodpromise
.then(function(data) {
//cb // success
})
.catch(function(err) {
// error
});
5. Promise.prototype.finally()
finally()方法用于指定不管 Promise 对象最后状态如何,都会执行的操作。该方法是 ES2018 引入标准的。
promise
.then(result => {···})
.catch(error => {···})
.finally(() => {···});
6. Promise.all()
Promise.all() 用于批量处理 Promise,并包装成一个新的 Promise 实例
const p = Promise.all(p1, p2, p3)
p的状态由p1, p2, p3决定:
- 当p1, p2, p3结果都为'fulfilled',p才为'fulfilled'
- p1, p2, p3结果只要有一个为 'rejected' ,p就为 'rejected'
7. Promise.race()
同样是将多个 Promise 实例,包装成一个新的 Promise 实例
const p = Promise.race([p1, p2, p3]);
只要p1、p2、p3之中有一个实例率先改变状态,p的状态就跟着改变(只更第一个改变状态的Promise有关,无视另外的变化)
多用于后台请求超时处理
8. Promise.allSettled()
只有等到所有这些参数实例都返回结果,不管是fulfilled还是rejected,包装实例才会结束
const p = Promise.allSettled([p1, p2, p3]);
多用于所有请求都结束后,关闭加载动画(不管请求成功或失败)
9. Promise.any()
Promise.any() 方法接受一组 Promise 实例作为参数,包装成一个新的 Promise 实例。 只要参数实例有一个变成fulfilled状态,包装实例就会变成fulfilled状态; 如果所有参数实例都变成rejected状态,包装实例就会变成rejected状态。
- 个人Github,欢迎star^_^
- ES6总结系列参考自阮一峰《ECMAScript6入门》