如何在Promise.then回调中正确使用await调用异步函数

• 初次代码报错：await 语法只能在标记为async的函数作用域内使用。你写在.then()回调里的箭头函数是普通同步函数，没有async属性，自然触发语法报错。
• 二次修改无效果：你在.then()的返回值里直接写了一个async function的函数定义，既没有主动调用这个函数，也没有把函数执行后的Promise对象传递给外层的await等待逻辑，函数体内部的代码从来没有被执行过，自然看不到任何响应。

推荐写法（全async/await风格，逻辑最清晰） #

彻底移除嵌套的.then()调用，直接在当前get_data的async作用域内用await获取func1的返回值，后续判断、调用func2的逻辑都和外层处于同一个async作用域，完全符合await的使用规则，也能严格保证执行顺序：

async function get_data() {
  for (i = 0; i < 10; i++) {
    // 等待func1执行完成，拿到返回的json结构
    const json = await func1(data1, data2);
    // 满足判断条件时，直接在当前作用域等待func2执行完成
    if (json.value < 100) {
      await func2();
    }
    // 本轮的func1、func2全部执行完毕后，才会进入下一次循环
  }
}

保留链式写法的兼容方案 #

如果因为代码迁移成本必须保留.then()的链式调用结构，只需要给.then()的回调函数添加async标记，让回调本身成为合法的async作用域即可：

async function get_data() {
  for (i = 0; i < 10; i++) {
    await func1(data1, data2).then(async (json) => {
      // 回调本身是async函数，内部的await语法不存在作用域问题
      if (json.value < 100) {
        await func2();
      }
    })
  }
}

这种写法下，.then()的回调返回的是func2执行后的Promise，外层的await func1(...).then(...)会一直等到这个Promise resolve，才会进入下一轮循环，严格保证func2执行完成后再推进流程。

• 不要在.then()里返回未执行的async函数定义，比如then(json => async function() { ... })这种写法，本质是把函数对象作为then的返回值，函数体根本不会运行。
• 只要保证每一层被await等待的对象是Promise实例，就能严格按照顺序执行：func1完成 → 判断条件 → 触发func2等待 → 进入下一轮循环，完全满足需要的"func2执行完成再继续后续逻辑"的要求。

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