在 ES11 中，JavaScript 引入了一个新的特性：Top Level Await。这个特性使得 JavaScript 的异步调用更为灵活易用，尤其是在模块化编程中，能够更好地处理异步操作。
什么是 Top Level Await？
Top Level Await 是指在模块的顶层作用域中使用 await 关键字。在以前的版本中，JavaScript 不允许在顶层作用域中使用 await 关键字，因为这会引起语法错误。而在 ES11 中，这个限制被解除了，允许在顶层作用域中使用 await。
Top Level Await 的优势
Top Level Await 的优势主要体现在以下几个方面：
- 简化异步代码
在以前的版本中，如果要在模块的顶层作用域中执行异步操作，需要使用回调函数或 Promise 等方式来处理。而使用 Top Level Await 可以直接在顶层作用域中使用 await 关键字来等待异步操作的结果，使得异步代码更加简洁易读。
- 更好的错误处理
在以前的版本中，如果在模块的顶层作用域中发生了异步错误，很难进行捕获和处理。而使用 Top Level Await 可以直接在 try-catch 语句中捕获异常，更好地处理错误。
- 更好的模块化编程
Top Level Await 使得模块化编程更加灵活。在以前的版本中，如果需要在模块的顶层作用域中执行异步操作，需要使用一些特殊的技巧来处理。而使用 Top Level Await 可以直接在顶层作用域中使用 await 关键字来等待异步操作的结果，使得模块化编程更加自然。
Top Level Await 的示例代码
下面是一个使用 Top Level Await 的示例代码：
// javascriptcn.com 代码示例
// 异步函数
async function fetchData() {
const response = await fetch('https://api.github.com/users/github');
const data = await response.json();
return data;
}
// 在模块的顶层作用域中使用 Top Level Await
const data = await fetchData();
console.log(data);在这个示例代码中，我们定义了一个异步函数 fetchData，用于获取 GitHub 用户信息。然后在模块的顶层作用域中使用 Top Level Await，等待异步函数的返回结果，并将结果输出到控制台中。
总结
Top Level Await 是 ES11 中一个非常重要的特性，它使得 JavaScript 的异步调用更为灵活易用，尤其是在模块化编程中，能够更好地处理异步操作。在实际开发中，我们可以充分利用这个特性，简化异步代码，更好地处理错误，以及更加自然地进行模块化编程。
来源：JavaScript中文网 ，转载请注明来源 本文地址：https://www.javascriptcn.com/post/6558722ad2f5e1655d29f0ea