JavaScript中的await
先来介绍一下async 函数
async 函数是使用async关键字声明的函数。async 函数是 AsyncFunction 构造函数的实例,并且其中允许使用 await 关键字。async 和 await 关键字让我们可以用一种更简洁的方式写出基于 Promise 的异步行为,而无需刻意地链式调用 promise。
function resolveAfter2Seconds() {
return new Promise(resolve => {
setTimeout(() => {
resolve('resolved');
}, 2000);
});
}
async function asyn***all() {
console.log('calling');
const result = await resolveAfter2Seconds();
console.log(result);
// Expected output: "resolved"
}
asyn***all();
async 函数可能包含 0 个或者多个 await 表达式。await 表达式会暂停整个 async 函数的执行进程并出让其控制权,只有当其等待的基于 promise 的异步操作被兑现或被拒绝之后才会恢复进程。promise 的解决值会被当作该 await 表达式的返回值。使用 async/await 关键字就可以在异步代码中使用普通的 try/catch 代码块。
注意: await关键字只在
async 函数内
有效。如果你在 async 函数体之外使用它,就会抛出语法错误 SyntaxError 。
备注: async/await的目的为了简化使用基于 promise 的 API 时所需的语法。async/await 的行为就好像搭配使用了生成器和 promise。
await概念
await 操作符用于等待一个 Promise 兑现并获取它兑现之后的值。它只能在异步函数
或者模块顶层
中使用。
await expression;
expression为要等待的 Promise 实例,Thenable 对象,或任意类型的值。
返回值:返回从 Promise 实例或 thenable 对象取得的处理结果。如果等待的值不符合 thenable,则返回表达式本身的值
。
异常:拒绝(reject)的原因会被作为异常抛出。
await 通常用于拆开 promise 的包装,使用方法是传递一个 Promise 作为 expression。使用 await 总会暂停当前异步函数的执行,在该 Promise 敲定(settled,指兑现或拒绝)后继续执行。函数的执行恢复(resume)时,await 表达式的值已经变成了 Promise 兑现的值。
若该 Promise 被拒绝(rejected),await 表达式会把拒绝的原因(reason)抛出。当前函数(await 所在的函数)会出现在抛出的错误的栈追踪(stack trace),否则当前函数就不会在栈追踪出现。
await 总会同步地对表达式求值并处理,处理的行为与 Promise.resolve() 一致,不属于原生 Promise 的值全都会被隐式地转换为 Promise 实例后等待。处理的规则为,若表达式:
- 是一个原生 Promise(原生Promise 的
实例
或其派生类的实例,且满足 expression.constructor ===
Promise),会被直接用于等待,等待由原生代码实现,该对象的 then() 不会被调用
。 - 是 thenable 对象(包括非原生的 Promise 实例、polyfill、Proxy、派生类等),会构造一个新 Promise用于等待,构造时会调用该对象的 then() 方法。
- 不是 thenable 对象,会被包装进一个已兑现的 Promise 用于等待,其结果就是表达式的值。
等待 Promise 的兑现
当一个 Promise 被传递给 await 操作符,await 将等待该 Promise 兑现,并在兑现后返回该 Promise 兑现的值。
function resolveAfter2Seconds(x) {
return new Promise(resolve => {
setTimeout(() => {
resolve(x);
}, 2000);
});
}
async function f1() {
let x = await resolveAfter2Seconds(10);
console.log(x); // 10
}
f1();
转换为 promise
若表达式的值不是 Promise,await 会把该值转换为已兑现的 Promise,然后返回其结果。
async function f3() {
const y = await 20;
console.log(y); // 20
const obj = {};
console.log((await obj) === obj); // true
}
f3();
promise 被拒绝
如果 Promise 被拒绝,则抛出拒绝的原因。
async function f4() {
try {
const z = await Promise.reject(30);
} catch (e) {
console.error(e); // 30
}
}
f4();
处理被拒绝的 promise
你可以链式调用 catch()(而不是使用 try)以在等待 promise 兑现之前处理被拒绝的 promise。
const response = await promisedFunction().catch((err) => {
console.error(err);
return "default response";
});
// response will be "default response" if the promise is rejected