O que $ .when.apply ($, someArray) faz?

Estou lendo sobre diferidos e promessas e continuo descobrindo $.when.apply($, someArray). Não estou certo do que isso faz exatamente, procurando uma explicação de que uma linha funciona exatamente (não o trecho de código inteiro). Aqui está algum contexto:

var data = [1,2,3,4]; // the ids coming back from serviceA
var processItemsDeferred = [];

for(var i = 0; i < data.length; i++){
  processItemsDeferred.push(processItem(data[i]));
}

$.when.apply($, processItemsDeferred).then(everythingDone); 

function processItem(data) {
  var dfd = $.Deferred();
  console.log('called processItem');

  //in the real world, this would probably make an AJAX call.
  setTimeout(function() { dfd.resolve() }, 2000);    

  return dfd.promise();
}

function everythingDone(){
  console.log('processed all items');
}

.applyé usado para chamar uma função com uma matriz de argumentos. Ele pega cada elemento na matriz e usa cada um como um parâmetro para a função. .applytambém pode alterar o context ( this) dentro de uma função.

Então, vamos pegar $.when. Costuma-se dizer "quando todas essas promessas forem resolvidas ... faça algo". Leva um número infinito (variável) de parâmetros.

No seu caso, você tem uma série de promessas; você não sabe para quantos parâmetros está passando $.when. Passar o próprio array para $.whennão funcionaria, porque ele espera que seus parâmetros sejam promessas, não um array.

É aí que .applyentra. Ele pega a matriz e chama $.whencada elemento como um parâmetro (e garante que thisesteja definido como jQuery/ $), então tudo funciona :-)

$ .when pega qualquer número de parâmetros e resolve quando todos eles foram resolvidos.

anyFunction .apply (thisValue, arrayParameters) chama a função anyFunction definindo seu contexto (thisValue será o this dentro da chamada de função) e passa todos os objetos em arrayParameters como parâmetros individuais.

Por exemplo:

$.when.apply($, [def1, def2])

É o mesmo que:

$.when(def1, def2)

Mas a forma de chamar apply permite que você passe uma matriz de um número desconhecido de parâmetros. (Em seu código, você está dizendo que seus dados vêm de um serviço, então essa é a única maneira de chamar $ .when )

Aqui, o código totalmente documentado.

// 1. Declare an array of 4 elements
var data = [1,2,3,4]; // the ids coming back from serviceA
// 2. Declare an array of Deferred objects
var processItemsDeferred = [];

// 3. For each element of data, create a Deferred push push it to the array
for(var i = 0; i < data.length; i++){
  processItemsDeferred.push(processItem(data[i]));
}

// 4. WHEN ALL Deferred objects in the array are resolved THEN call the function
//    Note : same as $.when(processItemsDeferred[0], processItemsDeferred[1], ...).then(everythingDone);
$.when.apply($, processItemsDeferred).then(everythingDone); 

// 3.1. Function called by the loop to create a Deferred object (data is numeric)
function processItem(data) {
  // 3.1.1. Create the Deferred object and output some debug
  var dfd = $.Deferred();
  console.log('called processItem');

  // 3.1.2. After some timeout, resolve the current Deferred
  //in the real world, this would probably make an AJAX call.
  setTimeout(function() { dfd.resolve() }, 2000);    

  // 3.1.3. Return that Deferred (to be inserted into the array)
  return dfd.promise();
}

// 4.1. Function called when all deferred are resolved
function everythingDone(){
  // 4.1.1. Do some debug trace
  console.log('processed all items');
}

Infelizmente não posso concordar com vocês.

$.when.apply($, processItemsDeferred).always(everythingDone);

Chamará everythingDoneassim que um adiado for rejeitado , mesmo se houver outros adiados pendentes .

Aqui está o script completo (eu recomendo http://jsfiddle.net/ ):

var data = [1,2,3,4]; // the ids coming back from serviceA
var processItemsDeferred = [];

for(var i = 0; i < data.length; i++){
  processItemsDeferred.push(processItem(data[i]));
}

processItemsDeferred.push($.Deferred().reject());
//processItemsDeferred.push($.Deferred().resolve());

$.when.apply($, processItemsDeferred).always(everythingDone); 

function processItem(data) {
  var dfd = $.Deferred();
  console.log('called processItem');

  //in the real world, this would probably make an AJAX call.
  setTimeout(function() { dfd.resolve(); }, 2000);    

  return dfd.promise();
}

function everythingDone(){
  alert('processed all items');
}

É um bug? Eu gostaria de usar isso como o cavalheiro acima descreveu.

Talvez alguém possa achar isso útil:

$.when.apply($, processItemsDeferred).then(everythingDone).fail(noGood);

everythingDone não é chamado em caso de rejeição

$ .when sozinho torna possível que um retorno de chamada seja chamado quando todas as promessas passadas a ele forem resolvidas / rejeitadas. Normalmente, $ .quando recebe um número variável de argumentos, usar .apply torna possível passar uma matriz de argumentos, é muito poderoso. Para obter mais informações sobre .apply: https://developer.mozilla.org/en-US/docs/JavaScript/Reference/Global_Objects/Function/apply

Obrigado pela sua solução elegante:

var promise;

for(var i = 0; i < data.length; i++){
  promise = $.when(promise, processItem(data[i]));
}

promise.then(everythingDone);

Apenas um ponto: ao usar resolveWithpara obter alguns parâmetros, ele quebra por causa da promessa inicial definida como indefinida. O que eu fiz para fazer funcionar:

// Start with an empty resolved promise - undefined does the same thing!
var promise;

for(var i = 0; i < data.length; i++){
  if(i==0) promise = processItem(data[i]);
  else promise = $.when(promise, processItem(data[i]));
}

promise.then(everythingDone);