async和await是promise的一种语法糖,也就是更简单易懂的写法。

在很多项目中,你会经常看到async和await的配合使用,看到原始的promise写法反而不多,就是因为async-await这种写法是用同步的语法去实现异步的逻辑。

基础使用

原生promise写法

        let value = nulllet proFn = new Promise((resolve,reject)=>{setTimeout(()=>{resolve('成功的值')},2000)})proFn.then(res=>{value = resconsole.log(value,'异步返回值')//...value获取到了值,可以处理后续的业务逻辑})

async和await的写法

        let proFn = ()=>{return new Promise((resolve, reject) => {setTimeout(() => {resolve('成功的值')}, 2000)})} async function getVal(){let value = await proFn() //这条语句执行完毕,后续的代码都需要等value获取到了promise返回的值,才会开始去执行console.log(value,'获取到了值')//...可以执行后续的业务}getVal()

两者执行结果都是一样的

async

作用

async需要在函数上使用,本质是Generator 函数的语法糖。

一旦某个函数使用了async,那么这个函数的返回值就会被包装成一个promise函数

        let fn = async function(){return '函数返回值'}console.log(fn(),'调用fn函数')fn().then(res=>{console.log(res,'获取值')})

语法

async写在函数定义的时候,可以有如下写法

        let fn1 = async function(){return '普通函数1'}async function fn2(){return '普通函数2'}async ()=> '箭头函数'class Fn{constructor(){}async fn(){return '类中的方法'}}

await

使用条件

 await是不可以单独去使用的,是需要和async函数去配合使用的

        let pro = function(){return new Promise(res=>{res('成功的值')})}let value = await pro()

 

参数类型

await命令后面可以绑定两种类型的参数,一种是常规类型,一种是promise类型

        let pro = async function(){let value = await '常规值'console.log(value,'await返回常规值')}pro()

        let pro = async function(){let value = await new Promise(res=>{setTimeout(()=>{res('promise执行成功的值')},3000)})console.log(value,'await绑定promise实例')}pro()

处理错误

async-await在处理错误时,可以使用try catch语法配合

        async function pro(){try{let value =  await new Promise((resolve,reject)=>{setTimeout(()=>{// resolve('成功')reject('失败')},3000)})return value}catch(error){console.log(error,'进入catch')return error}}pro().then(res=>{console.log(res,'执行完毕')}).catch(error=>{console.log(error,'报错回调')})