2020-05-02 async和await用法和异常捕获

308 阅读1分钟

async 函数是非常新的语法功能,新到都不属于 ES6,而是属于 ES7。

async和await是异步解决方案之光。 怎么写:

function timeout(ms) {
  return new Promise((resolve) => {
    setTimeout(resolve, ms);
  });
}

async function asyncPrint(value, ms) {
  await timeout(ms);
  console.log(value)
}

asyncPrint('hello world', 50);
//上面代码指定50毫秒以后,输出"hello world"。

async 用于申明一个 function 是异步的,await 只能出现在 async 函数中,await顾名思义,“等”async里的一个异步方法执行完再继续执行下面的代码,是不是像是把一个异步变成了同步的感觉?

await只能出现在async函数中,但是async可以单独使用(虽然一般不会这样用),比如以下代码:

async function test() {
    return "hello async";
}

const result = test();
console.log(result);

控制台打出的是一个promise对象:

所以async函数可以接then,且如果在函数中 return 一个直接量,async 会把这个直接量通过 Promise.resolve() 封装成 Promise 对象(如果async 函数没有返回值,Promise.resolve(undefined)):

test().then(res => {
    console.log(res);    // 输出 hello async
});

如何捕获异常?

await 命令后面的 Promise 对象,运行结果可能是 rejected,所以最好把 await 命令放在 try...catch 代码块中。

async function func() {
  try {
    await asyncFunc();
  } catch (err) {
    console.log(err);
  }
}

// 另一种写法

async function func() {
  await asyncFunc().catch(function (err){
    console.log(err);
  });
}

什么时候用Promise.all,什么时候用async/await?

promise.all 可以用来执行 不关心 执行顺序 只关心 回来结果的顺序的 需求

如果你关心 函数的执行顺序的话 最好使用 async/await


参考: 边城 理解 JavaScript 的 async/await

阮一峰 async 函数的含义和用法

yunchong_zhao 前端面试题 什么时候用promise.all 什么时候用async和await