Promise入门/面试必看
一、理解
1、抽象表达
是JS中进行异步编程的新的解决方案（旧->纯回调函数）
2、具体表达
（1）语法上：Promise是一个构造函数
（2）功能上：Promise对象用来封装一个异步操作并可以获取其结果
二、状态的改变
1、pending（未确定）-> resolved（成功）
(1)resolve(value)
2、pending（未确定） -> rejected（失败）
(1)reject(reason)
(2)throw new Error(error)
三、基本使用
//(1)创建一个新的Promise对象
const p = new Promise((resolve,reject)=>{
//执行器函数 同步回调
//(2)执行异步操作任务
setTimeout(()=>{
const time = Date.now()//获取当前时间
if(time %2 ==0){
//偶数代表成功
resolve("成功了，time = "+ time)
}else{
//否则失败
reject("失败了，time = "+ time)
}
},1000);
})
p.then(
value =>{
//接收成功的数据
console.log("成功的回调：" + value)
},
reason =>{
//接受失败的数据
console.log("失败的回调：" + reason)
}
)
四、为什么要使用Promise
1、指定回调函数的方式更灵活
（1）旧的必须在启动异步任务之前指定回调函数
（2）promise：启动异步任务->返回promise对象->给promise对象绑定回调函数
2、支持链式调用，可以解决回调地狱
（1）回调地狱：回调函数嵌套调用->不便于阅读/不便于异常处理
（2）解决方案：promise链式调用
（3）终极解决方案：async、await
五、all()和race()
1、all()
const p1 = new Promise((resolve,reject)=>{
resolve(1)
})
const p2 = Promise.resolve(2)
const p4 = Promise.reject(4)
const pAll = Promise.all([p1,p2,p3,p4])
const pAll2 = Promise.all([p1,p2])
pAll.then(
values => {
console.log('all onResolved()',values)
},
reason => {
console.log('all onrejected()',reason)
}
)
pAll2.then(
values => {
console.log('all2 onResolved()',values)
},
reason => {
console.log('all2 onrejected()',reason)
}
)
//运行结果
//all onReasoned() 3 返回第一个失败的reason
//all2 onrejected() [1, 2] 全部成功时返回成功的value集合
2、race()
const pRace = Promise.race([p1,p2,p3])
const pRace2 = Promise.race([p3,p1,p2])
pRace.then(
value => {
console.log('race onResolved()',value)
},
reason => {
console.log('race onrejected()',reason)
}
)
pRace2.then(
value => {
console.log('race2 onResolved()',value)
},
reason => {
console.log('race2 onrejected()',reason)
}
)
//运行结果
//返回第一个执行的结果，根据实际执行时间
//race onResolved() 1
//race2 onrejected() 3
六、注意点
1、一个promise可以指定多个成功/失败回调函数，可以执行多个不同操作。
2、promise可以串连多个操作任务
（1）通过then()返回一个新的promise，可以开成then()的链式调用
（2）通过then的链式调用可以串连多个同步/异步任务
3、promise的异常传透
（1）使用promise的then()链式调用时，可以在最后指定失败的回调（catch）
（2）前面的任何操作出了异常，都会传到最后失败的回调中处理（reason => {throw reason} 、reason=> Promise.reject()reason）
4、中断promise链
（1）使用promise的then()链式调用时，想要中止调用，使链式调用结束
（2）方法：return new Promise(()=>{}) //返回一个pending状态的promise