TypeScript中return x与return await x是否存在差异？

你给出的无异常捕获的示例场景下，两者的最终返回结果完全一致，差异主要体现在特殊场景、执行流程和性能上，下面对应三个问题逐一解答：

1. 两种写法是否存在逻辑层面的差异？ #

• 你提供的无try/catch的示例场景下，两者逻辑完全等价，最终都会返回一个和func()决议状态一致的Promise<void>。
• 仅在存在外层异常捕获的场景下存在逻辑差异：

  async function option1(): Promise<void> {
    try {
      return await func();
    } catch (e) {
      // 此处可以捕获到func()抛出的异常
      console.log('option1捕获到错误', e);
    }
  }
  
  async function option2(): Promise<void> {
    try {
      return func();
    } catch (e) {
      // 此处永远无法捕获到func()抛出的异常，异常会直接透传到option2的调用方
      console.log('option2捕获到错误', e);
    }
  }
  

  差异原因是return func()会直接把func()返回的Promise透传给外层，不会等待其决议，所以func()的异步异常无法触发当前函数的catch逻辑；而return await func()会等待func()的Promise决议完成后再返回，决议过程中抛出的异常会被当前函数的catch捕获。

2. 实际运行时两者会不会有不同的表现？ #

• 无异常的正常执行场景下，最终返回的Promise状态、值完全一致，业务侧感知不到差异。
• 运行时存在两个可感知的差异点：
  • 错误栈信息不同：如果func()执行抛出异常，return await的错误栈会包含option1的调用帧，调试时可以明确看到请求经过了option1；而直接return func()的错误栈通常会缺失option2的调用帧，不利于问题定位。
  • 执行时序略有差异：return await会等待func()的Promise决议后才会完成外层函数的执行；而直接return func()会立刻结束外层函数执行，后续func()的决议完全和外层函数无关。

3. ES2015和ES2017环境下两者是否存在性能差异？ #

存在轻微的性能差异，整体表现为直接return func()的性能优于return await func()：

• ES2017原生支持async/await的环境下：return await会多一次Promise的解包、等待开销，不过现代JS引擎对async/await的优化已经非常成熟，这个差异在普通业务场景下几乎可以忽略，只有高频调用场景下才会体现出差异。
• ES2015环境下：因为没有原生async/await，需要通过generator + Promise的方式模拟await逻辑，额外的迭代器调度开销会放大两者的性能差距，return await的运行耗时和内存开销都会更高，和你观察到的编译产物更多、多了yield关键字的现象完全对应。

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