什么是Async、await

ES2017 标准引入了 async 函数，使得异步操作变得更加方便。async顾名思义是“异步”的意思，用于声明一个函数是异步的。而await从字面意思上是“等待”的意思，就是用于等待异步完成。

基本用法

async函数的返回值

既然async函数是声明一个异步函数，那么我们如何知道这个函数是否执行完成呢。我们观察一下async函数的返回值就明白了。

async function lxcAsync() {    return "LXC";}console.log(lxcAsync()); // Promise { 'LXC' }

代码输出的结果是Promise { 'LXC' }，可见async函数返回的是一个Promise对象，因此我们可以使用then方法添加回调函数，从而处理async函数返回的结果。

async function lxcAsync() {    return "LXC";}lxcAsync().then((data) => {    console.log(data);   // LXC});

await的作用

正常情况下，await命令后面是一个 Promise 对象。当然也可以是原始类型和非Promise对象，但会被转成一个立即resolve的 Promise 对象，这是等同于同步操作。await表示函数等待promise返回结果了，再继续执行。

function delay() {    return new Promise((resolve) => {        setTimeout(() => {            resolve('LXC');        }, 2000);    })}async function lxcAsync() {    let de = await delay();    console.log(de); //  2s后输出LXC}lxcAsync();

注意点

await关键字只能用于async函数执行上下文中。

async function lxcAsync() {   setTimeout(() => {     await 1;   //await is only valid in async function   },1000)}lxcAsync();

上面便是一种错误用法，await并没有在lxcAsync函数执行上下文中，而是在setTimeout的回调函数中。

async function lxcAsync() {   setTimeout(() => {     await 1;   //await is only valid in async function   },1000)}lxcAsync();

如果我们希望在某个异步函数的回调函数中使用await（如果使用过jest，应该会知道jest的异步测试就有这种需求）,我们可以使用下列方式

function lxcAsync() {   setTimeout(async () => {     await 1;   },1000)}lxcAsync();

reject错误处理

如果await后面的Promise对象返回的是reject，那么我们需要如何处理呢？这时我们需要try-catch来处理。

function delay() {    return new Promise((resolve, reject) => {        reject('LXC');    })}async function lxcAsync() {    try {        let de = await delay();        console.log(de);     } catch (error) {        console.log(error);  //输出LXC    }}lxcAsync();