如何在VS Code调试控制台运行JavaScript async函数并查看结果？

我之前也碰到过完全一样的困扰——在断点调试时，想直接在控制台查看async函数的执行结果，要么拿到的是Promise { pending }，要么用await直接调用还会报语法错误。下面几个方法亲测有效：

方法1：用.then()结合控制台打印 #

直接在调试控制台输入这段代码：

getUrl().then(result => console.log(result))

虽然调用后会立刻返回Promise { pending }，但当axios请求完成、Promise状态变为resolved时，控制台会自动打印出实际的返回结果。这是最不需要额外配置的简单方案。

方法2：用自执行异步函数包裹await #

如果你更习惯await的写法，可以把代码放在异步自执行函数（IIFE）里：

(async () => {
  const result = await getUrl();
  console.log(result);
})();

这个函数本身会返回pending的Promise，但内部的console.log会在请求完成后输出结果。你之前可能没留意到，这个方法其实是有效的，只是函数返回的Promise状态不影响最终结果的打印。

方法3：开启VS Code调试控制台的顶级await支持 #

如果你想直接用await getUrl()这种简洁写法，需要确保你的VS Code版本足够新（1.58及以上），且调试器支持顶级await。对于Node.js调试来说，现在默认是支持的，但如果还是报错，可以检查你的launch.json配置，确保添加了异步栈追踪的设置：

{
  "type": "node",
  "request": "launch",
  "name": "Launch Program",
  "program": "${file}",
  "asyncStackTraces": true
}

开启asyncStackTraces后，调试控制台的顶级作用域就支持直接使用await了，此时你输入await getUrl()就能直接拿到resolved后的结果。

补充说明 #

为什么直接调用getUrl()只会返回pending的Promise？因为async函数本身就会返回Promise，而axios请求是异步操作，调用瞬间Promise还处于等待状态，只有当请求完成后才会变为resolved。而之前用await报错，大多是因为旧版本VS Code的调试控制台不支持顶级await，必须把await放在异步函数内部才行。

内容的提问来源于stack exchange，提问作者Gary