promise
promise 是异步编程的一种解决方案,比传统的解决方案——回调函数和事件——更合理且更强大。它最早由社区提出并实现,ES6将其写进了语言标准,统一了用法,并原生提供了promise对象。
特点
1.对象的状态不受外界影响(3种状态)
pending 状态(进行中)
Fulfilled 状态(已成功)
Rejected 状态(已失败)
2.一旦状态改变就不会再变(两种状态改变:成功或失败)
pending -> Fulfilled
pending -> Rejected
用法
创建promise 实例
let promise = new Promise(function(resolve, reject){
// 你自己的异步逻辑代码
if (/* 异步操作成功 */) {
resolve(value);
} else { // 异步操作失败
reject(error);
}
})
promise构造函数接受一个函数作为参数,该函数的两个参数分别是 resolve 和 reject。它们是两个函数,由JavaScript引擎提供,不用自己部署。
resolve作用是将Promise对象状态由”未完成“变为”成功“,也就是Pending -> Rejected,在异步操作失败时调用,并将异步操作的结果作为参数传递出去。
then
Promise实例生成后,可用then方法指定一种状态回调参数:
1.promise对象状态改为Resolved时调用(必选)
备注:通俗的讲 resolve =>then
catch
promise 实例生成后,可用catch方法指定一种状态回调参数:
1.promise对象状态改为Rejected时调用(可选)
备注:通俗的讲 reject => catch
基本用法示例
function sleep(num) {
return new Promise(function(resolve, reject) {
if (num>10){
resolve('成功')
} else {
reject('失败')
}
})
}
sleep(500).then( res=> console.log(res)).catch(err => console.log(err));
这段代码定义了一个函数sleep,调用后,如果传入实参大于10,你会发现他会触发then的回调函数,并且打印出成功,如果传入的实参小于10,你会发现他会触发catch的回调函数,并且打印出失败。
执行顺序
接下来我们探究一下它的执行顺序,看以下代码:
let promise = new Promise(function(resolve, reject){
console.log("AAA");
resolve()
});
promise.then(() => console.log("BBB"));
console.log("CCC")
// AAA
// CCC
// BBB
执行后,我们发现输出顺序总是
AAA -> CCC -> BBB。表明,在promise新建后会立即执行,所以首先输出AAA。然后,then方法指定的回调函数将在当前脚本所有同步任务执行完后才会执行,所以BBB最后输出。
定时器混用
首先看一个下面的代码:
let promise = new Promise(function(resolve, reject){
console.log("1");
resolve();
});
setTimeout(()=>console.log("2"), 0);
promise.then(() => console.log("3"));
console.log("4");
// 1
// 4
// 3
// 2
可以看到,结果输出顺序总是:
1 -> 4 -> 3 -> 2。1与4的顺序不必再说,而2与3输出promise 的then,而后输出定时器任务,原因则是promise属于JavaScript引擎内部任务。而setTimeout则是浏览器API,而引擎内部任务优先级高于浏览器API任务,所以有此结果。