Maison > interface Web > js tutoriel > le corps du texte

Comment les fermetures nous aident-elles à gérer la portée des variables dans les boucles JavaScript ?

Susan Sarandon
Libérer: 2024-10-31 16:17:23
original
687 Les gens l'ont consulté

How Do Closures Help Us Manage Variable Scope in JavaScript Loops?

Fermetures et portée des boucles

Comprendre l'utilisation des fermetures JavaScript dans les boucles est essentiel pour écrire du code modulaire et réutilisable. Les fermetures permettent aux fonctions d'accéder et de manipuler des variables à partir de leur portée englobante, même après le retour de la fonction englobante.

Le problème

Considérez l'extrait de code suivant :

<code class="javascript">function addLinks() {
    for (var i = 0, link; i < 5; i++) {
        link = document.createElement("a");
        link.innerHTML = "Link " + i;

        link.onclick = function(num) {
            return function() {
                alert(num);
            };
        }(i);
        document.body.appendChild(link);
    }
}</code>
Copier après la connexion

La principale ligne d'intérêt est la définition du gestionnaire d'événements onclick. Il utilise une fonction anonyme au sein d'une fermeture pour référencer la variable i, qui représente l'index du lien créé dans la boucle.

La solution : les usines de fonctions

Pour Pour clarifier l'utilisation des fermetures dans ce scénario, nous pouvons utiliser une approche d'usine de fonctions. Voici une version simplifiée du code :

<code class="javascript">function generateHandler(i) {
    return function() {
        alert(i);
    };
}

for (var i = 0; i < 5; i++) {
    document.getElementById(i).onclick = generateHandler(i);
}</code>
Copier après la connexion

Dans cet exemple, nous créons une fabrique de fonctions, generateHandler(), qui renvoie une fonction qui fait référence à la valeur i spécifiée. En utilisant l'usine pour générer chaque gestionnaire onclick, nous garantissons que chaque fonction possède sa propre copie privée de la variable i.

Comprendre les fermetures

Les fermetures capturent le contexte dans lesquels ils sont définis, y compris les variables ou paramètres de la portée environnante. Lorsqu'une fonction interne est invoquée dans une fermeture, elle a accès à ces variables capturées même après le retour de la fonction englobante.

Points clés

  • Les fermetures autorisent les fonctions pour accéder aux variables à partir de leur portée englobante.
  • L'utilisation d'une fabrique de fonctions peut aider à atténuer les problèmes de partage de variables dans les boucles.
  • Les fermetures fournissent un moyen de créer des variables privées spécifiques à chaque fonction.

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
Derniers articles par auteur
Tutoriels populaires
Plus>
Derniers téléchargements
Plus>
effets Web
Code source du site Web
Matériel du site Web
Modèle frontal
À propos de nous Clause de non-responsabilité Sitemap
Site Web PHP chinois:Formation PHP en ligne sur le bien-être public,Aidez les apprenants PHP à grandir rapidement!