I have a function that does something like this:
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 */;
}
So, when someone uses do_something
, they can also chain more callbacks, like:
do_something().then(function(_foo_2, _bar_2, _baz_2) {
console.log(_foo_2, _bar_2, _baz_2);
});
The problem is that I don't know how to bypass the original return from do_something_else
to the anonymous function described. I don't want to receive a list, but positional arguments instead, so "when foo" inserts some value to do_something_else's _foo and then the same value goes to _foo_2.
How can I do it in JS?
Use an anonymous function inside of .then
and pass the parameters that you want to pass. I'm replacing .then
with .done
because you don't need .then
in this case.
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 actually creates a new deferred object and sends that to the chain. Since you didn't return anything from .then
, the new deferred object has no arguments. See this example:
$.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
});
If you instead just used .done
, it would work as expected.
$.when($.Deferred().resolve(2), $.Deferred().resolve(4))
.done(function(a,b) {
console.log(a,b);
}).done(function(a,b) {
console.log(a,b);
});
The most common use for .then
is chaining ajax requests:
$.ajax({...}).then(function(){
return $.ajax({...});
}).then(function(){
return $.ajax({...});
}).then(function(){
return $.ajax({...});
}).then(function(){
return $.ajax({...});
});
which can also be easily done in a loop. Each .then
will have access to the returned data from the previous request.