Compréhension approfondie (function () {...}) ();

1. Il est appelé fonction anonyme qui s'exécute immédiatement (également appelée fonction qui appelle immédiatement)

2. Lorsqu'une fonction anonyme est enfermée, puis un support est ajouté à l'arrière, la fonction anonyme peut être exécutée immédiatement! Y a-t-il quelque chose de magique?

3. Pour utiliser une fonction, nous devons d'abord déclarer son existence. La façon la plus courante que nous utilisons est de définir une fonction à l'aide de l'instruction de fonction

4. Objet de fonction

Les objets de fonction sont des objets inhérents dans JavaScript, et toutes les fonctions sont en fait un objet de fonction.

Voyons d'abord si l'objet fonction peut utiliser directement le constructeur pour créer une nouvelle fonction? La réponse est oui.

 var abc = nouvelle fonction ("x", "y", "return x * y;"); alerte (ABC (2,3)); // "6"

5. Les fonctions anonymes n'ont pas de noms, il est donc étendu à la question de savoir comment nous devons les appeler (O_O)?

Appel des fonctions anonymes①

 var abc = fonction (x, y) {return x + y; } alert (ABC (2,3)); // "5"

L'opération ci-dessus équivaut en fait à la définition d'une fonction d'une manière différente. Cette utilisation est quelque chose que nous rencontrons plus fréquemment.

Par exemple, lorsque nous configurons une fonction de gestionnaire d'événements DOM Element, nous ne les nommez généralement pas, mais donnons plutôt à son événement correspondant une référence à une fonction anonyme.

Appeler une fonction anonyme②

Use () pour enfermer la fonction anonyme, puis ajouter une paire de supports (y compris la liste des paramètres).

 alert ((nouvelle fonction ("x", "y", "return x * y;")) (2,3)); // "6"

6. Quel est le rôle des supports?

Les supports peuvent diviser nos expressions en morceaux, et chaque pièce, c'est-à-dire chaque paire d'accès, a une valeur de retour. Cette valeur de retour est en fait la valeur de retour de l'expression entre crochets.

Par conséquent, lorsque nous enfermons une fonction anonyme avec une paire de supports, les parenthèses renvoient un objet de fonction d'une fonction anonyme.

Par conséquent, l'ajout de fonctions anonymes à la paire de supports est comme une fonction nommée et nous obtenons sa position de référence. Donc, si vous ajoutez une liste de paramètres après cette variable de référence, le formulaire d'appel de la fonction ordinaire sera implémenté.

7. Déclaration de fonctions, expressions de fonction, fonctions anonymes

Déclaration de fonction: fonction fnname () {…}; Utilisez le mot clé de la fonction pour déclarer une fonction, puis spécifiez un nom de fonction, appelé déclaration de fonction.

Fonction Expression var fnname = function () {…}; Déclarez une fonction à l'aide du mot clé de la fonction, mais ne nomme pas la fonction. Enfin, la fonction anonyme se voit attribuer une variable, appelée expression de fonction, qui est la forme la plus courante de syntaxe d'expression de fonction.

Fonction anonyme: function () {}; Utilisez le mot clé de la fonction pour déclarer une fonction, mais la fonction n'est pas nommée, donc elle est appelée fonction anonyme. Les fonctions anonymes appartiennent aux expressions de fonction. Les fonctions anonymes ont de nombreuses fonctions. Si vous affectez une variable, vous créez une fonction, et si vous attribuez un événement, vous devenez un gestionnaire d'événements ou créez une fermeture, etc.

La différence entre la déclaration de fonction et l'expression de la fonction est que

1. Les expressions de fonction doivent attendre que le moteur Javascictp s'exécute sur sa ligne avant d'analyser l'expression de la fonction de la ligne de haut en bas.

2. L'expression de la fonction peut être appelée immédiatement avec des supports après. La déclaration de fonction ne peut pas être effectuée et ne peut être appelée que sous la forme de fnname ().

Châtaignier①

 fnname (); fonction fnname () {...} // normal, parce que «promouvant» la déclaration de fonction, l'appel de fonction peut être fnname (); var fnname = function () {...} // une erreur est rapportée, l'expression variable n'a pas enregistré de référence à la fonction, et l'appel de fonction doit être après l'expression de la fonction

Châtaignier②

 var fnname = function () {alert ('Hello world');} (); // des parcelles sont ajoutées après l'expression de la fonction. Lorsque le moteur JavaScript analyse ici, la fonction peut être appelée immédiatement lorsque le moteur JavaScript analyse ici fnname () {alert ('Hello World');} (); // il n'y aura pas d'erreur, mais le moteur JavaScript ne fait que la déclaration de fonction, ignore la parenthèses de la fonction. } (); // L'erreur de syntaxe, bien que les fonctions anonymes appartiennent aux expressions de fonction, aucune opération d'attribution n'est effectuée, // donc le moteur JavaScript traite le mot clé de la fonction au début comme déclaration de fonction, et rapporte une erreur: un nom de fonction est requis

Si vous souhaitez ajouter des supports après le corps de la fonction, vous pouvez l'appeler immédiatement, alors cette fonction doit être une expression de fonction, pas une déclaration de fonction.

Châtaignier③

 (fonction (a) {Console.log (a); // Firebug Sortie 123, utilisez l'opérateur ()}) (123); (fonction (a) {console.log (a); // Firebug Sortie 1234, utilisez l'opérateur ()} (1234)) ;! fonction (a) {console.log (a); // Firebug Sortie 12345, utilisez! Opérateur} (12345); + fonction (a) {console.log (a); // Firebug Sortie 123456, utilisez + opérateur} (123456); -Function (a) {console.log (a); // Firebug Sortie 1234567, use - Operator} (1234567); var fn = fonction (a) {console.log (a); // Firebug Sortie 12345678, use = opérateur} (12345678)

Vous pouvez voir le résultat de sortie et l'ajouter avant la fonction! , +, - et même les virgules peuvent être utilisées pour exécuter immédiatement après la définition de la fonction, et () ,! Des opérateurs tels que +, -, = convertir les déclarations de fonction en expressions de fonction, éliminant l'ambiguïté entre le moteur JavaScript identifiant les expressions de fonction et les déclarations de fonction, indiquant au moteur JavaScript qu'il s'agit d'une expression de fonction, pas une déclaration de fonction, vous pouvez ajouter des parenthèses après elle et exécuter le code de la fonction immédiatement.

L'ajout de supports est le moyen le plus sûr de le faire, car! Les opérateurs tels que, + et - effectueront également des opérations avec la valeur de retour de la fonction, ce qui cause parfois des problèmes inutiles.

Mais à quoi sert l'écriture de cette façon?

Il n'y a pas de concept de portée privée en JavaScript. Si vous déclarez certaines variables dans la portée globale ou locale sur un projet développé par plusieurs personnes, il peut être écrasé par d'autres avec le même nom. Selon les caractéristiques de la chaîne de portée des fonctions JavaScript, cette technique peut être utilisée pour imiter une portée privée et utiliser une fonction anonyme comme un "conteneur". Le "conteneur" peut accéder aux variables externes, tandis que l'environnement externe ne peut pas accéder aux variables à l'intérieur du "conteneur", de sorte que les variables définies à l'intérieur (function () {…}) () ne seront pas en conflit avec des variables externes, communément appelées "wrapper anonymes" ou "espace de noms".

JQuery utilise cette méthode. Lorsque le code jQuery est enveloppé dans (fonction (fenêtre, undefined) {… jQuery Code…} (Window), il peut protéger les variables internes de jQuery lors de l'appel du code jQuery dans la portée globale.