Maison > interface Web > js tutoriel > forEach contre for : la confrontation asynchrone !

forEach contre for : la confrontation asynchrone !

DDD
Libérer: 2025-01-07 22:41:41
original
673 Les gens l'ont consulté

forEach vs. for: The Asynchronous Showdown!

Comprendre comment les choix de bouclage affectent les performances asynchrones

Dans mon récent projet, j'avais besoin de mettre à jour un grand nombre d'enregistrements dans une base de données NoSQL – plus d'un millier. Comme les mettre à jour tous en même temps n’était pas réalisable et que le processus était également asynchrone, j’ai décidé de les traiter par lots plus petits de 20 enregistrements chacun. J'ai implémenté cela dans une boucle en utilisant forEach, où chaque ensemble de 20 serait mis à jour avant de passer à l'ensemble suivant. Cependant, après avoir mis cette approche en pratique, j’ai remarqué que tous les enregistrements n’étaient pas mis à jour comme prévu, même au sein de ces petits lots. Par exemple, lorsque j’ai tenté de mettre à jour un lot de 25 enregistrements, seuls 10 ont été mis à jour avec succès. Il n'y avait aucun journal pour les 10 autres enregistrements, et le nombre d'enregistrements dont la mise à jour n'a pas pu être mise à jour variait de manière aléatoire : parfois 12, parfois 5 ou parfois 7.

Après un débogage plus approfondi, j'ai observé que ces enregistrements étaient susceptibles d'être ignorés pendant le processus de mise à jour. Maintenant, pourquoi est-ce arrivé ? Explorons ce problème pour comprendre le comportement et identifier les raisons potentielles qui le sous-tendent.

Problème
Après quelques recherches, j'ai découvert que l'utilisation d'une fonction asynchrone dans une boucle forEach sans un mécanisme approprié pour attendre toutes les itérations peut entraîner des problèmes. Dans ce cas, nous avons utilisé async/await dans la boucle forEach sans nous assurer que toutes les itérations étaient attendues (voir le code ci-dessous) :

async function patchRecords(records) {
    // Here, the length of records is 25
    let successfulUpdates = 0; // Initialize a counter for successful updates

    records.forEach(async (item) => {
        await databaseName.patch(item);
        successfulUpdates++; // Increment counter on successful update
    });
    // Return the number of records updated successfully
    return successfulUpdates;
}

const response = await patchRecords(records); // Make sure to await this call
Copier après la connexion
Copier après la connexion

Dans le code ci-dessus, il n'y a aucun mécanisme pour garantir que toutes les itérations asynchrones de la boucle sont terminées. La méthode forEach déclenche plusieurs appels asynchrones pour corriger les enregistrements, mais la fonction patchRecords atteint rapidement l'instruction return sans attendre la fin de ces correctifs. Par conséquent, pendant que les mises à jour sont traitées en arrière-plan, la fonction continue sans attendre leur fin. Cela peut conduire à ce que certaines promesses en attente ne soient pas tenues, ce qui peut entraîner des mises à jour ignorées ou rejetées.

Solution
Alors, comment pouvons-nous résoudre ce problème ? Avant de nous lancer dans la solution, comprenons d’abord les différentes manières d’itérer sur les données. Fondamentalement, il existe deux approches : Itérer sur les données séquentiellement ou en parallèle.

Si vous souhaitez parcourir les données de manière asynchrone et séquentielle, l'utilisation d'une boucle forEach peut conduire aux problèmes dont nous avons discuté. Au lieu de cela, il est préférable d'utiliser une boucle for…of moderne ou une simple boucle for, car elles permettent à await de fonctionner correctement et de garantir que toutes les mises à jour sont traitées. sans être ignoré (voir le code ci-dessous).

async function patchRecords(records) {
    // Here, the length of records is 25
    let successfulUpdates = 0; // Initialize a counter for successful updates

    records.forEach(async (item) => {
        await databaseName.patch(item);
        successfulUpdates++; // Increment counter on successful update
    });
    // Return the number of records updated successfully
    return successfulUpdates;
}

const response = await patchRecords(records); // Make sure to await this call
Copier après la connexion
Copier après la connexion

D'un autre côté, si vous souhaitez traiter des enregistrements en parallèle, encore une fois, utiliser forEach ne fonctionnera pas. Bien que chaque rappel asynchrone renvoie une promesse, certaines de ces promesses peuvent rester non tenues car elles ne sont pas attendues. Utilisez plutôt map pour générer un tableau de promesses, puis attendez-les avec Promise.all (voir le code ci-dessous).

async function patchRecords(records) {
    let successfulUpdates = 0; // Counter for successful updates

    for (const item of records) {
        try {
            // Query to patch each record
            await databaseName.patch(item);
            successfulUpdates++; // Increment counter on success
        } catch {
            // Handle any errors
        }
    }

    return successfulUpdates; // Return the number of records updated successfully
}

const response = await patchRecords(records); // Make sure to await this call
Copier après la connexion

Cela montre à quel point le choix de la bonne méthode de bouclage peut avoir un impact considérable sur les résultats attendus de vos opérations asynchrones. Le type de boucle que vous utilisez, qu'il s'agisse de forEach, for…of ou d'une for boucle standard, joue un rôle crucial dans la façon dont votre code gère les tâches asynchrones.

Conclusion

  • Défi : La mise à jour groupée d'enregistrements à l'aide de forEach a entraîné des mises à jour incohérentes, de nombreux enregistrements étant ignorés.
  • Cause fondamentale : forEach n'attend pas la fin des opérations asynchrones, ce qui conduit à des promesses non tenues.
  • Solution : Utilisez une boucle for…of pour attendre chaque mise à jour séquentielle de l'enregistrement pour plus de précision, ou utilisez map avec Promise.all pour les mises à jour simultanées.

Est-ce que j'ai expliqué les choses clairement ? faites-le-moi savoir dans les commentaires ci-dessous.

J'ai aimé partager mon expérience et j'espère que vous l'avez également trouvée utile ! Comme j’explore encore cet espace, j’aimerais recevoir vos commentaires et suggestions. ☺️ Si vous voyez des domaines dans lesquels je peux m'améliorer, ou si vous avez des sujets que vous aimeriez que j'aborde, n'hésitez pas à nous contacter ! ? site web. Je suis ravi d’apprendre et de grandir avec votre aide. ??

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!

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