Maison > interface Web > js tutoriel > Pourquoi « wait arr.map() » échoue-t-il et comment « Promise.all » peut-il le réparer ?

Pourquoi « wait arr.map() » échoue-t-il et comment « Promise.all » peut-il le réparer ?

DDD
Libérer: 2024-12-12 20:52:14
original
140 Les gens l'ont consulté

Why Does `await arr.map()` Fail, and How Can `Promise.all` Fix It?

Comprendre Async Await et Array.map Synergy

Dans l'extrait de code :

var arr = [1,2,3,4,5];

var results: number[] = await arr.map(async (item): Promise<number> => {
    await callAsynchronousOperation(item);
    return item + 1;
});
Copier après la connexion

vous recevez l'erreur "TS2322 : Tapez 'Promise< ;number>[]' n'est pas attribuable au type 'number[]'". Cette erreur signifie une incompatibilité entre le type attendu (numéro[]) et le type réel (Promesse[]). Pour résoudre ce problème, nous devons comprendre comment async wait et Array.map interagissent.

Le problème

Le problème survient parce que vous essayez d'attendre un tableau de promesses (Promesse[]), ce qui diffère de l'attente d'une seule promesse. wait, lorsqu'il est appliqué à un objet qui n'est pas une promesse, renvoie simplement la valeur instantanément. Dans cette situation, puisque vous attendez un tableau d'objets Promise, la valeur résultante est le tableau lui-même (Promise[]).

La solution

Pour corriger cette erreur, vous pouvez utiliser Promise.all pour transformer le tableau Promise[] en une seule Promise. Selon la documentation MDN, Promise.all se résout une fois que toutes les promesses de l'argument itérable ont été résolues. Dans votre code, l'argument itérable est le tableau de promesses renvoyé par arr.map.

En utilisant Promise.all, vous convertissez votre tableau de promesses en une seule promesse, vous permettant d'attendre la résolution de toutes les promesses. simultanément.

var arr = [1, 2, 3, 4, 5];

var results: number[] = await Promise.all(arr.map(async (item): Promise<number> => {
    await callAsynchronousOperation(item);
    return item + 1;
}));
Copier après la connexion

Vous pouvez également envisager d'utiliser Promise.allSettled, Promise.any ou Promise.race en fonction de votre cas d'utilisation spécifique. Cependant, pour le scénario que vous avez proposé, Promise.all reste le choix le plus approprié.

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!

source:php.cn
Déclaration de ce site Web
Le contenu de cet article est volontairement contribué par les internautes et les droits d'auteur appartiennent à l'auteur original. Ce site n'assume aucune responsabilité légale correspondante. Si vous trouvez un contenu suspecté de plagiat ou de contrefaçon, veuillez contacter admin@php.cn
Tutoriels populaires
Plus>
Derniers téléchargements
Plus>
effets Web
Code source du site Web
Matériel du site Web
Modèle frontal