跨境派

跨境派

跨境派,专注跨境行业新闻资讯、跨境电商知识分享!

当前位置:首页 > 工具系统 > 建站工具 > JavaScript中的await

JavaScript中的await

时间:2024-04-06 12:55:36 来源:网络cs 作者:晨起 栏目:建站工具 阅读:

标签:

JavaScript中的await

先来介绍一下async 函数

async 函数是使用async关键字声明的函数。async 函数是 AsyncFunction 构造函数的实例,并且其中允许使用 await 关键字。async 和 await 关键字让我们可以用一种更简洁的方式写出基于 Promise 的异步行为,而无需刻意地链式调用 promise。

function resolveAfter2Seconds() {  return new Promise(resolve => {    setTimeout(() => {      resolve('resolved');    }, 2000);  });}async function asyncCall() {  console.log('calling');  const result = await resolveAfter2Seconds();  console.log(result);  // Expected output: "resolved"}asyncCall();

在这里插入图片描述
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

本文链接:https://www.kjpai.cn/news/2024-04-06/154780.html,文章来源:网络cs,作者:晨起,版权归作者所有,如需转载请注明来源和作者,否则将追究法律责任!

版权声明:本文内容由互联网用户自发贡献,该文观点仅代表作者本人。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如发现本站有涉嫌抄袭侵权/违法违规的内容,一经查实,本站将立刻删除。

文章评论