如何让Caller函数等待Promise完成，实现1、2、3顺序输出？

我来帮你理清这个问题，你遇到的核心问题是即使把Caller改成async函数，调用它时没有等待它完成，所以后续的console.log('3')还是会提前执行。咱们一步步来解决：

为什么修改后的Caller还是不生效？ #

当你把Caller改成async function Caller() { await Test(); }后，Caller()本身会返回一个Promise，但你调用它的时候只是写了Caller()，没有等待这个Promise resolve，所以JS引擎会继续执行后面的console.log('3')，自然还是先输出3再输出2。

方案1：用async/await配合顶层异步执行（推荐） #

要让console.log('3')等待Caller完成，你需要在调用Caller的时候也使用await。但await只能在async函数或者现代JS环境的顶层作用域中使用，所以我们可以把顶层代码包裹在一个立即执行的async函数里：

function Test() {
  return new Promise((resolve, reject) => {
    setTimeout(() => {
      console.log('2');
      resolve();
    }, 2000);
  })
}

async function Caller() {
  await Test(); // 这里等待Test的Promise完成
}

// 用立即执行异步函数包裹顶层逻辑
(async function() {
  console.log('1');
  await Caller(); // 等待Caller的Promise完成
  console.log('3'); // 只有等上面的await完成后才会执行
})();

这样执行后，输出顺序就是1 → 2 → 3，完全符合你的预期。

如果你的环境支持ES模块（比如用import/export），也可以直接用顶层await，不用IIFE：

function Test() { /* 保持不变 */ }
async function Caller() { /* 保持不变 */ }

console.log('1');
await Caller();
console.log('3');

方案2：用Promise的then链（不用async/await） #

如果你不想用async/await，也可以通过Promise的then方法来实现顺序控制，只要让Caller返回Test的Promise即可：

function Test() {
  return new Promise((resolve, reject) => {
    setTimeout(() => {
      console.log('2');
      resolve();
    }, 2000);
  })
}

function Caller() {
  return Test(); // 必须返回Promise，才能在外面链式调用then
}

console.log('1');
Caller().then(() => {
  console.log('3'); // 当Test的Promise resolve后执行
});

这个方案同样能得到正确的输出顺序，核心是把console.log('3')放到Promise的回调里，确保它在Test完成后执行。

关于“不用async就能用await”的问题 #

很明确地说：不行。这是JavaScript的语法规则——await关键字只能出现在async函数的内部，或者现代JS环境的顶层作用域中（顶层await本质上还是依赖模块的异步处理机制）。如果尝试在非async函数里使用await，JS引擎会直接抛出语法错误，没有绕过的办法。

总结一下，不管用哪种方式，核心都是要让后续的代码（console.log('3')）等待Test的Promise完成后再执行，这样才能保证顺序正确。

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