Promise 翻译为中文是 承诺!
什么是Promise? Promise 解决了什么问题?
抽象来说,Promise是 JS 中进行异步编程的新的解决方法。
具体来说,Promise是一个构造函数;
功能来说,promise对象用来封装一个异步操作,并可以获取到其结果。
Promise是 JS 中进行异步编程的新的解决方法。这句话相信在很多文章中都看到过。
那么老的异步编程又有什么问题呢?
有这样一个场景,a,b,c,... z 多个请求,并且每个请求的入参需要前一个请求的返回值才能继续进行请求,那么在请求b时,就需要在a请求成功之后,在a中b携带着a的返回值继续去请求,接下来在b获得返回值,在b中c携带着b的返回值再去请求 ... 不断循环下去,我们称这种情况为 回调地狱。
回调地狱不利于阅读和维护,也存在着高耦合性,不易更改的问题,我们应该在使用中要避免回调地狱的出现。
1.Promise的出现,可以支持链式调用异步操作,解决了 回调地狱 的问题。
2.Promise 想比较于旧的异步操作,指定回调函数的方式更加灵活
在之前的异步操作,如果需要回调函数,那么需要在异步任务执行前指定
在现在的Promise中,就会灵活很多,可以在异步任务执行之前之后,进行回调函数的指定
Promise有三种状态 pending、resolved、rejected , 有且只有两种变化,
1.pending 变为 resolved (成功)
2.pending 变成 rejected (失败)
成功失败都会有一个结果数据,成功数据一般称为 value , 失败数据一般称为 reason
再来熟悉一下Promise的API
Promise.all()
Promise.allSettled()
Promise.any()
Promise.prototype.catch()
Promise.prototype.finally()
Promise.race()
Promise.reject()
Promise.resolve()
Promise.prototype.then()
简单写一个Promise的例子,试用一下最常见的API .then 与 .chtch
const p = new Promise(( resolve, rejecet ) => {
if(new Data % === 1) {
resolve('奇数')
} else {
rejecet('偶数')
}
})
p.then((value) => {
console.log(value) // log 输出 奇数
})
p.catch(reason => {
console.log(reason) // log 输出 偶数
})
不要以为.then获取到的就一定是正确的,
.then不仅可以拿到resolved的结果,也可以拿到rejected的结果。
.catch一定可以获取到rejected的结果,获取不到resolved的结果。
.then可以接收两个回调,第一个获取到 resolved 的结果,第二个获取到 rejected 的结果。
演示一下通过.then获取resolved的结果。
p.then(null, (value) => {
console.log(value) // log 输出 偶数
})
其他的API我暂时就不举例说明了,不懂的可以去上边的API点进去查看一下。
在手写Promise之前,再了解一下Promise的一些问题点。
1.如果改变Promise的状态?
- resolve(value) 如果当前是pending,则变为resolved状态(成功)
- reject(reason) 如果当前是pending,则变为rejected状态(失败)
- throw new Error('抛出错误') 如果当前是pending,则变为rejected状态,并且控制台报错(失败)
2.一个promise指定多个成功失败回调函数,都会调用吗?
- 当promise改变为对应状态时都会调用
3.改变promise状态和指定回调函数谁先谁后?
- 都有可能,正常情况先指定回调,再改变状态,但也可以先改变状态,后指定回调
- 如何先更改状态再指定回调?
延迟更长的时间再调用then() 使其先执行Promise中的执行器改变状态之后再调用then 或 catch
4.promise.then() 返回的新promise的结果装填由什么决定?
- 由then()返回的回调函数执行的结果决定,如果回调函数执行中没有错误,则继续状态为resolved,有错误的话则为rejected。但是有没有值取决于回调函数有没有return
5.promise 怎么操作多个连续的任务?
-通过.then来链式操作。(同步异步都可)