JavaScript Promise then() 排序

Question

我还在学习 JavaScript Promise，我遇到了一个我不明白的行为。

var o = $("#output");
var w = function(s) {
    o.append(s + "<br />");
}

var p = Promise.resolve().then(function() {
    w(0);
}).then(function() {
    w(1);
});

p.then(function() {
    w(2);
    return new Promise(function(r) {
        w(3);
        r();
    }).then(function() {
        w(4);
    });
}).then(function() {
    w(5);
});

p.then(function() {
    w(6);
});

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<div id="output"></div>

我希望这些语句按顺序运行——也就是说，输出是

0
1
2
3
4
5
6

相反，输出是

0
1
2
3
6
4
5

即使删除内部 Promise 也会给出在我看来是矛盾的结果。 1在2之前输出，但是6在5之前输出。

有人能给我解释一下吗？

我注意到，每次重新分配 p 都会为我们提供我期望的顺序。

Answer 1

您早早看到 6 的原因是因为您没有链接，而是分支。

当您调用 p.then().then().then() 时，您得到了一个 必须 以正确顺序执行的 promise 链。
但是，如果您调用 p.then().then(); p.then()，你有 2 个 promise 附加到 p - 本质上是创建一个分支，第二个分支将与第一个分支一起执行。

你可以通过确保将它们链接在一起来解决这个问题 p = p.then().then(); p.then();

仅供引用，您几乎从不想分支，除非您将它们重新组合在一起(例如 Promise.all)，或者有意创建一个“即发即弃”分支。