Pourquoi utiliser la fonction d'auto-exécution?

Dans plusieurs endroits, je vois des scripts comme ceci:

(function () { var hello = 'Hello World'; alert(hello); })(); 

Pourquoi ne pas l'écrire comme ça, sans aucune fonction:

 var hello = 'Hello World'; alert(hello); 

Nous utilisons la fonction d'auto-exécution, pour gérer la portée variable .

La portée d'une variable est la région de votre programme dans laquelle elle est définie. Une variable globale a une portée globale; Il est défini partout dans votre code JavaScript. ( Même dans vos fonctions ). D'autre part, les variables déclarées dans une fonction ne sont définies que dans le corps de la fonction. Ce sont des variables locales et ont une portée locale. Les paramètres de fonction comptent également comme variables locales et ne sont définis que dans le corps de la fonction.

 var scope = "global"; function checkscope() { alert(scope); } checkscope(); // global 

Comme vous le voyez, vous pouvez accéder à la variable de scope dans votre fonction, mais, dans le corps d'une fonction, une variable locale a priorité sur une variable globale avec le même nom. Si vous déclarez une variable locale ou un paramètre de fonction avec le même nom qu'une variable globale, vous cachez efficacement la variable globale.

 var scope = "global"; function checkscope() { var scope = "local"; alert(scope); } checkscope(); // local alert(scope); // global 

Comme vous le voyez, la variable à l'intérieur de la fonction, ne remplacera pas les variables globales. En raison de cette fonctionnalité, nous mettons le code dans la fonction d'auto-exécution, afin d'éviter d'écraser les autres variables, lorsque notre code devient grand et grand .

 // thousand line of codes // written a year ago // now you want to add some peice of code // and you don't know what you have done in the past // just put the new code in the self executing function // and don't worry about your variable names (function () { var i = 'I'; var can = 'CAN'; var define = 'DEFINE'; var variables = 'VARIABLES'; var without = 'WITHOUT'; var worries = 'WORRIES'; var statement = [i, can, define, variables, without, worries]; alert(statement.join(' ')); // I CAN DEFINE VARIABLES WITHOUT WORRIES }()); 
  • Vous pouvez en savoir plus sur JavaScript sur ce livre: JavaScript: The Definitive Guide, 6ème édition .

L' IIFE (expression de la fonction immédiatement appelée) évite de créer une variable globale hello .

Il y a d'autres utilisations, mais pour l'exemple de code que vous avez posté, ce serait la raison.

En plus de garder l'espace de noms global propre, ils sont également utiles pour établir des méthodes privées pour les fonctions accessibles tout en exposant certaines propriétés à une utilisation ultérieure –

 var counter = (function(){ var i = 0; return { get: function(){ return i; }, set: function( val ){ i = val; }, increment: function() { return ++i; } }; }()); // 'counter' is an object with properties, which in this case happen to be // methods. counter.get(); // 0 counter.set( 3 ); counter.increment(); // 4 counter.increment(); // 5 

Il y a peut-être quelques raisons.

Le premier protège la portée, car la fonction crée une nouvelle portée.

Une autre peut être des variables contraignantes, par exemple

 for (var i = 0; i < n; i++) { element.click = (function(i){ return function(){ // do something with i } })(i); }