【JS高级】Promise
作者:互联网
什么是Promise
*promise内部代码会同步执行(如果不加异步任务)
.then中的代码是异步执行的
- 抽象表达
- Promise是一门新的技术(ES6规范)
- Promise是JS中进行异步编程的新解决方案
- 备注:旧方案是单纯使用回调函数
- 具体表达
- 从语法上来说: Promise是一个构造函数
- 从功能上来说: promise对象用来封装一个异步操作并可以获取其成功/失败的结果值
特点:支持链式调用,可以解决回调地狱问题 -----面试常考
回调地狱
promise构造函数有两个参数,分别为resolve,reject,resolve表示成功
会进入.then(()=>{},()=>{})中的第一个方法,reject会进入第二个方法/或者catch
new Promise((resolve,reject)=>{
// 内包裹异步任务
})
Promise封装练习
使用
Promise封装练习
function sendAjax(url) {
return new Promise((resolve, reject) => {
axios("get", url, (err, result) => {
if (err) {
reject(err);
}
resolve(result);
});
});
}
sendAjax("http://127.0.0.1").then(
(result) => {
console.log(result);
},
(err) => {
console.log(err);
}
);
promise状态的改变
状态:实例对象中的一个属性------Promisetate
- pending 未决定的
- resolved / fullfilled 成功
- rejected 失败
- pending变为resolved
- pending变为rejected
说明:只有这2中,且一个promise对象只能改变一次
无论变为成功还是失败,都会有一个结果数据
成功的结果一般成为value,失败的结果一般称为reason
Promise对象的值----PromiseResult
保存着对象【成功/失败】的结果
resolve(xxx)
reject(xxx)
以上均可修改PromiseResult的值
promise的工作流程
Promise.resolve()方法
Promise.reject()方法
传入的任何值都为错误
Promise.all()方法
说明:返回一个新的promise,只有所有的 promise都成功才成功,只要有一个失败了就直接失败,成功的值为一个数组,保存着每一个promise的结果值
只要有一个失败,返回结果就为失败的Promise的结果
Promise.race()方法
说明:返回一个新的 promise,第一个完成的 promise 的结果状态就是最终的结果状态
Promise的几个关键问题
改变其状态的三种方式
若为其实例指定多个.then回调函数,那么所有的回调函数都会执行
改变promise状态和指定回调函数谁先谁后
1)都有可能,正常情况下是先指定回调再改变状态,但也可以先改状态再指定回调
(2)如何先改状态再指定回调?
- 在执行器中直接调用resolve()/reject()
- 延迟更长时间才调用then()
(3)什么时候才能得到数据?
- 如果先指定的回调,那当状态发生改变时,回调函数就公调用,得到数据
- 如果先改变的状态,那当指定回调时,回调函数就会调用,得到数据
promise如何串连多个操作任务
(1)promise 的then()返回一个新的 promise, 可以看成then()的链式调用
(2)通过 then的链式调用串连多个同步/异步任务
promise的异常传透
(1)当使用promise 的then链式调用时,可以在最后指定失败的回调,
(2)前面任何操作出了异常,都会传到最后失败的回调中处理
promise的中断
自定义(手写)promise
https://www.bilibili.com/video/BV1GA411x7z1?p=28&spm_id_from=pageDriver&vd_source=9be15c346432f1064d85ec92b746747f
Async与await
Async
- 函数的返回值为promise对象
- promise对象的结果由async函数执行的返回值决定
Await
- await右侧的表达式一般为promise对象,但也可以是其它的值
- 如果表达式是promise对象, await返回的是promise 成功的值
- 如果表达式是其它值,直接将此值作为await的返回值
注意
- await必须写在 async函数中,但 async函数中可以没有await
- 如果await 的 promise 失败了,就会抛出异常,需要通过try...catch 捕获处理
await与async结合使用
标签:resolve,await,高级,JS,promise,reject,Promise,回调 来源: https://www.cnblogs.com/lshifu/p/16560912.html