javascript-如何顺序调用延迟函数?
作者:互联网
我的代码:
<?php
if(isset($_GET['m'])) {
$m = $_GET['m'];
sleep($m);
print "done, m=$m";
die;
}
?>
<script src="//ajax.googleapis.com/ajax/libs/jquery/1.10.2/jquery.min.js" ></script>
<script>
function w(s) {
document.body.innerHTML = document.body.innerHTML+ "<br>" + s
}
function aaa(def) {
w("begin aaa");
$.ajax({
type: "GET",
data: {
m: 5
}
}).done(function(html) {
w(html);
def.resolve();
});
}
function bbb(def) {
w("begin bbb");
$.ajax({
type: "GET",
data: {
m: 1
}
}).done(function(html) {
w(html);
def.resolve();
});
}
$(function() {
$.when(
$.Deferred(function(d) { aaa(d) }).promise(),
$.Deferred(function(d) { bbb(d) }).promise()
).done(function() {
w("OK")
});
})
</script>
我期望第二个函数等待第一个函数完成,也就是说,我的输出应该是
begin aaa
<--pause
done, m=1
begin bbb
<--pause
done, m=5
OK
相反,我越来越
begin aaa
begin bbb
<--pause
done, m=1
<--pause
done, m=5
OK
我想我误会了有关延期工作原理的一些基本知识-任何人都可以找到答案吗?
解决方法:
如果它们之间没有依赖关系,您如何期望它们按顺序执行? $.当对承诺的评估没有影响也无法产生影响时,它会等到每个承诺都得到解决.
您的代码要复杂得多. $.ajax已经返回了一个Promise,当收到Ajax响应时,它会被解析,因此您可以从函数中返回它.如果要按顺序执行它们,可以通过.then
链接它们:
These filter functions can return a new value to be passed along to the promise’s
.done()
or.fail()
callbacks, or they can return another observable object (Deferred, Promise, etc) which will pass its resolved / rejected status and values to the promise’s callbacks.
因此,您的代码简化为:
function aaa() {
w("begin aaa");
return $.ajax({
type: "GET",
data: {
m: 5
}
}).done(w);
}
function bbb() {
w("begin bbb");
return $.ajax({
type: "GET",
data: {
m: 1
}
}).done(w);
}
aaa().then(bbb).done(function() { w('ok'); });
在这里,aaa().then(bbb)创建您需要的依赖项.它基本上意味着“一旦解决了aaa的承诺,就执行bbb”.另外,.then返回一个新的promise,当bbb返回的promise得到解析时,该promise将被解析,这使您可以在aaa和bbb的promise都被解析时执行一个函数.
也许这些可以帮助您更好地理解承诺(和延期):
> Deferred versus promise
> http://learn.jquery.com/code-organization/deferreds/
没有$.ajax的示例:
function aaa() {
var def = new $.Deferred();
setTimeout(function() {
def.resolve(21);
}, 3000);
return def.promise();
}
function bbb(v) {
var def = new $.Deferred();
setTimeout(function() {
def.resolve(v * 2);
}, 1000);
return def.promise();
}
// aaa -> bbb -> console.log
// The value is logged after 3 + 1 seconds
aaa().then(bbb).done(function(v) { console.log(v); }); // 42
// (aaa | bbb) -> console.log
// The value is logged after max(3, 1) seconds and both resolved values are
// passed to the final promise
$.when(aaa(), bbb(5)).done(function(v) { console.log(v); }); // [21, 10]
标签:javascript,jquery,jquery-deferred 来源: https://codeday.me/bug/20191009/1879240.html