web-dev-qa-db-fra.com

Enchaînez plusieurs "puis" dans jQuery.when

J'ai une fonction qui fait quelque chose comme ça:

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 */;
}

Ainsi, lorsque quelqu'un utilise do_something, ils peuvent également chaîner plus de rappels, comme:

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

Le problème est que je ne sais pas comment contourner le retour d'origine de do_something_else à la fonction anonyme décrite. Je ne veux pas recevoir de liste, mais des arguments positionnels à la place, donc "lorsque foo" insère une valeur dans _foo de do_something_else, puis la même valeur va dans _foo_2.

Comment puis-je le faire dans JS?

33
Lucas Sampaio

Utilisez une fonction anonyme dans .then et transmettez les paramètres que vous souhaitez transmettre. Je remplace .then avec .done parce que vous n'avez pas besoin de .then dans ce cas.

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);
    });
}

. puis crée en fait un nouvel objet différé et l'envoie à la chaîne. Puisque vous n'avez rien retourné de .then, le nouvel objet différé n'a aucun argument. Voir cet exemple:

$.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
});

Si vous avez simplement utilisé .done, cela fonctionnerait comme prévu.

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

L'utilisation la plus courante de .then enchaîne les requêtes ajax:

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

ce qui peut également être fait facilement en boucle. Chaque .then aura accès aux données retournées de la demande précédente.

65
Kevin B