Quelles sont les fermetures JavaScript avec des exemples?

Quelles sont les fermetures JavaScript avec des exemples?

JavaScript est un langage de programmation polyvalent qui prend en charge un large éventail de paradigmes de programmation. L'une des caractéristiques les plus puissantes de JavaScript est la fermeture, qui permette aux développeurs de créer un code puissant et flexible. Dans cet article, nous explorerons ce que sont les fermetures et comment elles fonctionnent, ainsi que quelques exemples.

Qu'est-ce qu'une fermeture en javascript?

Une fermeture est une fonction intérieure qui a accès aux variables, paramètres et arguments de la fonction extérieure. La fonction intérieure peut accéder à ces variables même après le retour de la fonction extérieure. Une fermeture vous permet d'encapsuler et de protéger les données au sein d'une fonction, empêchant l'accès par d'autres fonctions.

Les fermetures sont créées lorsqu'une fonction est définie dans une autre fonction et renvoyée comme une valeur. La fonction retournée maintient une référence aux variables de la fonction extérieure, même après le retour de la fonction extérieure. Cela signifie que la fonction intérieure peut accéder et manipuler ces variables.

Les fermetures peuvent être utilisées dans une variété de situations, telles que la création de variables et de méthodes privées, de mettre en œuvre des rappels et des gestionnaires d'événements, et la gestion de l'État.

Exemple 1: Variables et méthodes privées

L'une des utilisations les plus courantes des fermetures est de créer des variables et des méthodes privées. Les variables et méthodes privées ne sont pas accessibles à partir de l'extérieur de la fonction, les rendant plus sécurisées et moins sujettes aux erreurs.

fonction compter () let count = 0; fonction incrément () count ++; console.log (count); Retour incrément; const incimprémentCount = compter (); IncrémentCount (); // 1 incrémentCount (); // 2 incrémentCount (); // 3
12345678910111213141516fonction compter () let count = 0; fonction incrément () count ++; console.log (count); Retour incrément; const IncramentCount = compter (); IncrémentCount (); // 1IncrementCount (); // 2IncrementCount (); // 3

Dans l'exemple ci-dessus, nous avons créé un comptoir fonction qui renvoie une fonction d'incrément. Le compter la variable est définie dans le comptoir fonction mais n'est accessible que de la incrément fonction. Chaque fois le incrément La fonction est appelée, il augmente la variable de nombre et enregistre la nouvelle valeur à la console.

Exemple 2: rappels et gestionnaires d'événements

Les fermetures peuvent également être utilisées pour implémenter des rappels et des gestionnaires d'événements. Un rappel est une fonction qui est transmise comme argument à une autre fonction et est appelée lorsque l'autre fonction se termine. Les gestionnaires d'événements sont des fonctions qui sont appelées en réponse à un événement spécifique, tel qu'un clic de bouton ou une soumission de formulaire.

fonction fetchData (url, rappel) fetch (url) .alors (réponse => réponse.JSON ()) .alors (data => rappel (données)) .Catch (erreur => console.erreur (erreur)); fetchData ('https: // api.exemple.com / data ', fonction (data) console.journal (données); );
12345678910fonction fetchData (url, rappel) fetch (url) .alors (réponse => réponse.JSON ()) .alors (data => rappel (données)) .Catch (erreur => console.erreur (erreur)); fetchData ('https: // api.exemple.com / data ', fonction (data) console.log (data););

Dans l'exemple ci-dessus, nous avons créé un fetchdata fonction qui prend une URL et une fonction de rappel comme des arguments. Le fetchdata La fonction utilise le aller chercher API pour récupérer les données de l'URL spécifiée, puis transmet ces données à la fonction de rappel. La fonction de rappel est définie comme une fonction anonyme qui enregistre les données à la console.

Exemple 3: Gestion de l'état

Les fermetures peuvent également être utilisées pour gérer l'État dans un programme. L'état fait référence aux données qui décrivent l'état actuel du programme, tels que les paramètres de l'entrée des utilisateurs ou de l'application.

fonction createCounter (initialValue = 0) let count = initialValue; return incment () count ++; console.log (count); , décrément () count--; console.log (count); , reset () count = initialValue; console.log (count); ; const compter = createCounter (5); comptoir.incrément(); // 6 comptoir.décrémente (); // 5 comptoir.réinitialiser(); // 5
123456789101112131415161718192021222324fonction createCounter (initialValue = 0) let count = initialValue; return incment () count ++; console.log (count); , décrément () count--; console.log (count); , reset () count = initialValue; console.log (count); ; const compter = createCounter (5); comptoir.incrément(); // 6Counter.décrémente (); // 5Counter.réinitialiser(); // 5

Dans l'exemple ci-dessus, nous avons créé un createCounter fonction qui renvoie un objet avec trois méthodes: incrément, diminution, et réinitialiser. Les méthodes accèdent et manipulent une variable de comptage qui est définie dans le createCounter fonction. La valeur initiale de compter est défini sur le paramètre InitialValue transmis à createCounter. Chaque méthode renvoie la valeur mise à jour du compter et le enregistre à la console.

Le comptoir objet renvoyé par createCounter maintient une référence à la variable de comptage dans le createCounter fonction, permettant le incrément, diminution, et réinitialiser Méthodes pour accéder et modifier l'état du programme.

Conclusion

En conclusion, les fermetures sont une caractéristique puissante de JavaScript qui vous permet de créer un code flexible et sécurisé. Les fermetures sont créées lorsqu'une fonction est définie dans une autre fonction et renvoyée comme une valeur. La fonction retournée maintient une référence aux variables de la fonction extérieure, même après le retour de la fonction extérieure. Les fermetures peuvent être utilisées dans une variété de situations, telles que la création de variables et de méthodes privées, la mise en œuvre de rappels et de gestionnaires d'événements, et de gestion de l'état. En utilisant des fermetures dans votre code JavaScript, vous pouvez écrire des applications plus robustes et maintenables.