Javascript 当它'；什么是承诺链的内部？

我有一些javascript代码，我正在努力理解。我有一个返回承诺的函数，在其中一个

then

块中，我有一个

axios.post

（来自库）。当这个函数运行时，在控制台中我看到“Finishhere”，但我从来没有看到“PostComplete”。我想这是因为函数在axios.post响应返回之前完成了？对吗？如果我也想在控制台中显示“post complete”，我需要做什么

function X () {
  return new Promise((resolve, reject) => {
    if (x) {
      ...
      resolve();
    } else {
      ...
      reject();
    }
  }).then(() => {
    axios.post(
      url, 
      data
    ).then((response) => {
      ...
      console.log("post complete");
    });
  }).then(() => {
    ...
    console.log("finish here");
  });
}

---

您不能将axios承诺返回到主承诺链。无论如何，你真的不应该做出这样的承诺；如果then或catch回调返回一个承诺，它将冒泡到主链，并可以从那里直接链接。请尝试以下方法：

function X () {
  return new Promise((resolve, reject) => {
    if (x) {
      ///...
      resolve();
    } else {
      ///...
      reject();
    }
  })
  .then(() => axios.post(url, data))
  .then(response => {
    //...
    console.log("post complete");
  })
  .then(() => {
    ///...
    console.log("finish here");
  });
}

---

axios post的回调将返回该承诺。OP没有，因为带大括号的箭头函数不会隐式返回任何内容，它们也没有显式使用

return

。我还将帖子的

.then

直接链接到主承诺链中，而不是嵌套它，因此更容易阅读。仅供参考，嵌套

.then（）

回调在延续需要访问上一个延续中声明的局部变量的场景中是有效的做法（例如，本例中的

url

和

data

，如果它们是在第一次

回调的主体中声明的。然后（）

回调）@PatrickRoberts我想说，在这种情况下，如果没有办法将这些变量重构到更高的范围，更好的解决方案是使用

Promise将它们传递到下一个回调。所有的
。像OP发现的那样，这样的嵌套链会使它更难遵循：）（或者，您知道，最好跳过所有这些，直接跳到async/await:D）@IceMetalPunk显式地将变量传递到下一个延续或在闭包中捕获它们是一个风格偏好问题。两者都是有效的解决方案，并且两种方法都是可行的，这一事实并不会取消另一种方法的资格。但是，是的，
async
/
await
是链接承诺和隐式的语法糖用闭包捕获变量（即嵌套延续）。我并不是说它“不合格”——很明显，它工作得很好。它只是更难阅读，因为它会导致回调金字塔。更难阅读会让bug更容易潜入——就像这个问题所显示的，就像一个问题：）所有同等工作的东西都是偏好的问题，但有些东西比其他东西更难阅读。很可能您的axios请求只是遇到了一个错误，而您没有发现。