嵌套async/await使用：await player.play()是否需要在两处添加async？

结论 #

写法2正确，不需要在外层foo函数前加async关键字

原因解释 #

• 首先，player.play()返回Promise对象，要对它执行await操作，只需要保证它直接所在的上层函数是async修饰的异步函数即可。你的代码里player.play()直接放在ready事件的回调函数内，所以只要给这个回调函数加async就满足语法要求，两种写法在这部分的处理都是正确的。
• 外层foo函数的核心逻辑是注册事件监听器，这是同步执行的操作，本身没有需要等待的异步逻辑，也不需要返回Promise，额外加async属于冗余操作。
• 写法1中给foo加async后，调用时加的await foo()也没有实际作用：foo返回的Promise只会等待自身内部同步代码执行完成，不会等待内部ready事件触发、player.play()执行完毕，这个await完全达不到等待播放操作完成的效果。

特殊场景补充 #

如果你的业务需求确实需要等待player.play()执行完成再执行后续逻辑，需要手动把foo封装为返回Promise的函数，写法参考如下：

const foo = (player) => {
  return new Promise((resolve, reject) => {
    const videoIns = videojs;
    videoIns.addEventListener('ready', async () => {
      try {
        const playRes = await player.play();
        resolve(playRes);
      } catch (err) {
        // 捕获播放失败异常，比如用户未交互导致的自动播放拦截等
        reject(err);
      }
    })
  })
}

// 此时才需要await调用
await foo();

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