js promise then 用法详解
Promise 是抽象的异步处理对象构造方法:let promies = new Promise((resolve, reject) => {resolve(); //异步处理});Promise 有三个状态:Fulfilled: has-resolved, 表示成功解决,这时会调用 onFulfilled.Rejected: has-rejected, 表示解...
Promise 是抽象的异步处理对象
构造方法:
let promies = new Promise((resolve, reject) => {
resolve(); //异步处理
});
Promise 有三个状态:
- Fulfilled: has-resolved, 表示成功解决,这时会调用 onFulfilled.
- Rejected: has-rejected, 表示解决失败,此时会调用 onRejected.
- Pending: unresolve, 表示待解决,既不是resolve也不是reject的状态。也就是promise对象刚被创建后的初始化状态.
上面我们提到 Promise 构造函数接受一个函数作为参数,该函数的两个参数分别是 resolve 和 reject.
resolve函数的作用是,将 Promise 对象的状态从 未处理 变成 处理成功 (unresolved => resolved), 在异步操作成功时调用,并将异步操作的结果作为参数传递出去。
reject函数的作用是,将 Promise 对象的状态从 未处理 变成 处理失败 (unresolved => rejected), 在异步操作失败时调用,并将异步操作报出的错误,作为参数传递出去。
Promise 实例生成以后,可以用 then 方法和 catch 方法分别指定 resolved 状态和 rejected 状态的回调函数。
举例说明:引用网络上的代码示例:
(1)下面通过样例作为演示,我们定义做饭、吃饭、洗碗(cook、eat、wash)这三个方法,它们是层层依赖的关系,下一步的的操作需要使用上一部操作的结果。(这里使用 setTimeout 模拟异步操作)
//做饭
function cook(){
console.log('开始做饭。');
var p = new Promise(function(resolve, reject){ //做一些异步操作
setTimeout(function(){
console.log('做饭完毕!');
resolve('鸡蛋炒饭');
}, 1000);
});
return p;
}
//吃饭
function eat(data){
console.log('开始吃饭:' + data);
var p = new Promise(function(resolve, reject){ //做一些异步操作
setTimeout(function(){
console.log('吃饭完毕!');
resolve('一块碗和一双筷子');
}, 2000);
});
return p;
}
function wash(data){
console.log('开始洗碗:' + data);
var p = new Promise(function(resolve, reject){ //做一些异步操作
setTimeout(function(){
console.log('洗碗完毕!');
resolve('干净的碗筷');
}, 2000);
});
return p;
}
(2)使用 then 链式调用这三个方法:
cook()
.then(function(data){
return eat(data);
})
.then(function(data){
return wash(data);
})
.then(function(data){
console.log(data);
});
当然上面代码还可以简化成如下:
cook()
.then(eat)
.then(wash)
.then(function(data){
console.log(data);
});
(3)运行结果如下:
开始做饭
做饭完毕
开始吃饭:鸡蛋炒饭
吃饭完毕
开始洗完:一块碗一双筷子
洗完完毕
赶紧的碗筷
解释:上述构造方法中的两个参数resolve, reject即是改变promise的状态,resolve 方法把 Promise 的状态置为完成态(Resolved),这时 then 方法就能捕捉到变化,并执行“成功”情况的回调,resolve, reject可抛出结果,作为then方法中函数的参数。then可接受两个参数,第一个处理Resolved状态的函数,第二个处理Rejected函数。如果只想处理成功,或者失败,对应参数可设置为null,只有一个参数则表示状态改变就执行,不区分状态结果。
另外
catch()方法,它可以和 then 的第二个参数一样,用来指定 reject 的回调,另一个作用是,当执行 resolve 的回调(也就是上面 then 中的第一个参数)时,如果抛出异常了(代码出错了),那么也不会报错卡死 js,而是会进到这个 catch 方法中。
all()方法,Promise 的 all 方法提供了并行执行异步操作的能力,并且在所有异步操作执行完后才执行回调, 会把所有异步操作的结果放进一个数组中传给 then。
race()方法,race 按字面解释,就是赛跑的意思。race 的用法与 all 一样,只不过 all 是等所有异步操作都执行完毕后才执行 then 回调。而 race 的话只要有一个异步操作执行完毕,就立刻执行 then 回调。
注意:其它没有执行完毕的异步操作仍然会继续执行,而不是停止。
更多推荐
所有评论(0)