jQuery の $.when() で Deferred の配列を正しく処理するにはどうすればよいですか?

$.when() での Deferred の配列の処理

Deferred Promise の配列を扱う場合、その処理方法を知ることが重要ですそれらを $.when() に渡すとき。この記事では、Deferred の配列が $.when() によって正しく処理されない問題を詳しく掘り下げ、解決策を提供します。

問題

次のコードを考えてみましょう:

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

この例では、「すべて完了しました!」すべての遅延タスクが完了した後に表示されます。ただし、$.when() は Deferred の配列を単一のエンティティとして認識しないため、「すべて完了しました!」という結果になります。

解決策

Deferred の配列を $.when() に渡すには、Function.prototype.apply:

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

を使用します。

この関数はパラメーターの配列を受け取り、それらを関数に適用します。例:

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

ES6 では、次のスプレッド演算子を使用することもできます:

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

以上がjQuery の $.when() で Deferred の配列を正しく処理するにはどうすればよいですか?の詳細内容です。詳細については、PHP 中国語 Web サイトの他の関連記事を参照してください。