Je suis en train de remplacer un ancien code qui a utilisé les objets jQuery Deferred et je suis en train de réécrire avec Bluebird / ES6 Promises.
Si j'ai plusieurs appels asynchrones, comment puis-je déclencher une fonction après que toutes les promesses ont été résolues.
En utilisant jQuery Deferreds, ce serait quelque chose comme ceci:
var requests = [...]; //some arbitrary data that is iterated to generate multiple ajax requests var promises = []; resuests.forEach(function(endpoint) { promises.push($.ajax({url: endpoint})); }); $.when.apply($, promises).then(function() { alert('all promises complete!'); });
Comment puis-je réécrire ceci en utilisant la syntaxe ES6 Promise?
Comme cela est marqué, bluebird en plus des deux bonnes solutions que vous avez déjà trouvées, c'est une façon plus "bluebird":
var requests = [...]; Promise.map(requests, $.get).then(function(results){ alert('all promises complete!'); });
C'est probablement aussi simple que possible.
Comme les autres l'ont souligné, la façon native d'utiliser la Promise.all
, aucune Promise.resolve
ou une création explicite est nécessaire. Le moyen le plus propre avec les promesses natives serait probablement:
var requests = [...]; Promise.all(requests.map($.get)).then(function(results){ });
En utilisant Promise.all
. Notez qu'il faut un itératif tel qu'un Array comme argument, contrairement à $.when
, alors il n'est pas nécessaire d' .apply
.
Vous voudrez également convertir le jQuery Deferred à une promesse ES6 natif en utilisant Promise.resolve(thejQueryDeferred)
. EDIT: Cela se fait implicitement par l'appel à Promise.all
, donc est vraiment facultatif.
Code entier:
var requests = [...]; //some arbitrary data that is iterated to generate multiple ajax requests var promises = []; requests.forEach(function(endpoint) { var nativePromise = Promise.resolve($.ajax({url: endpoint})); // if you want to make it clear that you're converting from jQuery Deferred to ES6 promise! promises.push(nativePromise); }); Promise.all(promises).then(function() { alert('all promises complete!'); });