JavaScript：如何等待第一个fetch执行完成后再启动第二个fetch？

• 问题根源：你当前的代码里，两个fetch是独立执行的，浏览器会几乎同时发起这两个请求，根本等不及第一个请求返回max值；而且max变量被锁在第一个then的回调函数作用域里，外部根本访问不到它。另外你的代码还存在语法错误——每个then的括号都没闭合，这也会直接导致代码运行失败。

• 修复方案：把第二个fetch嵌套进第一个fetch的第二个then回调内部，利用Promise的链式调用特性，确保第二个请求只有在第一个请求完成并拿到max值后才会执行。

修正后的完整代码：

fetch('api/foo?get_max=True')
  .then(function(response) { return response.json(); }) // 补上遗漏的闭合括号
  .then(function(response) {
    var max = response["max"];
    // 在这里发起第二个请求，此时max已经成功获取到值
    return fetch('api2/bar?max=' + max);
  })
  .then(function(response) { return response.json(); }) // 补上遗漏的闭合括号
  .then(function(mydata) { processdata(mydata); }) // 补上遗漏的闭合括号
  .catch(function(error) {
    // 别忘了添加错误处理，捕获请求过程中可能出现的异常
    console.error('请求出错:', error);
  });

如果想用更简洁的箭头函数写法，代码可以改成这样：

fetch('api/foo?get_max=True')
  .then(res => res.json())
  .then(res => fetch(`api2/bar?max=${res.max}`))
  .then(res => res.json())
  .then(mydata => processdata(mydata))
  .catch(err => console.error('请求出错:', err));

这样整个请求流程就变成了严格的顺序执行：第一个请求完成→拿到max值→发起第二个请求→处理返回的数据，完美解决了异步等待的问题。

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