返回的 Promise 有什么区别？

Question

返回的 Promise 有什么区别？

4

有两个情况，都返回Promise，并与以下then方法链接。但结果序列是不同的。一些注释： Promise.resolve(value) -> 立即返回使用值实现的Promise。并且在then方法中，当我们再次返回值时，它会返回一个带有该值的已完成Promise。从逻辑上讲不应该有任何区别。两者都是立即... 提前感谢...

Promise.resolve(1)
  .then((v) => {
    console.log(v);
    return Promise.resolve(v + 1);
  })
  .then((v) => {
    console.log(v);
    return Promise.resolve(v + 1);
  })
  .then((v) => {
    console.log(v);
    return v + 1;
  })
  .then((v) => {
    console.log(v);
    return v + 1;
  });

Promise.resolve(10)
  .then((v) => {
    console.log(v);
    return v + 1;
  })
  .then((v) => {
    console.log(v);
    return v + 1;
  })
  .then((v) => {
    console.log(v);
    return v + 1;
  })
  .then((v) => {
    console.log(v);
    return v + 1;
  });

//Result on the console:
//1
//10
//11
//12
//2
//13
//3
//4

//

Promise.resolve(1)
  .then((v) => {
    console.log(v);
    return v + 1;
  })
  .then((v) => {
    console.log(v);
    return v + 1;
  })
  .then((v) => {
    console.log(v);
    return v + 1;
  })
  .then((v) => {
    console.log(v);
    return v + 1;
  });

Promise.resolve(10)
  .then((v) => {
    console.log(v);
    return v + 1;
  })
  .then((v) => {
    console.log(v);
    return v + 1;
  })
  .then((v) => {
    console.log(v);
    return v + 1;
  })
  .then((v) => {
    console.log(v);
    return v + 1;
  });

//Result on the console:
//1
//10
//2
//11
//3
//12
//4
//13

- sharpenedguy

1

异步任务的执行顺序在实际应用中更多或更少是未定义的。（你可以深入了解微任务和事件循环的细节，但为什么要这样做呢？）只要每个 Promise 返回预期的结果，你就不必太关心它何时到达。 - deceze

@deceze 谢谢。我只是想理解它背后的逻辑。 - sharpenedguy

2个回答

0

请记住，JavaScript 是单线程的，并且将所有方法添加到队列中。我以下所做的就是承诺应该以某种方式编写的方式。

Javascript 将所有任务添加到第一列中，在队列中执行所有命令，然后在发现异步方法中的列2和3中添加更多任务。

如果您像这样查看它，那么它非常合乎逻辑。

- Rickard Elimää

“Javascript不会将所有任务添加到第一列” - then会同步地将处理程序附加到Promise，但是只有在Promise解决时，这些处理程序才会被安排到队列中。 - Bergi

网页内容由stack overflow 提供, 点击上面的

可以查看英文原文，
原文链接

- T.J. Crowder · Accepted Answer

重要的区别在于：请记住then会返回一个承诺（我们称之为承诺T）。当你这样做：

return Promise.resolve(v + 1);

当你将 Promise T 解析为一个 Promise（我们称之为 Promise B）时，你会这样做：

return v + 1;

...你正在将 Promise T 解决为立即值。

将 Promise T 解决为 Promise B 会在解决过程中引入额外的“刻度”。Promise T 不再排队调用其解决处理程序，而是必须等待 Promise B 调用它所设置的解决处理程序，然后才能调用它自己的解决处理程序。因此，出现了额外的“刻度”（基本上是微任务队列的另一个循环）。

以下是一个更简单的示例，请注意它在记录“First 2”之前记录“Second 2”：

Promise.resolve(1)
    .then(v => Promise.resolve(v + 1))
    .then(v => console.log(`First: ${v}`));
Promise.resolve(1)
    .then(v => v + 1)
    .then(v => console.log(`Second: ${v}`));

如果没有额外的承诺，它会在“第二个2”之前记录“第一个2”，而如果有额外的承诺，它则记录“第二个2”后再记录“第一个2”：

Promise.resolve(1)
    .then(v => v + 1)
    .then(v => console.log(`First: ${v}`));
Promise.resolve(1)
    .then(v => v + 1)
    .then(v => console.log(`Second: ${v}`));

最近对于像 return await somePromise 这样的 async 函数，已经取消了这个额外的勾选（而不是仅仅 return somePromise），因为可以通过 async/await 内部处理本地承诺可靠地删除它。但我不确定对于您的情况是否可以可靠地删除它，或者这样做是否会受到必须执行它的人员的重视。它需要将从 then 处理程序返回的 native promise 与任何其他 thenable¹ 区分开来，这可能会有问题。（但我不能确定它是否会有问题。）

¹ thenable vs. promise ： https://promisesaplus.com