目录
(3) promise 状态和指定的改变,回调函数的执行顺序
1> 正常情况下是先指定回调再改变状态, 但也可以先改状态再指定回调;
(4)promise.then()返回新的 promise 的结果状态如何决定?
前言
Promise
对象的存在使得我们在处理异步操作的时候写法更加简洁,且结合async
和await
关键字使用的话会让代码更加清晰和优雅。
一.promise是什么?
(1)回调监狱
在学习promise之前,我们需要先来看一下我们以前在JS中是如何处理异步操作的,我们通常会使用回调函数,但回调函数虽然能够解决我们实现异步操作队列化的需求。但当出现一个方法中嵌套着多个回调函数的时候,此时代码的结构就会冗余,也就是出现回调地狱的问题。
然而Promise
对象的产生则能够帮助我们较为优雅地解决多个回调函数嵌套的问题,让我们的JS代码结构更加清晰,维护起来更加方便。
(2)promise定义
Promise 是一种异步编程的解决方案,一般来说,我们封装一个网络请求的函数,因为不能立刻返回结果,所以我们可以将其传入另外一个函数,在数据请求成功时,将数据通过传入的函数回调回去。其实它就是一个构造函数,自己身上有all、reject、resolve这几个方法,原型上有then、catch等方法。
二.为什么要使用promise?
由于ajax和axios请求很重要。通俗来说,可能因为网速的不同,得到的返回值的时间也会不同,但是下一步要执行的代码依赖于上一次请求返回值,只有等结果出来了才知道如何下一步操作。
三.promise的优点
- .Promise 对象提供了简洁的API,使得控制异步操作更加容易;
- 避免多层异步调用嵌套问题(回调地狱);
四. promise的属性
Promise对象上主要有着PromiseState
和PromiseResult
两个属性。
(1)PromiseState:
PromiseState 表示Promise对象中函数的执行结果,主要有以下三个状态:
- pending: 一个等待状态,或者进行中状态,表示还没有得到结果;
fulfill(resolve):一个满足状态,当主动回调resolve时,就处于该状态,并且会回调.then();
reject:一个拒绝状态,当主动回调reject时,就处于该状态,并且会回调.catch();
注:
- 这三种状态不受外界影响,而且状态只能从pending改变为resolved或者rejected,并且不可逆。
- 一个 promise 对象只能改变一次状态, 无论变为成功还是失败, 都会有一个结果数据, 成功的结果数据一般称为 value, 失败的结果数据一般称为 reason。
(2)PromiseResult
PromiseResult 表示Promise对象函数中传递给resolve
或者reject
方法的参数,一般会在then
方法中通过value或者reason形参来接收到这个参数。
五.Promise对象的API
(1)catch
可以在then中指定失败的回调函数,还可以通过Promise对象.then().catch()
来进行失败函数的执行:
<script>
const p = new Promise((resolve,reject)=>{
reject('aaa');
})
p.then(value=>{
console.log(value);
}).catch(reason=>{
console.error(reason);
})
</script>
注:如果在then和catch中都指定了失败的回调函数,那么只会执行then方法中定义的回调函数。
(2)Promise.resolve()
Promise中提供了一个resolve方法来快速创建Promise对象,resolve方法中可以接受参数,如果传入的参数为非Promise类型的对象, 则返回的结果为成功promise对象。如果传入的参数为 Promise 对象, 则参数的结果决定了resolve 的结果。
<script>
const p1 = Promise.resolve('aaa');
const p2