Promise对象用于表示一个异步操作的最终状态(完成或失败)以及其返回的值。 ----- MDN
参考文章:ECMAScript 6 入门
进阶文章:深入理解 ES6 Promise
Promise对象
1.Promise有什么用
- Promise 是异步编程的一种解决方案。
- Promise就是一个容器,里面保存着某个未来才会结束的事件(通常是一个异步操作)的结果。
- 从语法上说,Promise 是一个对象,从它可以获取异步操作的消息。
2.Promise有什么特点
- 有三种状态:pending(进行中)、fulfilled(已成功)和rejected(已失败)。
- 只有异步操作的结果,可以决定当前是哪一种状态,任何其他操作都无法改变这个状态。
- 一旦状态改变,就不会再变,任何时候都可以得到这个结果。
- Promise对象的状态改变,只有两种可能:从pending变为fulfilled,以及从pending变为rejected。只要处于 fulfilled 和 rejected ,状态就不会再变了,这时称为 resolved(已定型)。
3.Promise有什么缺点
- 无法取消 Promise ,一旦新建它就会立即执行,无法中途取消。
- 如果不设置回调函数,Promise 内部抛出的错误,不会反应到外部。
- 当处于 pending 状态时,无法得知目前进展到哪一个阶段(不知道是刚刚开始还是即将完成)。
4.Promise怎么用
(1)Promise对象是一个构造函数,用来生成Promise实例,是由关键字 new 及其构造函数来创建的。
const promise = new Promise(function(resolve, reject) {
// ... some code
if (/* 异步操作成功 */){
resolve(value);
} else {
reject(error);
}
});
上面代码创建了一个Promise实例,接收两个函数作为参数,分别是resolve和reject。
当异步操作成功后,会将异步操作结果作为参数传入resolve函数并执行,此时 Promise对象状态从pending变为fulfilled;
如果异步操作失败,会将异步操作的错误作为参数传入reject函数并执行,此时 Promise对象状态从pending变为rejected。
(2)Promise实例生成以后,可以用then方法分别指定resolved状态和rejected状态的回调函数。
then方法可以接受两个回调函数作为参数。
promise.then(
function(value) {
// success
},
function(error) {
// failure
}
);
上面代码中,第一个回调函数是Promise对象的状态变为resolved时调用,第二个回调函数是Promise对象的状态变为rejected时调用。其中,第二个函数是可选的,不一定要提供。
这两个回调函数都接受Promise对象传出的值作为参数。
5.Promise原型的方法
(1)Promise.prototype.then()
-
Promise 实例具有then方法,也就是说,then方法是定义在原型对象Promise.prototype上的。它的作用是为 Promise 实例添加状态改变时的回调函数。
-
then方法的第一个参数是resolved状态的回调函数,第二个参数(可选)是rejected状态的回调函数。
-
then方法返回的是一个新的Promise实例
(2) Promise.prototype. catch()
- Promise.prototype.catch()方法是 .then(null, rejection)或 .then(undefined, rejection)的别名,用于指定发生错误时的回调函数。
- 一般来说,不要在then()方法里面定义 Reject 状态的回调函数(即then的第二个参数),总是使用catch方法,因为可以捕获前面then方法执行中的错误。
promise
.then(function(data) { //cb
// success
})
.catch(function(err) {
// error
});
(3) Promise.prototype. finally()
finally()方法用于指定不管 Promise 对象最后状态如何,都会执行的操作。
finally方法的回调函数不接受任何参数。
promise
.then(result => {···})
.catch(error => {···})
.finally(() => {···});
不管promise最后的状态,在执行完then或catch指定的回调函数以后,都会执行finally方法指定的回调函数。
6.Promise有什么方法
(1)Promise.all()
参数:
iterable 必须是一个可迭代对象,如 Array 或 String。
返回值:
一个新的Promise实例。
Promise.all()方法用于将多个 Promise 实例,包装成一个新的 Promise 实例。
const p = Promise.all([p1, p2, p3]);
上面代码中,Promise.all()方法接受一个数组作为参数,p1、p2、p3都是 Promise 实例,如果不是,就会先调用Promise.resolve方法(resolve方法看下面),将参数转为 Promise 实例,再进一步处理。
p的状态由p1、p2、p3决定,分成两种情况:
-
只有p1、p2、p3的状态都变成fulfilled(已成功),p的状态才会变成fulfilled,此时p1、p2、p3的返回值组成一个数组,传递给p的回调函数。
var p1 = new Promise((resolve, reject) => { setTimeout(resolve, 1000, 'one'); }); var p2 = new Promise((resolve, reject) => { // reject('p4 reject!'); setTimeout(resolve, 3000, 'two'); }); var p3 = new Promise((resolve, reject) => { setTimeout(resolve, 3000, 'three'); }); Promise.all([p1, p2, p3]).then( // Promise对象的状态变为resolved时调用 values => {console.log(values);}, // Promise对象的状态变为rejected时调用 reason => {console.log(reason)} ); // ["one", "two", "three"]
-
只要p1、p2、p3之中有一个被rejected(已失败),p的状态就变成rejected,此时第一个被reject的实例的返回值,会传递给p的回调函数。
var p1 = new Promise((resolve, reject) => { setTimeout(resolve, 1000, 'one'); }); var p2 = new Promise((resolve, reject) => { reject('p2 reject!'); }); var p3 = new Promise((resolve, reject) => { setTimeout(resolve, 3000, 'three'); }); Promise.all([p1, p2, p3]).then( // Promise对象的状态变为resolved时调用 values => {console.log(values);}, // Promise对象的状态变为rejected时调用 reason => {console.log(reason)} ); // p2 reject!
(2) Promise. race()
参数:
iterable 必须是一个可迭代对象,如 Array 或 String。
返回值:
一个新的Promise实例。
Promise.race()方法同样是将多个 Promise 实例,包装成一个新的 Promise 实例。
const p = Promise.race([p1, p2, p3]);
上面代码中,只要p1、p2、p3之中有一个实例率先改变状态,p的状态就跟着改变。那个率先改变的 Promise 实例的返回值,就传递给p的回调函数。
Promise.race()方法的参数与Promise.all()方法一样,如果不是 Promise 实例,就会先调用Promise.resolve()方法,将参数转为 Promise 实例,再进一步处理。
var p1 = new Promise((resolve, reject) => {
setTimeout(resolve, 3000, 'one');
});
var p2 = new Promise((resolve, reject) => {
setTimeout(reject, 3000, 'one');
});
var p3 = new Promise((resolve, reject) => {
setTimeout(resolve, 1000, 'three');
});
Promise.race([p1, p2, p3]).then(
values => {console.log(values);},
reason => {console.log(reason)}
);
// three 率先改变状态的实例,p的状态就跟着改变
(3) Promise.resolve()
返回一个以给定的值解析后的Promise对象。
该方法的参数分成四种情况:
1)参数是一个 Promise 实例
如果参数是 Promise 实例,那么Promise.resolve将不做任何修改、原封不动地返回这个实例。
2)参数是一个thenable对象
thenable对象指的是具有then方法的对象。
let thenable = {
then: function(resolve, reject) {
resolve(42);
}
};
let p1 = Promise.resolve(thenable);
p1.then(function(value) {
console.log(value); // 42
});
上面代码中,thenable对象的then方法执行后,对象p1的状态就变为resolved,从而立即执行最后那个then方法指定的回调函数,输出 42。
3)参数是普通数据
const p = Promise.resolve('Hello');
p.then(function (s){
console.log(s)
});
// Hello
返回 Promise 实例的状态从一生成就是resolved,所以回调函数会立即执行。Promise.resolve方法的参数,会同时传给回调函数。
4)不带有任何参数
Promise.resolve()方法允许调用时不带参数,直接返回一个resolved状态的 Promise 对象。
所以,如果希望得到一个 Promise 对象,比较方便的方法就是直接调用Promise.resolve()方法。
const p = Promise.resolve();
p.then(function () {
// ...
});
(3)Promise.reject()
Promise.reject(reason)方法也会返回一个新的 Promise 实例,该实例的状态为rejected。
const p = Promise.reject('出错了');
// 等同于
const p = new Promise((resolve, reject) => reject('出错了'))
p.then(null, function (s) {
console.log(s)
});
// 出错了
上面代码生成一个 Promise 对象的实例p,状态为rejected,回调函数会立即执行。