Comment puis-je gérer correctement les tableaux de différés avec $.when() de jQuery ?

Gestion des tableaux de promesses différées dans $.when()

Lorsque vous travaillez avec des tableaux de promesses différées, il est important de savoir comment les gérer en les passant dans $.when(). Dans cet article, nous aborderons un problème où un tableau de Deferreds n'est pas géré correctement par $.when() et fournirons une solution.

Le problème

Considérez le code suivant :

function getSomeDeferredStuff() {
  var deferreds = [];

  for (i = 1; i <= 10; i++) {
    var count = i;

    deferreds.push(
      $.post('/echo/html/', {
        html: '<p>Task #' + count + ' complete.',
        delay: count
      }).success(function(data) {
        $("div").append(data);
      }));
  }

  return deferreds;
}

$(function() {
  $("a").click(function() {
    var deferreds = getSomeDeferredStuff();

    $.when(deferreds).done(function() {
      $("div").append('<p>All done!</p>');
    });
  });
});

Dans cet exemple, "Tout est terminé !" devrait apparaître une fois que toutes les tâches différées sont terminées. Cependant, $.when() ne reconnaît pas le tableau des Deferreds comme une seule entité, ce qui entraîne le message « Tout est terminé ! » être affiché prématurément.

La solution

Pour transmettre un tableau de Deferreds à $.when(), utilisez Function.prototype.apply :

$.when.apply($, my_array).then( ___ );

Cette fonction prend un tableau de paramètres et les applique à une fonction. Par exemple :

$.when.apply($, deferreds).then(function() {
  $("div").append('<p>All done!</p>');
});

Alternativement, dans ES6, vous pouvez utiliser l'opérateur spread :

$.when(...my_array).then( ___ );

Ce qui précède est le contenu détaillé de. pour plus d'informations, suivez d'autres articles connexes sur le site Web de PHP en chinois!