Que sont les fermetures en Javascript

Qu'est-ce qu'une fermeture ?

Qu'est-ce qu'une fermeture ? Closure est Closure, qui est une nouvelle fonctionnalité que les langages statiques n'ont pas. Mais la fermeture n'est pas quelque chose de trop compliqué à comprendre.En bref, la fermeture est : la fermeture est l'ensemble des variables locales de la fonction, mais ces variables locales continueront d'exister après le retour de la fonction. La fermeture signifie que la "pile" d'une fonction n'est pas libérée après le retour de la fonction. On peut également comprendre que ces piles de fonctions ne sont pas allouées sur la pile mais sur le tas. Lorsqu'une autre fonction est définie au sein d'une fonction, une fermeture se produira. . Sac.

Fermeture = fonction créée à l'intérieur de la fonction (ou fonction interne en abrégé) + informations environnementales lors de la création de la fonction

La fermeture n'est donc pas égale à une fonction anonyme, bien que certaines personnes appellent ces fonctions The la fonction créée en interne est une fonction de fermeture, mais je pense qu'elle n'est pas exacte.

Jetons un coup d'œil au code suivant :

function init() {
    var name = "Zilongshanren"; // name 是在 init 函数里面创建的变量
    // displayName() 是一个内部函数，即一个闭包。注意，它不是匿名的。
    function displayName() {
        console.log(name);
    }
    //当 displayName 函数返回后，这个函数还能访问 init 函数里面定义的变量。
    return displayName;
}
var closure = init();
closure();
Zilongshanren
undefined

displayName est une fonction créée à l'intérieur de la fonction init. Elle transporte toutes les informations de la portée interne de la fonction init, telles que. le nom ici. Lorsque la fonction displayName est renvoyée, elle transporte elle-même les informations d'environnement lors de sa création, c'est-à-dire la variable name dans la fonction init.

À quoi sert la fermeture ?

Après avoir compris ce qu'est une fermeture, vous vous demanderez peut-être : cette chose est si difficile à comprendre, à quoi sert-elle ?

Parce qu'il n'y a aucun moyen de créer des méthodes privées en JS. Ce n'est pas comme Java ou C++ qui ont le mot-clé privé pour définir des propriétés et des méthodes privées. En JS, seules les fonctions peuvent créer des objets appartenant à leur propre portée. JS n'a pas de portée de bloc ! J'écrirai un autre article pour présenter cela en détail plus tard.

Tout vétéran de la programmation sait que pour bien écrire un programme, l'encapsulation et l'abstraction doivent être bien utilisées ! L'incapacité de définir des propriétés et des méthodes privées signifie que l'encapsulation et l'abstraction ne peuvent pas du tout être utilisées. . .

Vous ne pouvez pas définir des choses privées, toutes les variables et fonctions sont publiques. Il y a évidemment un problème, Global is Evil !

Les fermetures sont notre sauveur !

Jetons un coup d'œil au code suivant :

var makeCounter = function() {
    var privateCounter = 0;
    function changeBy(val) {
        privateCounter += val;
    }
    return {
        increment: function() {
            changeBy(1);
        },
        decrement: function() {
            changeBy(-1);
        },
        value: function() {
            return privateCounter;
        }
    }
};
var counter1 = makeCounter();
var counter2 = makeCounter();
console.log(counter1.value()); /* Alerts 0 */
counter1.increment();
counter1.increment();
console.log(counter1.value()); /* Alerts 2 */
counter1.decrement();
console.log(counter1.value()); /* Alerts 1 */
console.log(counter2.value()); /* Alerts 0 */
0
2
1
0
undefined

La variable privateCounter et changeBy ici sont privées et complètement invisibles en dehors de la fonction makeCounter. De cette façon, l'objet que nous générons via makeCounter cache toutes ses données privées et méthodes privées.

Ça vous rappelle quelque chose ?

Haha, n'est-ce pas juste OO ? Encapsulez les données et les méthodes d'exploitation des données, puis effectuez le traitement des données via des appels d'interface publique.

Bien sûr, vous pouvez dire que je peux également implémenter OO en utilisant l'héritage prototypique. Oui, c’est ce que font la plupart des gens maintenant, y compris nous-mêmes. Cependant, l’héritage est toujours très difficile à comprendre, car pour comprendre un morceau de code, il faut comprendre toutes ses chaînes d’héritage. S'il y a un bug dans le code, il sera très difficile à déboguer.

C'est trop loin. Voyons ensuite comment utiliser correctement les fermetures.

Comment utiliser correctement les fermetures ?

Les fermetures occuperont de la mémoire et affecteront également l'efficacité d'exécution du moteur js. Par conséquent, si un morceau de code est exécuté fréquemment, vous devez soigneusement envisager d'utiliser des fermetures dans ce code.

Regardons une fonction qui crée un objet :

function MyObject(name, message)
 {    this.name = name.toString();  
   this.message = message.toString();   
    this.getName = function()
     {        return this.name;    };   
      this.getMessage = function() 
      {        return this.message;    };}
      var myobj = new MyObject();
var myobj = new MyObject();

Chaque fois qu'elle est appelée pour générer un nouvel objet, deux fermetures seront générées. S'il existe des milliers de ces objets MyObject dans votre programme, cela prendra beaucoup plus de mémoire.

L'approche correcte devrait être d'utiliser la chaîne de prototypes :

function MyObject(name, message) {
    this.name = name.toString();
    this.message = message.toString();
}
MyObject.prototype.getName = function() {
    return this.name;
};
MyObject.prototype.getMessage = function() {
    return this.message;
};
var myobj = new MyObject();

Maintenant, le prototype MyObject définit deux méthodes Lorsque nous créons un objet via new, ces deux méthodes ne feront qu'un. copie stockée sur le prototype.

Comment se déroule la fermeture ?

Une fermeture est aussi une fonction, mais elle stocke des informations supplémentaires sur l'environnement, donc théoriquement elle prend plus de mémoire qu'une fonction pure, et le moteur JS consomme plus lors de l'interprétation et de l'exécution de la fermeture. Cependant, la différence de performances entre eux se situe entre 3 % et 5 % (il s'agit des données obtenues de Google, qui peuvent ne pas être trop précises).

Cependant, les avantages de la fermeture sont définitivement grands. Utilisez davantage les fermetures et la programmation sans état pour éloigner les bugs de nous.

En comprenant les fermetures, vous pouvez comprendre la plupart des bibliothèques de classes Js du paradigme FP et les idées de conception cachées derrière elles. Bien sûr, la clôture ne suffit pas. Vous devez également subir un lavage de cerveau avec des concepts tels que la PF, l’apatridie et le calcul lambda.

J'espère que vous comprendrez les fermetures js après avoir terminé cet article.

Recommandations associées :

Une explication simple des fermetures en JS

Comment comprendre les fermetures et les classes en JS

Une compréhension simple des fermetures js

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!