ES7

1、异步函数

异步函数是异步编程语法的终极解决方案,它可以让我们将异步代码写成同步的形式,让代码不再有回调函数嵌套,使代码变得清晰明了。实际上这个异步函数就是基于Promise对象的基础之上的封装,它将一些看起来比较臃肿的代码封装起来,然后开放一些关键字以供我们使用。

特点:

1、其实所谓的异步函数,就是在普通函数定义的前面加上async关键字

2、异步函数默认的返回值是promise对象

3、在异步函数中,通过throw关键字对错误信息进行抛出

4、在异步函数中,通过await关键字暂停异步函数的执行,并等待promise对象返回结果以后再向下执行

函数声明:

普通函数

function getValue() {
    return 10;
};

const getvalue = () => {
    return 10;
};

异步函数

async function getValue() {
    return 10;
};

const getValue = async () => {
    return 10;
};

调用:

获取异步函数中返回的值:

/*
声明一个异步函数
return 返回的数据就相当于Promise中的resolve()传入的数据,也就是成功的数据
throw  返回的数据就相当于Promise中的reject()传入的数据,也就是失败的数据。注意:当throw一旦执行以后,后面的代码将不会执行
 */
const getMaxValue = async () => {
    throw '错误';
    return 80;
};

/*
调用异步函数
通过then 获取成功的数据
通过catch 获取失败的数据
 */
getMaxValue()
    .then((result) => {
    console.log(result);
    //10
    })
    .catch((error) => {
        console.log(error)
        //错误
    });

异步函数中await关键字的使用:

/*
 通过异步函数中的await 关键字可以暂停异步函数的执行,并会等待promise对象返回结果以后再执行
 使用场景:通过该关键字可以完成异步任务依次执行,比如有a,b,c三个异步任务依次执行
  */
async function getOne() {
    return 1
};

async function getTwo() {
    return 2
};

async function getThree() {
    return 3
};

/*
该异步函数负责执行其它的异步函数
 */
async function execute() {

    /*
     为了让其依次执行,那么在调用异步任务时添加await关键字。
     如果是es6的语法,就需要在then()中进行处理,但是在异步函数中只需通过await即可
     await a() 中a函数必须有返回结果,否则代码不会向下执行。
      */
    let one = await getOne();
    let two = await getTwo();
    let three = await getThree();
    console.log('one:'+one);
    console.log('two:'+two);
    console.log('three:'+three);
    /*
    one:1
    two:2
    three:3
     */
}

execute();

总结:

async 关键字:

1、普通函数定义前面添加async关键字,普通函数就变成了异步函数

2、异步函数默认返回Promise对象

3、return 返回的数据就相当于Promise中的resolve()传入的数据,也就是成功的数据

4、throw 返回的数据就相当于Promise中的reject()传入的数据,也就是失败的数据。

5、调用异步函数以后,再链式调用then()获取异步函数中成功的数据

5、调用异步函数以后,再链式调用catch()获取异步函数中失败的数据

await 关键字:

1、await关键字只能出现在异步函数中

2、await后面只能写Promise对象

3、通过await关键字可以暂停异步函数向下执行,直到Promise对象返回结果

如果觉得文章有帮助到你,可以扫描以下二维码
   请本文作者 喝一杯
pay_weixin pay_weixin

发表评论

电子邮件地址不会被公开。 必填项已用*标注