一个 Promise 必然处于以下几种状态之一:
待定(pending): 初始状态,既没有被兑现,也没有被拒绝。
已兑现(fulfilled): 意味着操作成功完成。
已拒绝(rejected): 意味着操作失败。
Promise.prototype.then()
then()方法返回的新promise的状态有什么来决定?
由then()指定回调函数执行的结果决定。
(1)如果抛出异常,新promise的状态为rejected,reason为抛出的异常;
(2)如果返回的是非promise的任意值,新promise的状态为fullfilled,value为返回的值;
(3)如果返回的是promise,新promise的状态由返会promise的状态来决定。
Promise.prototype.catch()
catch()返回新promise的结果状态与then()的三种情况相同。
Promise同步返回结果与异步返回结果
(0)当箭头函数的右边不紧跟大括号{}时,有return的作用:
()=>throw error;
当箭头函数的右边紧跟大括号{}时,没有return的作用:
(1)执行异步任务返回结果时使用Promise,应该返回一个新的Promise。
Promise.resolve()返会新的Promise,状态为fullfilled。
(2)中断Promise链:
办法:在回调函数中,返回一个状态为pending的promise对象。
在then()回调函数中:
return new Promise(()=>{})
当then方法中是同步代码的时候,不需要创建Deferred延时对象(var dtd = $.Deferred(););当then方法中有异步代码的时候,需要创建Deffered延时对象。
Promise对象串联
Promise对象可以串联起来,所以上述代码可以简化为:
new Promise(test).then(function (result) {
console.log('成功:' + result);
}).catch(function (reason) {
console.log('失败:' + reason);
});
使用场景【串行】
Promise还可以做更多的事情,比如,有若干个异步任务,需要先做任务1,如果成功后再做任务2,任何任务失败则不再继续并执行错误处理函数。
要串行执行这样的异步任务,不用Promise需要写一层一层的嵌套代码。有了Promise,我们只需要简单地写:
job1.then(job2).then(job3).catch(handleError);
其中,job1、job2和job3都是Promise对象。最后job3的Promise对象不会影响之前job1与job2的执行。
// 假设 getData() 和 getOtherData() 返回的是 Promise
//在vuex中action可以将异步返回的结果返回到mutation中。
actions: {
async actionA ({ commit }) {
commit('gotData', await getData())
},
async actionB ({ dispatch, commit }) {
await dispatch('actionA') // 等待 actionA 完成
commit('gotOtherData', await getOtherData())
}
}