Promise.
Attend que toutes les promesses soient résolues et renvoie un tableau de leurs résultats. Se rejette dès la première erreur.
- Renvoie
- Une promesse résolue avec un tableau de résultats, ou rejetée avec la première erreur.
Exemple
#const load = (name, ms) =>
new Promise((resolve) => {
setTimeout(() => {
console.log(`Prêt : ${name}`)
resolve(name)
}, ms)
})
const results = await Promise.all([load('profil', 300), load('cours', 100), load('badges', 200)])
console.log(results)Définition et utilisation
#La méthode Promise.all() prend un tableau (ou un autre objet itérable) de promesses et renvoie une seule promesse. Celle-ci se résout quand toutes les autres sont résolues, et sa valeur est un tableau des résultats dans l’ordre des promesses passées, peu importe laquelle s’est terminée en premier.
Cela permet à des opérations indépendantes de s’exécuter en parallèle plutôt que l’une après l’autre. Trois requêtes qui durent chacune 300 ms prendront ensemble environ 300 ms, et non 900 ms.
Si une promesse quelconque est rejetée, Promise.all() se rejette immédiatement avec cette même erreur, et les résultats des autres sont perdus. Les opérations elles-mêmes ne sont pas interrompues pour autant. Quand vous avez besoin des résultats de toutes les opérations, y compris celles qui ont échoué, utilisez Promise.allSettled().
Syntaxe
#Promise.all(iterable)Paramètres
#iterable
tableau de promesses
Les promesses à combiner. Les valeurs normales (qui ne sont pas des promesses) se retrouvent dans le résultat sans changement.
Plus d’exemples
#const wait = (ms, value) => new Promise((resolve) => setTimeout(() => resolve(value), ms))
const fail = (ms, message) =>
new Promise((_, reject) => setTimeout(() => reject(new Error(message)), ms))
try {
await Promise.all([wait(300, 'profil'), fail(100, 'Échec du chargement des cours')])
} catch (error) {
console.log(error.message)
}const wait = (ms, value) => new Promise((resolve) => setTimeout(() => resolve(value), ms))
const getPoints = (student) => wait(100, student.length * 10)
const students = ['Léa', 'Lucas', 'Emma']
const points = await Promise.all(students.map(getPoints))
console.log(points)Compatibilité des navigateurs
#Largement disponible
Fonctionne dans tous les navigateurs modernes, y compris sur mobile. Vous pouvez l’utiliser sans crainte.
- Chrome
- Edge
- Firefox
- Safari
Bonnes pratiques
#- Associez
Promise.all()àmap()pour lancer la même opération sur plusieurs éléments à la fois :await Promise.all(ids.map(loadUser)). - N’utilisez pas
Promise.all()pour des opérations qui dépendent les unes des autres. Si la deuxième étape a besoin du résultat de la première, exécutez-les l’une après l’autre. - Quand l’échec d’une opération ne doit pas annuler le reste, choisissez
Promise.allSettled().
Entrées associées
#- Promise.all() vs Promise.allSettled()Promise.all() est rejetée dès la première erreur et renvoie un tableau de résultats, tandis que Promise.allSettled() attend chaque promesse et n’est jamais rejetée.
- Promise.allSettled()Attend que toutes les promesses soient réglées et renvoie une description de chaque résultat, succès comme erreurs.
- Promise.race()Renvoie une promesse qui se règle de la même façon que la première promesse réglée de la liste : par un succès ou par une erreur.
- Promise.any()Renvoie le résultat de la première promesse résolue. Ne se rejette que si toutes échouent.
- awaitMet en pause une fonction async jusqu’au règlement d’une promesse, puis renvoie sa valeur ou lève son erreur.
- Array.prototype.map()Crée un nouveau tableau avec les résultats de l’appel d’une fonction pour chaque élément.
Vous voyez une erreur ou il manque un exemple ? Écrivez-nous.