一,什么是Promise?
为了直观一点,首先我们采用console.dir(Promise)看一下它的结构组成。
从上面的图片中我们可以到,Promise其实是一个构造函数,它有resolve,reject,race等静态方法;它的原型(prototype)上有then,catch方法,因此只要作为Promise的实例,都可以共享并调用Promise.prototype上面的方法(then,catch),接下来我们试着使用一下Promise。
二,Promise的使用
首先我们来看一下Promise的使用语法:
实例化对象时要传入一个函数
new Promise(function(resolve,reject){}/*excutor*/);
三,resolve和reject的具体用法
首先我们来看看Promise的几种状态:
- pending: 初始状态,成功或失败状态。
- fulfilled: 意味着操作成功完成。
- rejected: 意味着操作失败。
1. resolve的用法
当调用resolve方法时 ==> Promise的状态就会变成fulfilled即成功的状态 ==> 就会执行.then里面的代码
var p = new Promise(function (resolve, reject) {
var timer = setTimeout(function () {
console.log('执行操作1');
resolve('这是数据1');
}, 1000);
});
p.then(function (data) {
console.log(data);
console.log('这是成功操作');
});
输出结果:
2. reject的用法(这个忽略想详细了解可以点击链接跳转, 起始这个没有太必要了解)
3. catch方法
我们注意到除了then方法外,Promise原型上还有另外一个叫catch的方法,那么这个方法的作用是什么呢?其实跟then方法中的第二个参数一样,就是在Promise状态为rejected时执行,then方法捕捉到Promise的状态为rejected,就执行catch方法里面的操作,下面用catch方法改写上面reject用法里面的例子,如下所示
var p = new Promise((resolve, reject) => {
var flag = false;
if(flag){
resolve('这是数据1');
}else{
reject('这是数据2');
}
});
p.then(data => {
console.log(data);
console.log('这是成功操作');
}).catch(reason => {
console.log(reason);
console.log('这是失败的操作');
});
打印结果: