主页 / user-19104772

Toby Harnish's questions

Martin Hope
Toby Harnish
Asked: 2024-02-12 00:53:20 +0800 CST
  • 7

这是我在 JS 中尝试 Promise 时得到的一个有趣的观察结果。考虑这段代码：

Promise.resolve(1).then(2).then(console.log);

这会打印出 1 作为其输出。为什么本机实现的 Promise API 没有抛出异常？当非函数参数被忽略时，“跳过”它有什么好处？我真的很感激你的回答

这篇文章可以在MDN中找到。

javascript
Martin Hope
Toby Harnish
Asked: 2023-08-20 04:19:42 +0800 CST
  • 9

我最近在 Stack Overflow 上遇到了这个问题，询问 then 方法在 JavaScript 中是如何工作的。响应者 Trincot 发表了以下评论：

主机将检查哪些作业队列有条目，优先考虑高优先级的作业队列。Promise 作业队列具有非常高的优先级，通常高于处理用户交互或其他外部事件的事件队列。因此，上面第 4 步放入队列的作业将从 Promise Job 队列中取出。该作业将顺序调用 myPromise 对象上已注册为 then 回调的回调函数（例如在步骤 7 中注册的回调函数）。

如果我正确理解他的解释，每当调用resolve函数时，JavaScript都会在作业队列中安排一个微任务（或一个作业），当调用堆栈为空时，它将执行传递给then的所有回调，包括链接。例如：

Promise.resolve("Hi")
    .then(() => {
        console.log("Hi");
    })
    .then(() => {
        console.log("World");
    });

在这种情况下，承诺会立即解决，这意味着将立即安排微任务。当 then 回调完成执行时，JS 引擎将检查队列中是否有微任务。由于 Promise 立即得到解决，因此它将执行微任务，微任务又执行传递给 then 方法的所有处理程序。结果，代码将输出“Hi”和“World”。

但是，为什么这段代码输出“1 3 2 4”而不是“1 2 3 4”呢？

const p1 = Promise.resolve();
const p2 = Promise.resolve();
p1.then(() => {
    console.log(1);
}).then(() => {
    console.log(2);
});
p2.then(() => {
    console.log(3);
}).then(() => {
    console.log(4);
});

我相信代码应该输出“1 2 3 4”而不是“1 3 2 4”。这是因为，当 p1 和 p2 解析时，两个微任务会排队。当 then 回调完成执行时，它们将这些回调添加到其内部列表中。一旦调用堆栈为空，JS 引擎就会从队列中选择最旧的任务并执行它。此任务应执行传递给该特定 Promise 实例的所有 then 处理程序。然而，事情似乎并没有按预期发生。有人可以向我解释这种行为背后的原因吗？

感谢您抽出宝贵的时间，祝您有美好的一天！

javascript