Promise和async/await的区别
在了解二者的区别,首先先了解一下js的同步与异步因为js语言的单线程的,面对多个任务执行的时候,只有上一个任务完成后才会进入下一个任务,而,我们在开发过程中会遇到一些axjos的请求或者一些文件数据的读取会花费一些时间,这样严重影响的用户的使用体验。同步任务:上一个任务完成后才能执行下一个任务,比如元素的渲染异步任务:可以同时之宗两个任务,例如图片的加载等实现异步编程的方法有回调函数,promis
·
在了解二者的区别,首先先了解一下js的同步与异步
因为js语言的单线程的,面对多个任务执行的时候,只有上一个任务完成后才会进入下一个任务,而,我们在开发过程中会遇到一些axjos的请求或者一些文件数据的读取会花费一些时间,这样严重影响的用户的使用体验。
同步任务:上一个任务完成后才能执行下一个任务,比如元素的渲染
异步任务:可以同时之宗两个任务,例如图片的加载等
实现异步编程的方法有回调函数,promise和async/await
1.promise
- 一个promise可能有三种状态,等待(pending), 已完成(fulfilled), 已拒绝(rejected)
- promise不能逆向转向,只能从等待到完成或者拒绝状态
- then方法是promise的核心,then返回一个promise函数,而一个promise也可以多次调用then方法
- 也有一些缺点,一旦执行了promise便无法中途取消,
- 当promise处于pending阶段的时候无法判断是刚刚开始还是快结束的阶段
- 如果不设置回调函数,promise无法向外部抛出错误信息
- 一般来说,then回调函数的参数是resolve抛出的信息,catch回调函数的参数是reject和执行then抛出的错误信息
- promise的内部错误不会影响外部错误,也就是说promise会吃掉函数
2.async/await
- async函数返回的是一个promise函数,可以使用then()回调函数,return返回的值便是then方法里的参数
- async返回的promise对象只有内部的await全部执行完,才会执行then()的回调函数
- await语句后面可能会等具体的值也可能会等promise对象,如果是promise对象,一般返回的是resolve的结果,如果是reject,则后续的await将不会在执行
- 最好将await语句写在try catch语句里面,因为有时候async可能会有错误机制,返回promise的reject状态 如下
-
async function myFunction() { try{ let res= await somethingThatReturnsAPromise(); console.log('正确'+res) } catch (err) { console.log('错误'+err); } } function somethingThatReturnsAPromise(){ return x } myFunction()
- 如果是多个没有联系的异步函数,可以让他们同时触发,如下
-
let [foo, bar] = await Promise.all([getFoo(), getBar()]);
- await命令只能在async函数里,普通函数会报错
3.区别
promise | async/await |
对比promise不需要执行then()处理响应,只需要将结果赋给一个值即可 | |
try/catch难以处理在JSON.parse过程中的问题,需要在外层在套一个try/catch | |
使用async/await,我们就可以轻而易举的写出可读性更高的代码 |
更多推荐
所有评论(0)