JavaScript中如何等待带异步调用的函数返回结果后再执行重定向

核心问题是funcB为异步函数，主逻辑不会等待其回调执行就会触发redirect，同时你原有逻辑中的if(funcB())写法存在逻辑错误：直接调用funcB作为判断条件会提前触发函数执行，且该函数无同步返回值，判断结果恒为false。

推荐方案：Promise改造+async/await（代码更易维护） #

步骤1：改造funcB支持Promise调用 #

修正原有代码中catch分支未定义err的问题，同时兼容原有回调写法：

function funcB(user, context, callback) {
    const axios = require('axios@0.19.2');
    return new Promise((resolve, reject) => {
        axios({method: 'POST', url: 'xxxx', data: '{xxxx}'})
            .then(res => {
                const access_token = res.data.access_token;
                return axios({method: 'POST', url: 'xxx', data: `{xxxx}` });
            })
            .then(res => {
                const ticket = res.data.ticket;
                // 兼容回调参数
                if (typeof callback === 'function') callback(null, ticket);
                resolve(ticket);
            })
            .catch(err => {
                if (typeof callback === 'function') callback(err);
                reject(err);
            })
    })
}

步骤2：改写主逻辑等待异步执行完成 #

将主逻辑封装为async函数，需要调用funcB时通过await等待执行完成：

async function processUsrAndRedirect() {
    const usr = {};
    // 原有funcA逻辑保持不变
    if (funcA()) {
        usr.a = funcA();
    }
    // 替换为你实际的业务判断条件，不要直接调用funcB()作为判断
    const needGetTicket = true; 
    if (needGetTicket) {
        try {
            usr.ticket = await funcB(user, context);
        } catch (err) {
            // 自行处理接口调用失败逻辑
            console.error('获取ticket失败', err);
        }
    }
    // 所有属性赋值完成后再执行重定向
    redirect(usr);
}

// 执行主逻辑
processUsrAndRedirect();

备选方案：纯回调实现 #

如果不想改动funcB的实现，也可以把重定向逻辑放到回调中处理：

const usr = {};
if (funcA()) {
  usr.a = funcA();
} 
// 替换为实际业务判断条件
const needGetTicket = true;
if (needGetTicket) {
  funcB(user,context,function (error, ticket) {
      if (!error) usr.ticket = ticket;
      redirect(usr);
  });
} else {
  // 不需要调用funcB时直接重定向
  redirect(usr);
}

内容的提问来源于stack exchange，提问作者fireball.1