javascript - 在 "then"处理程序内返回 Promise 会导致另一个不相关的 Promise 使用返回的 Promise 的解析值进行解析

Question

我一直在试图解决这个问题，我也想知道分辨率值是如何传递的 getAnswer的then称呼。首先我return add的结果我认为它会返回一个 Promise，它允许我使用 then调用then方法getAnswer ，但是第二个 return 怎么办？语句传递给它？

 function add(num1, num2) {
  return new Promise((resolve, reject) => {
    setTimeout(() => {resolve(num1 + num2);}, 500)

  });
}

function getAnswer() {
  return add(5, 5).then((res) => {
    console.log(res);
    return new Promise((resolve, reject) => {
      resolve("How does this get passed too getAnswer's then function?");
    });
  });
}

getAnswer().then((res) => {
  console.log(res);
})

Answer 1

基础知识:

add返回一个 Promise——它是 Promise 的一个实例对象， Promise 的每个实例有一个then您可以使用它来观察该 promise 的解决方案的方法。
出于链接目的，then其设计方式是它返回一个 Promise 本身(因此，JavaScript 中的每个 then 调用将始终返回一个新的 Promise)。 then 返回的 promise 将用其处理程序的返回值来解析(稍后会详细介绍)。

现在，当你说:

  return add(5, 5).then((res) => {
    console.log(res);
    return new Promise((resolve, reject) => {
      resolve("How does this get passed too getAnswer's then function?");
    });
  });

您不会返回add的结果，您将返回通过调用 then 创建的 promise 上add的结果(这只是标准的 JS 行为)。

您的问题:

but then how does the second return statement get passed to it?

这是 then 的内容方法返回，根据MDN(([])里面的部分是我添加的):

A Promise in the pending status ([this is what your first return statement is actually returning]). The handler function (onFulfilled or onRejected) gets then called asynchronously ([the handler in your example is the function you've passed to the then inside getAnswer]). After the invocation of the handler function, if the handler function:

• returns a value, the promise returned by then gets resolved with the returned value as its value;
• throws an error, the promise returned by then gets rejected with the thrown error as its value;
• ([this is your case -- your second return]) returns an already resolved promise, the promise returned by then gets resolved with that promise's value as its value;
• returns an already rejected promise, the promise returned by then gets rejected with that promise's value as its value.
• returns another pending promise object, the resolution/rejection of the promise returned by then will be subsequent to the resolution/rejection of the promise returned by the handler. Also, the value of the promise returned by then will be the same as the value of the promise returned by the handler.

就我个人而言，每当我看到 then 返回 Promise 时的处理程序，我只是假设 - 为了简化我的想法 - Promise 由 then 返回最初已被替换为 then 之一刚刚返回的 Promise的处理程序。当然，这种心理映射与实际功能是平行的，据我所知。

所以，总结一下:

1. getAnswer返回一个由 add(5, 5).then(...) 创建的 promise .
2. 然后您会观察到使用 then 返回的 promise ( getAnswer().then(...) ) —— 此处无关，但此调用也创建了一个 promise 。
3. 碰巧 add 返回的 promise 观察处理程序call (此处理程序是您在 #1 中传递给 then 的函数)也返回一个 promise ，规则是如果 then 的处理程序返回 promise p ，那么每当 p解析值为 v ，最初的 promise ——由 then 创建-- 将通过 v 解决也是如此。
4. 最后，您传递给 then 的处理程序在 #2 中观察 getAnswer() 返回的 promise 将使用值 v 进行调用从#3开始。

<小时/>请随意要求任何澄清，但在此之前，请阅读 this文章彻底。