Javascript中立即调用的异步函数表达式

  在学习使用Playwright/Typescript的过程中看到这样的代码结构:

(async () => {
//代码体
})()

以下是ChatGPT生成的解释:

(async () => {})() 是一个 立即调用的异步函数表达式(Immediately Invoked Async Function Expression,简称 IIFE)。它包含几个关键点,下面逐一解释:

1. async () => {}

这是一个 异步箭头函数async 函数)。在 JavaScript 中,async 函数总是返回一个 Promise。即使函数内部没有明确的 return,它也会自动将函数的返回值包装成一个 Promise 对象。异步函数可以使用 await 来等待异步操作(如网络请求、文件读取等)的完成。

在这段代码中,async () => {} 是一个匿名的异步箭头函数,它的作用是将包含异步逻辑的代码包装在一个函数中。

2. () (调用函数)

async () => {} 后面紧接着一个小括号 (),这表示 立即调用 这个函数。这种模式常见于 JavaScript 中的 立即执行函数表达式(IIFE),它的作用是立即执行定义好的函数。这里加上了 async 关键字,使得这个函数变成了一个异步函数。

3. 完整结构解析

  • (async () => { ... }) 定义了一个异步箭头函数。
  • () 在函数定义后面调用这个异步函数,使得它在定义后立刻执行。

为什么要使用立即调用的异步函数(IIFE)?

  1. 模块化代码:通过这种方式,你可以将异步操作封装在一个独立的作用域中,避免污染全局作用域。
  2. 简洁性:如果你不想显式地定义一个函数,然后再调用它,可以直接使用这种简洁的方式立即执行代码。
  3. 异步代码执行:在顶层使用 await 是不被允许的(因为它会阻塞后面的代码),所以我们需要通过一个异步函数来包装它,从而在函数内部使用 await

举个例子

假设你有一段异步操作,不想单独创建函数,可以直接将异步操作写在立即调用的异步函数中:

(async () => {
    const result = await fetch('https://api.example.com/data');
    const data = await result.json();
    console.log(data);
})();

在这个例子中,异步操作是在一个匿名异步函数中执行的,这使得代码更紧凑且易于理解。

评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值