秒懂async与await

一、async 定义、await定义:

1、async function: 用来定义一个返回AsyncFunction对象的异步函数。异步函数是指通过时间循环一步执行的函数,它会通过一个隐式的promise返回其结果。

2、await: 操作符用于等待一个Promise对象。它只能在异步函数 async function中使用。

二、语法:

1、async function

async function name([param[, param[, ... param]]]) {statements}

注:[param[, param[, ... param]]]是要传递的参数,statements是函数体

2、await

[return_value] = await expression;

注:await后跟的是表达式expression,表达式是一个promise对象或者任何要等待的值。

三、返回值:

1、async function: 的返回值为promise对象,promise对象的结果由async函数执行的返回值决定。

2、await : await右侧的表达式一般为promise对象,但也可以是其它的值。

  • 如果表达式是promise对象,await返回的是promise成功的值。
  • 如果表达式是其它值,直接将此值作为await的返回值。
四、描述

async function:

1、 一个async异步函数可以包含0个或者多个await指令,该函数会暂停异步函数的执行,并等待Promise执行,然后继续执行异步函数,并返回结果。await关键字只在异步函数内有效。async函数通常返回一个promise对象。如果async函数的返回值不是一个标准意义上的promise对象,那它一定是包裹在了一个promise对象里面。
例如:

async function foo(){
	return 1;
}
//等价于

function foo(){
	return Promise.resolve(1);
}

2、async函数的函数体可以被认为是由0个或者多个await表达式分割开来。第一行代码到第一个await表达式之间的代码是同步运行的。在这种情况下(函数体中没有await表达式),async函数会同步运行。如果在方法体内由await表达式,然而,async方法会异步执行。

例如:

async function foo(){
	await 1;
}
//等价于
function foo(){
	return Promise.resolve.then(() => undefined);
}

await:
await表达式会暂停当前 async function的执行,等待Promise处理完成。 如果await的promise失败了,就会抛出异常,需要通过try–catch来捕获处理。

四、代码:
		async function fn1(){
            //throw 2
            return Promise.resolve(3);
        }
        const result = fn1();
        result.then(
            value => {
                console.log('onResolve()',value);
            },
            reason => {
                console.log('onReject()',reason);
            }
        )
        function fn2() {
            return new Promise((resolve,reject) => {
                setTimeout(()=>{
                    reject(3);
                },1000);
            })
        }

        function fn4(){
            return 6;
        }
        
        async function fn3(){
        
            const value = await fn1(); 

        //    const value = await fn2(); //await 右侧表达式为promise,得到的结果就是promise成功的value
            
        //    const value = await fn4(); //await 右侧表达式不是promise,得到的结果就是表达式的值
            
            try{
                const value = await fn1();
                console.log('value',value);
            }catch(error){
                console.log("得到失败的结果",error);
            }
            
        }
        fn3();

内容参考:MDN:https://developer.mozilla.org/zh-CN/

  • 1
    点赞
  • 15
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值