Que sont les fermetures en JavaScript et comment fonctionnent-elles?



Les fermetures en JavaScript sont créées chaque fois qu'une fonction est créée, au moment de la création de la fonction. Il offre un meilleur contrôle sur le code lors de leur utilisation.

est un langage fonctionnel qui donne beaucoup de liberté à l'utilisateur. Vous pouvez créer une fonction dynamiquement, la copier dans une autre variable ou la passer en argument à une autre fonction et l'appeler ultérieurement à partir d'un autre endroit. Les fermetures en JavaScript sont créées chaque fois qu'une fonction est créée, au moment de la création de la fonction. Dans cet article, nous allons comprendre les fermetures dans l'ordre suivant:

Introduction aux fermetures en JavaScript

Une fermeture est une combinaison d'un fonction regroupés avec des références à son état environnant, c'est-à-dire l'environnement lexical. En d’autres termes, une fermeture vous permet d’accéder depuis une fonction interne à la portée d’une fonction externe.





codeur - fermetures en javascript - edureka

La plupart des développeurs utilisent des fermetures en JavaScript consciemment ou inconsciemment. Il offre un meilleur contrôle sur le code lors de leur utilisation. En outre, c'est la question la plus fréquemment posée lors .



Exemple:

function foo () {var x = 10 function inner () {return x} return inner} var get_func_inner = foo () console.log (get_func_inner ()) console.log (get_func_inner ()) console.log (get_func_inner ())

Production:

dix
dix
dix



Ici, vous pouvez accéder au variable x qui est défini dans la fonction foo () via la fonction inner () car ce dernier préserve la chaîne de portée de la fonction englobante au moment de l'exécution de la fonction englobante. Ainsi, la fonction interne connaît la valeur de x à travers sa chaîne de portée. C'est ainsi que vous pouvez utiliser les fermetures en JavaScript.

Fermetures pratiques

Les fermetures vous permettent d'associer l'environnement lexical à une fonction qui opère sur ces données. Cela a des parallèles évidents avec programmation orientée objet , où les objets nous permettent d’associer les propriétés de l’objet à une ou plusieurs méthodes.

Par conséquent, vous pouvez utiliser une fermeture partout où vous pourriez normalement utiliser un objet avec une seule méthode.

Exemple:

algorithmes java et structures de données
function makeSizer (size) {return function () {document.body.style.fontSize = size + 'px'}} var size12 = makeSizer (12) var size14 = makeSizer (14) var size16 = makeSizer (16)

L'exemple ci-dessus est généralement joint en tant que rappel: une seule fonction qui est exécutée en réponse à l'événement.

Chaîne de portée

Les fermetures en JavaScript ont trois portées telles que:

  • Portée locale
  • Portée des fonctions externes
  • Portée mondiale

Une erreur courante est de ne pas se rendre compte que, dans le cas où la fonction externe est elle-même une fonction imbriquée, l’accès à la portée de la fonction externe inclut la portée englobante de la fonction externe, créant ainsi une chaîne de portées de fonction.

comment créer un package java
// portée globale var x = 10 function sum (a) {return function (b) {return function (c) {// fonctions externes scope return function (d) {// portée locale return a + b + c + d + x}}}} console.log (somme (1) (2) (3) (4)) // journal 20

Il peut également être écrit sans fonctions anonymes:

// portée globale var x = 10 function sum (a) {return function sum2 (b) {return function sum3 (c) {// étendue des fonctions externes return function sum4 (d) {// portée locale return a + b + c + d + x}}}} var s = somme (1) var s1 = s (2) var s2 = s1 (3) var s3 = s2 (4) console.log (s3) // log 20

Dans l'exemple ci-dessus, il existe une série de fonctions imbriquées qui ont toutes accès à la portée externe d'une fonction. Ainsi, vous pouvez dire que les fermetures ont accès à toutes les portées de fonction externes dans lesquelles elles ont été déclarées.

Fermeture dans une boucle

Vous pouvez utiliser des fermetures en JavaScript pour stocker une fonction anonyme à chaque index d'un tableau . Prenons un exemple et voyons comment les fermetures sont utilisées dans une boucle.

Exemple:

function external () {var arr = [] var i for (i = 0 i<3 i++) { // storing anonymus function arr[i] = function () { return i } } // returning the array. return arr } var get_arr = outer() console.log(get_arr[0]()) console.log(get_arr[1]()) console.log(get_arr[2]())

Production:

3
3
3
3

Avec cela, nous sommes arrivés à la fin de notre article. J'espère que vous avez compris comment fonctionnent les fermetures en JavaScript et comment elles sont utilisées pour mieux contrôler le code.

Maintenant que vous connaissez les fermetures en JavaScript, consultez le par Edureka. La formation de certification en développement Web vous aidera à apprendre à créer des sites Web impressionnants à l'aide des API HTML5, CSS3, Twitter Bootstrap 3, jQuery et Google et à les déployer sur Amazon Simple Storage Service (S3).

Vous avez une question pour nous? Veuillez le mentionner dans la section commentaires de «Fermetures en JavaScript» et nous vous recontacterons.