Top-level Await

以前 await 只能写在 async 函数里面；现在在模块的最顶层（最外面）也能直接用 await。

1. 以前 vs 现在

以前 · 要包一层 async 函数	现在 · 模块顶层直接用
function getData() { return new Promise(resolve => { setTimeout(() => resolve("数据来了"), 500); }); } // 以前：非得套个 async 函数 async function load() { let data = await getData(); console.log(data); } load();	function getData() { return new Promise(resolve => { setTimeout(() => resolve("数据来了"), 500); }); } // 现在：模块最外层直接等 let data = await getData(); console.log(data);

以前 · 要包一层 async 函数

现在 · 模块顶层直接用

function getData() {
  return new Promise(resolve => {
    setTimeout(() => resolve("数据来了"), 500);
  });
}

// 以前：非得套个 async 函数
async function load() {
  let data = await getData();
  console.log(data);
}
load();

function getData() {
  return new Promise(resolve => {
    setTimeout(() => resolve("数据来了"), 500);
  });
}

// 现在：模块最外层直接等
let data = await getData();
console.log(data);

以前非得套个 async 函数再调用；现在脚本（模块）最外层直接 await，少一层壳。

2. 注意：必须是模块

// 要这么引用才是"模块"，才能用顶层 await
<script type="module" src="main.js"></script>

普通 script 里不能用，得是 type="module" 的脚本。用 Vite / Webpack 等项目打包时很常见。

一句话：顶层 await = 在模块最外层直接等结果，不用再包一层 async 函数。