我还在学习 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
都会为我们提供我期望的顺序。
最佳答案
您早早看到 6
的原因是因为您没有链接,而是分支。
当您调用 p.then().then().then()
时,您得到了一个 必须 以正确顺序执行的 promise 链。
但是,如果您调用 p.then().then(); p.then()
,你有 2 个 promise 附加到 p
- 本质上是创建一个分支,第二个分支将与第一个分支一起执行。
你可以通过确保将它们链接在一起来解决这个问题 p = p.then().then(); p.then();
仅供引用,您几乎从不想分支,除非您将它们重新组合在一起(例如 Promise.all
),或者有意创建一个“即发即弃”分支。
关于JavaScript Promise then() 排序,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/29111626/