在jQuery.when中链多个“then”

时间:2013-06-20 14:33:02

标签: javascript jquery jquery-deferred

我有一个类似这样的功能:

function do_something() {
    // some code

    return $.when(foo, bar, baz).then(do_something_else);
}

function do_something_else(_foo, _bar, _baz) {
    // do something else

    return /* the original inputs */;
}

因此,当有人使用do_something时,他们也可以链接更多回调,例如:

do_something().then(function(_foo_2, _bar_2, _baz_2) {
    console.log(_foo_2, _bar_2, _baz_2);
});

问题是我不知道如何绕过从do_something_else到原始回复的匿名函数。我不想收到列表,而是接收位置参数,所以“当foo”为do_something_else的_foo插入一些值,然后相同的值转到_foo_2。

我怎样才能在JS中做到这一点?

1 个答案:

答案 0 :(得分:65)

.then内使用匿名函数并传递您要传递的参数。我正在用.then替换.done,因为在这种情况下您不需要.then

function do_something() {
    // some code

    return $.when(foo, bar, baz).done(function(_foo_2, _bar_2, _baz_2){
        do_something_else.apply(this,_foo_2);
    });
}

。然后实际创建一个新的延迟对象并将其发送到链。由于您没有从.then返回任何内容,因此新的延迟对象没有参数。见这个例子:

$.when($.Deferred().resolve(2), $.Deferred().resolve(4))
.then(function(a,b) { 
    console.log(a,b); // 2,4
    return $.Deferred().resolve(a,b,6);
}).then(function(a,b,c) { 
    console.log(a,b,c); // 2,4,6
});

如果您只使用.done,它将按预期工作。

$.when($.Deferred().resolve(2), $.Deferred().resolve(4))
.done(function(a,b) { 
    console.log(a,b);
}).done(function(a,b) { 
    console.log(a,b);
});

.then最常见的用途是链接ajax请求:

$.ajax({...}).then(function(){
    return $.ajax({...});
}).then(function(){
    return $.ajax({...});
}).then(function(){
    return $.ajax({...});
}).then(function(){
    return $.ajax({...});
});

也可以在循环中轻松完成。每个.then都可以访问上一个请求中返回的数据。