Co robi $ .when.apply ($, someArray)?

Ja czytając o Deferreds i obiecuje i ciągle napotykając $.when.apply($, someArray). Nie jestem pewien, co to dokładnie robi, szukając wyjaśnienia, że jedna linia działa dokładnie (a nie cały fragment kodu). Oto kontekst:

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

.applysłuży do wywołania funkcji z tablicą argumentów. Pobiera każdy element tablicy i używa każdego jako parametru funkcji. .applymoże również zmienić context ( this) wewnątrz funkcji.

Więc weźmy $.when. Zwykło się mówić „kiedy wszystkie te obietnice zostaną spełnione ... zrób coś”. Zajmuje nieskończoną (zmienną) liczbę parametrów.

W twoim przypadku masz szereg obietnic; nie wiesz, do ilu parametrów przekazujesz $.when. Przekazanie samej tablicy do $.whennie zadziała, ponieważ oczekuje, że jej parametry będą obietnicami, a nie tablicą.

I tu .applypojawia się. Pobiera tablicę i wywołuje $.whenkażdy element jako parametr (i upewnia się, że thisjest ustawiony na jQuery/ $), więc wszystko działa :-)

$ .when przyjmuje dowolną liczbę parametrów i rozwiązuje problem, gdy wszystkie z nich zostaną rozwiązane.

anyFunction .apply (thisValue, arrayParameters) wywołuje funkcję anyFunction ustawiając jej kontekst (thisValue będzie tym wywołaniem tej funkcji) i przekazuje wszystkie obiekty w arrayParameters jako indywidualne parametry.

Na przykład:

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

Jest taki sam jak:

$.when(def1, def2)

Jednak zastosowany sposób wywołania umożliwia przekazanie tablicy o nieznanej liczbie parametrów. (W swoim kodzie mówisz, że dane pochodzą z usługi, to jedyny sposób wywołania $., Gdy )

Tutaj kod w pełni udokumentowany.

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

Niestety nie mogę się z wami zgodzić.

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

Zadzwoni, everythingDonegdy tylko jeden odroczony zostanie odrzucony , nawet jeśli są inne oczekujące na odroczenie .

Oto pełny skrypt (polecam 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');
}

Czy to błąd? Chciałbym tego używać tak, jak dżentelmen powyżej opisał.

Może ktoś uzna to za przydatne:

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

EverythingDone nie jest wywoływane w przypadku odrzucenia

$ .when samodzielnie umożliwia wywołanie funkcji zwrotnej, gdy wszystkie przekazane mu obietnice zostaną rozwiązane / odrzucone. Zwykle $., Gdy pobiera zmienną liczbę argumentów, użycie .apply umożliwia przekazanie mu tablicy argumentów, jest bardzo potężne. Więcej informacji na temat .apply: https://developer.mozilla.org/en-US/docs/JavaScript/Reference/Global_Objects/Function/apply

Dzięki za eleganckie rozwiązanie:

var promise;

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

promise.then(everythingDone);

Tylko jeden punkt: podczas używania resolveWithdo uzyskania niektórych parametrów, zrywa się z powodu początkowej obietnicy ustawionej na niezdefiniowaną. Co zrobiłem, żeby to zadziałało:

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