Promise
promise是js中对于异步编程的一种新的解决方案。
语法上:Promise是一个构造函数
功能上:promise对象是用来封装一个异步操作并可以获取其结果
Promise流程图如下:
promise状态:
1.pending ==>>resolved (成功)
2.pending ==>>rejected (失败)
说明:只有这两种状态的改变,且一个promise对象只能改变一次这个状态,
无论成功or失败,都会有一个数据结果
为什么使用promise:
1、promise指定回调函数的方式更灵活: 它可以在启动异步任务之后,返回promise对象后,给promise对象绑定回调函数。
旧方案:启动异步任务之前就必须指定回调函数 ==>>纯回调形式
2、promise支持链式调用,可以解决回调地狱问题
回调地狱:回调函数嵌套调用,且回调函数之间存在依赖关系,不方便阅读
回调地狱终极解决方案:async与await配合使用
async+函数:
async函数的返回值是promise对象,promise对象的结果由async函数的执行的返回值来决定
await+表达式:await右侧的表达式一般为promise对象,但也可以是其他值
如果右侧的表达式是promise对象,await返回的是promise成功的值
如果右侧表达式是其它的值,直接将此值作为await的返回值
***注意***:
(1)await必须写在async函数中,但是async函数中可以不写await
(2)如果await后边的promise的结果为失败,必须通过try{ } catch( ){ } 捕获处理
宏队列与微队列:
js中用来存储待执行的回调函数的队列有两个不同的队列
1、宏队列:用来保存待执行的宏任务(回调)例:定时器回调,ajax回调,DOM事件回调。
2、微队列:用来保存待执行的微任务(回调)例:promise的回调
3、Js队列执行顺序:
1、js引擎必须先执行所有的初始化同步任务的代码。
2、每次准备执行宏任务之前,必须保证所有的微任务都已经执行
Promise的API:
1.promise构造函数 promise(excutor){}
Excutor函数:同步执行 有两个参数 (resolve,reject) =>{}
Resolve函数:内部定义的 成功时调用的函数
Reject函数 :内部定义的 失败时调用的函数
说明:excutor会在promise内部立即同步回调,异步操作在执行器中执行。
2.Promise.prototype.then() : then方法是原型对象上的方法
有两个参数 (onResolved , onRejected) = >{}
onResolved函数: 成功的回调函数 (value ) => {}
onRejected函数: 失败的回调函数 (reason) => {}
说明:无论是成功 / 失败的回调函数,最终返回的是新的promise对象
3.Promise.resolve()方法 :value => {} 返回成功的Promise对象
4.Promise.reject()方法 :reason => {} 返回失败的Promise对象
5.Promise.all() (promises) => {} promises为数组,且元素都是promise对象
说明:返回一个新的promise对象,promises中所有的promise对象状态都是成功才成功,只要有一个失败的就直接失败
6.Promise.race() (promises) => {} promises为数组,且元素都是promise对象
说明:返回一个新的promise ,第一个执行完成的promise的结果状态就是最终 的结果状态。
如何改变promise的状态:
1.resolve(value) 如果当前是pending就会变成 resolved状态
2.reject(value) 如果当前是pending就会变成 rejected状态
3.抛出异常 如果当前是pending就会变成 rejected状态
一个promise指定多个成功/失败的回调函数,都会被调用吗???
答:当promise改变为对应的状态后,多个回调函数都会被调用。
改变promise状态和指定回调函数谁先谁后???
1、都有可能,正常情况下是 先指定回调函数再改变状态,但是也可以先改变状态再指定回调。
2、如何先改变状态再指定回调?
(1)执行器中直接调