Les Fermetures en JavaScript

Qu'est-ce qu'une fermeture ?

Les fermetures (ou closures en anglais) sont des fonctions qui peuvent accéder à des variables et à d'autres contenus même en dehors de leur portée originelle. Cela signifie qu'une fonction peut conserver l'accès à son environnement même après avoir été exécutée. Ce comportement est très utile dans des cas variés, notamment pour créer des fonctions dynamiques ou pour le maintien d'état.

Exemple de fermeture

Considérons l'exemple suivant qui illustre comment une fermeture peut être créée chaque fois qu'une nouvelle fonction est définie :

let maChaineGlobale = 'Monde';
function externe() {  
  let maChaineLexicale = 'Bonjour';
  function interne() {
    maChaineLocale = `${maChaineGlobale}, ${maChaineLexicale}!`;
    return maChaineLocale;
  }
  return interne;
}

Dans ce code : - maChaineGlobale est dans la portée globale, car elle n'est définie à l'intérieur d'aucune autre fonction. - De l'intérieur de interne(), tout ce qui est en dehors de son propre contexte (comme la fonction externe ou l'environnement global) est accessible, y compris maChaineLexicale et maChaineGlobale. - Finalement, maChaineLocale est une variable localement définie qui peut utiliser tous les autres éléments de son environnement lexical.

Fermetures et Callbacks

Un autre cas fréquent des fermetures en JavaScript se produit en combinaison avec des callbacks. Par exemple, la fonction setInterval() crée une fermeture dans le callback compter() qui saisit les références aux variables globales monIntervalle et compteur :

let compteur = 0;
let monIntervalle = setInterval(function() {
  compteur++;
  console.log(compteur);
  if (compteur === 7) {
    clearInterval(monIntervalle);
    monIntervalle = null;
  }
}, 1000);

Dans ce scénario, chaque seconde, compteur est incrémenté de 1 tout en préservant sa valeur entre les appels. Lorsque compteur atteint 7, nous utilisons clearInterval() pour arrêter le compteur et remettons monIntervalle à null.