Cet article analyse les méthodes de création et d'appel des fonctions anonymes dans JS. Partagez-le pour votre référence. La méthode de mise en œuvre spécifique est la suivante:
Les fonctions anonymes sont des fonctions sans noms, également appelées fermetures, qui permettent la création temporaire d'une fonction sans nom spécifié. Le plus souvent utilisé comme valeur pour les paramètres de rappel, de nombreux novices ne connaissent pas les fonctions anonymes. Analyons-le ici.
Nom de la fonction de fonction (Liste des paramètres) {Function Body;}
Si vous créez des fonctions anonymes, cela devrait être:
function () {Function Body;}
Parce que c'est une fonction anonyme, il n'y a généralement aucun paramètre qui lui est passé.
Pourquoi créer des fonctions anonymes? Dans quelles circonstances les fonctions anonymes seront-elles utilisées? Il existe deux scénarios communs pour les fonctions anonymes, l'une est la fonction de rappel et l'autre est d'exécuter directement la fonction.
Les fonctions de rappel, telles que les opérations asynchrones de l'Ajax, nécessitent des fonctions de rappel. Je ne l'expliquerai pas en détail ici. En ce qui concerne l'exécution directe des fonctions, je le comprendrai après avoir examiné un exemple:
Copiez le code comme suit: <Script Language = "JavaScript">
var a = "a";
(fonction(){
var a = "b";
alerte (a);
}) ();
alerte (a);
</cript>
Dans le code ci-dessus, deux boîtes d'alerte seront sorties en séquence. Le contenu de la première boîte d'alerte est B et le second est a. Avez-vous vu des avantages? À droite, l'utilisation de l'exécution de la fonction peut limiter la portée des variables afin que les mêmes variables dans différents scripts puissent coexister.
Ci-dessous, comprenons d'abord les concepts liés aux fonctions anonymes.
Instructions de fonction. Pour utiliser une fonction, nous devons d'abord déclarer son existence. La manière la plus courante que nous utilisons est de définir une fonction à l'aide d'instructions de fonction, telles que:
Copiez le code comme suit: Fonction ABC () {
// Code à traiter
}
fonction ABC () {// code pour traiter}
Bien sûr, votre fonction peut également être avec des paramètres ou même avec des valeurs de retour.
La copie de code est la suivante: Afficher Plaincopy vers ClipboardPrint?
fonction abc (x, y) {
retour x + y;
}
fonction abc (x, y) {return x + y; }
Cependant, peu importe comment vous définissez votre fonction, l'interprète JS le traduise en un objet de fonction. Par exemple, vous définissez le numéro de fonction de l'un des exemples ci-dessus et entrez le code suivant:
Copiez le code comme suit: alerte (typeof ABC); // "fonction"
Votre navigateur apparaîtra d'une boîte invite, vous invitant à ce qu'ABC est un objet de fonction. Alors, quel est exactement l'objet fonction?
Objet de fonction
L'objet de fonction est un objet inhérent 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. Par exemple:
La copie de code est la suivante: var abc = nouvelle fonction ("x", "y", "return x * y;");
alerte (ABC (2,3)); // "6"
Je crois que tout le monde devrait comprendre comment déclarer une fonction maintenant. Alors, qu'est-ce qu'une fonction anonyme?
Déclarer les fonctions anonymes
Comme son nom l'indique, les fonctions anonymes sont des fonctions sans noms réels. Par exemple, nous supprimons le nom de la fonction dans l'exemple ci-dessus, puis déterminons s'il s'agit d'une fonction:
Copiez le code comme suit: alert (typeof function () {}); // "fonction"
alert (typeof function (x, y) {return x + y;}); // "fonction"
alerte (typeof new function ("x", "y", "return x * y;")) // "fonction"
alert (typeof function () {}); // "fonction"
alert (typeof function (x, y) {return x + y;}); // "fonction"
alerte (typeof new function ("x", "y", "return x * y;")) // "fonction"
Nous pouvons facilement voir que ce sont tous des objets de fonction, en d'autres termes, ce sont toutes des fonctions, mais elles ont toutes une caractéristique - sans noms. Nous les appelons donc des "fonctions anonymes". Cependant, précisément parce qu'ils n'ont pas de "nom", nous n'avons aucun moyen de les trouver. Cela étend la question de savoir comment appeler une fonction anonyme.
Appeler une fonction anonyme
Pour appeler une fonction, nous devons avoir une méthode pour la localiser et la faire référence. Nous devrons donc trouver un nom pour cela. Par exemple:
Copiez le code comme suit: var abc = fonction (x, y) {
retour x + y;
}
alerte (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.
Il existe en fait une autre façon d'appeler des fonctions anonymes, qui est le fragment jQuery que nous voyons - utiliser () pour enfermer les fonctions anonymes, puis ajouter une paire de supports (y compris les listes de paramètres). Jetons un coup d'œil aux exemples suivants:
Copiez le code comme suit: alert ((fonction (x, y) {return x + y;}) (2,3)); // "5"
alert ((nouvelle fonction ("x", "y", "return x * y;")) (2,3)); // "6"
Beaucoup de gens peuvent se demander pourquoi cette méthode peut être appelée avec succès? Si vous pensez que cette application est étrange, veuillez consulter mon explication ci-dessous.
Connaissez-vous 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é.
Je ne sais pas si vous pouvez comprendre le texte ci-dessus. Si vous ne pouvez toujours pas le comprendre, jetez un œil au code suivant et essayez-le.
Copiez le code comme suit: var abc = fonction (x, y) {return x + y;}; // attribuez un objet de fonction anonyme à ABC
// Le constructeur d'ABC est le même que le constructeur des fonctions anonymes. C'est-à-dire que la mise en œuvre des deux fonctions est la même.
alert ((ABC) .Constructor == (fonction (x, y) {return x + y;}). Constructeur);
PS: Le constructeur fait référence à une fonction qui crée un objet. C'est-à-dire le corps de fonction représenté par l'objet de fonction.
En bref, comprenez-le (fonction anonyme contenue dans les supports) en tant qu'objet de fonction renvoyé par l'expression du support, puis vous pouvez faire un appel de liste de paramètres normal à cet objet de fonction. (J'ai fait une erreur ici auparavant. Seules les expressions de fonction ne peuvent pas être appelées directement. Supprimer les supports de fonction anonymes et doivent être attribués avec l'expression. C'est-à-dire, (function () {alert (1)}) () devrait être équivalent à a = function () {alert (1)} (), et ne peut même pas supprimer a =.)
Fermeture
Qu'est-ce qu'une fermeture? Les fermetures se réfèrent aux blocs de code dans un certain langage de programmation qui permettent l'existence d'une fonction de premier niveau et les variables libres définies dans la fonction de premier niveau ne peuvent pas être libérées. Jusqu'à la libération de la fonction de premier niveau, ces variables libres inédites peuvent être appliquées en dehors de la fonction de premier niveau.
comment ? Il transpirait ... c'était bien, moi aussi (même si je le comprends, c'était juste une question de capacité d'expression). Expliquons-le de manière plus simple: la fermeture est en fait une fonctionnalité linguistique. Il fait référence au langage de programmation qui permet à des fonctions d'être considérées comme des objets, puis des variables d'instance (locales) peuvent être définies dans des fonctions telles que des opérations dans des objets. Ces variables peuvent être enregistrées dans les fonctions jusqu'à ce que l'objet d'instance de la fonction soit détruit. D'autres blocs de code peuvent obtenir les valeurs de ces variables d'instance (locales) d'une manière ou d'une autre et les appliquer à l'application.
Je ne sais pas si ce sera plus clair après avoir expliqué de cette façon. Si vous ne comprenez toujours pas, alors simplifions: les fermetures se réfèrent réellement aux variables locales définies dans les fonctions en cours d'exécution dans le langage de programmation.
Regardons maintenant un exemple:
Copiez le code comme suit: var abc = fonction (y) {
var x = y; // c'est une variable locale
return function () {
alert (x ++); // c'est là que x est appelé dans la variable locale de la fonction de première niveau dans la fonctionnalité de fermeture et fonctionne dessus
alerte (y -); // La variable de paramètre référencée est également une variable libre
}} (5); // initialisation
ABC (); // "5" "5"
ABC (); // "6" "4"
ABC (); // "7" "3"
alerte (x); // une erreur! "X" n'est pas défini!
Après avoir vu cela, pouvez-vous dire si l'extrait de code de jQuery est la fermeture?
À mon avis, parlons-en. Que la fonction de fermeture soit appliquée, il est nécessaire de déterminer si l'élément le plus important de ce code est: les variables locales non réglées. Il est alors évident qu'il est impossible d'appliquer la fonction de fermeture sans aucune implémentation. Mais que se passe-t-il s'il y a une implémentation dans une fonction anonyme? Il doit également déterminer s'il existe des variables locales non destroyed dans sa mise en œuvre. Donc, si vous demandez quelles fonctionnalités en JS sont utilisées au début de l'extrait de code jQuery? Ensuite, ce n'est qu'un appel aux fonctions anonymes et aux fonctions anonymes. Cependant, cela implique les caractéristiques des fermetures et peut être mis en œuvre à tout moment.
L'utilisation la plus courante:
Copiez le code comme suit: (fonction () {
alerte («eau»);
}) ();
Bien sûr, les paramètres peuvent également être inclus:
Copiez le code comme suit: (fonction (o) {
alerte (o);
})('eau');
Vous voulez utiliser des appels enchaînés avec des fonctions anonymes? Très simple:
Copiez le code comme suit: (fonction (o) {
alerte (o);
Return Arguments.Callee;
}) ('eau') ('down');
Vous connaissez toutes les fonctions anonymes courantes, jetons un coup d'œil à celles peu fréquentes:
Copiez le code comme suit: ~ (function () {
alerte («eau»);
}) (); // L'écriture est un peu cool ~
void function () {
alerte («eau»);
} (); // Il est dit que le plus efficace ~
+ function () {
alerte («eau»);
} ();
-fonction(){
alerte («eau»);
} ();
~ function () {
alerte («eau»);
} ();
!fonction(){
alerte («eau»);
} ();
(fonction(){
alerte («eau»);
} ()); // un peu d'exécution forcée ~
J'espère que cet article sera utile à la programmation JavaScript de tous.