Dans JavaScript, une fonction est une classe d'objets, ce qui signifie qu'il peut être transmis en tant que paramètre à d'autres fonctions; De plus, la fonction peut également fournir une portée.
La partie de base de la fonction JS: JavaScript Apprening Notes (iv) Fonction Fonction partie
Syntaxe pour créer une fonction
Expressions de fonction nommées
La copie de code est la suivante:
// Nom de la fonction Expression
var add = fonction add (a, b) {
retourner a + b;
};
Expressions de fonction
La copie de code est la suivante:
// également connu sous le nom de fonction anonyme
var add = fonction (a, b) {
retourner a + b;
};
Déclaration des fonctions
La copie de code est la suivante:
fonction foo () {
// code ici
} // Aucun point-virgule n'est nécessaire ici
Dans les demi-colons de fin, les expressions de fonction doivent toujours utiliser des demi-colons et la fin des demi-colons n'est pas requise dans la déclaration de la fonction.
Déclarations de fonctions et expressions
Promotion de fonction (histing)
Le comportement d'une déclaration de fonction n'est pas équivalent à une expression de fonction nommée. La différence est le comportement de levage. Voir l'exemple suivant:
La copie de code est la suivante:
<script type = "text / javascript">
// fonction globale
fonction foo () {alert ("Global Foo!");}
Function Bar () {alert ('global bar');}
fonction hoist () {
console.log (typeof foo); // fonction
console.log (typeof bar); // non défini
foo (); // local foo!
bar (); // typeError: «Undefined» n'est pas une fonction
// variable foo et implémentateur sont promus
fonction foo () {
alert ('local foo! ');
}
// seule la barre variable est promue, la partie de mise en œuvre de la fonction n'est pas promue
var bar = function () {
alert ('local bar!');
};
}
hisser();
</cript>
Pour toutes les variables, partout où elles sont déclarées dans le corps, elles sont promues en interne au sommet de la fonction. La raison de l'application générale des fonctions est que les fonctions ne sont que des objets affectés aux variables.
Comme son nom l'indique, l'amélioration signifie mentionner les choses suivantes au sommet. Dans JS, il s'agit de mettre à niveau les choses définies dans les (variables ou fonctions) suivantes vers la définition précédente. Comme on peut le voir à partir de l'exemple ci-dessus, FOO et BAR dans le palan de fonction à l'intérieur de la fonction se déplacent vers le haut, couvrant ainsi les fonctions Global Foo et Bar. La différence entre les fonctions locales BAR et FOO est que FOO est promu en haut et peut fonctionner normalement, tandis que la définition de BAR () n'a pas été améliorée, seule sa déclaration est promue. Par conséquent, lorsque BAR () est exécuté, le résultat n'est pas défini au lieu d'être utilisé en fonction.
Mode de fonction en temps réel
Les fonctions sont également des objets, ils peuvent donc être utilisés comme valeurs de retour. L'avantage de l'utilisation de fonctions auto-exécutantes est de déclarer directement une fonction anonyme et de l'utiliser immédiatement, afin d'éviter de définir une fonction qui n'est pas utilisée une fois, et elle est évitée par le problème des conflits de dénomination. Il n'y a pas de concept d'espace de noms dans JS, il est donc facile d'avoir des conflits de nom de fonction. Une fois qu'un conflit de dénomination est fait, le dernier a été déclaré prévaudra.
Mode 1:
La copie de code est la suivante:
<cript>
(fonction () {
var a = 1;
return function () {
alerte (2);
};
} () ()); // pop 2, les premières parenthèses s'exécutent et les seconds parenthèses exécutent une fonction anonyme interne
</cript>
Modèle 2: pointage des variables de fonction auto-exécutantes
La copie de code est la suivante:
<script type = "text / javascript">
var result = (function () {
retour 2;
}) (); // La fonction a été exécutée ici
alert (résultat); // le résultat pointe vers la valeur de retour 2 de la fonction auto-exécutée; Si le résultat () apparaît, une erreur se produira.
</cript>
Modèle trois: fonctions imbriquées
La copie de code est la suivante:
<script type = "text / javascript">
var result = (function () {
return function () {
retour 2;
};
}) ();
alert (result ()); // 2 apparaît lorsque l'alerte (résultat); function () {return 2}
</cript>
MODE 4: La fonction d'auto-exécution attribue sa valeur de retour à une variable
La copie de code est la suivante:
var abc = (function () {
var a = 1;
return function () {
return ++ a;
}
}) (); // La fonction auto-exécutante renvoie la fonction après le retour à la variable
alert (abc ()); // s'il est alerte (ABC), le code après l'instruction de retour apparaîtra; S'il est ABC (), la fonction après le retour sera exécutée
Modèle 5: La fonction s'exécute en interne, récursivement
La copie de code est la suivante:
// Ceci est une fonction auto-exécutante, la fonction s'exécute en interne, récursivement
fonction ABC () {ABC (); }
Mode de rappel
Fonction de rappel: lorsque vous passez une fonction écriture () comme argument à une autre fonction appelle (), alors appelez () peut exécuter (ou appeler) écrire () à un moment donné. Dans ce cas, Write () est appelé une fonction de rappel.
Écouteur d'événements asynchrones
Le mode de rappel a de nombreuses utilisations, par exemple, lorsqu'un écouteur d'événements est attaché à un élément de la page, il fournit en fait un pointeur vers une fonction de rappel qui sera appelée lorsque l'événement se produit. comme:
La copie de code est la suivante:
document.addeventListener ("cliquez", console.log, false);
L'exemple de code ci-dessus montre la fonction de rappel Console.log () en mode bulle lorsque le document clique.
JavaScript convient particulièrement à la programmation axée sur les événements, car le mode de rappel prend en charge les programmes pour s'exécuter de manière asynchrone.
temps mort
Un autre exemple d'utilisation du mode de rappel est lors de l'utilisation de la méthode de délai d'expiration fournie par l'objet de fenêtre du navigateur: setTimeout () et setInterval (), tels que:
La copie de code est la suivante:
<script type = "text / javascript">
var call = function () {
Console.log ("100 ms sera demandé ...");
};
setTimeout (appel, 100);
</cript>
Mode de rappel dans la bibliothèque
Lors de la conception d'une bibliothèque JS, la fonction de rappel sera utile. Le code d'une bibliothèque doit utiliser le code réutilisable autant que possible, et le rappel peut aider à réaliser cette généralisation. Lorsque nous concevons une énorme bibliothèque JS, le fait est que les utilisateurs n'en ont pas besoin, nous pouvons nous concentrer sur les fonctions de base et fournir des fonctions de rappel dans "Hook Form", ce qui vous facilitera la création, l'échelle et la personnalisation des méthodes de bibliothèque
Curry
Le curry est une technique qui convertit une fonction en une nouvelle fonction simplifiée (à moins de paramètres) en remplissant plusieurs paramètres en un corps de fonction. - 【【compétent en javascript】
Autrement dit, la curryisation est un processus de conversion, c'est-à-dire le processus de notre conversion de fonction. Comme indiqué dans l'exemple suivant:
La copie de code est la suivante:
<script type = "text / javascript">
// Fonction Add () basée sur Curry
fonction add (x, y) {
var oldx = x, oldy = y;
if (typeof oldy == "Undefined") {
return function (newy) {
Retour Oldx + Newy;
};
}
// Application complète
retour x + y;
}
//test
Typeof Add (5); // Fonction de sortie "
ajouter (3) (4); // 7
// Créer et stocker une nouvelle fonction
var add2000 = add (2000);
Add2000 (10); // Sortie 2010
</cript>
Lorsque Add () est appelé pour la première fois, il crée une fermeture pour la fonction interne retournée. Cette fermeture stocke les valeurs X et Y d'origine dans les variables privées OldX et Oldy.
Maintenant, nous serons en mesure d'utiliser une méthode générale de curry en utilisant n'importe quelle fonction, telle que:
La copie de code est la suivante:
<script type = "text / javascript">
// Fonctions normales
fonction add (x, y) {
retour x + y;
}
// Curry une fonction pour obtenir une nouvelle fonction
var newadd = test (add, 5);
Newadd (4); // 9
// une autre option, appelez directement la nouvelle fonction
Tester (Ajouter, 6) (7); // Sortie 13
</cript>
Quand utiliser le curry
Lorsqu'il est constaté que la même fonction est appelée et que la plupart des paramètres passés sont les mêmes, alors la fonction peut être un bon candidat pour la curryisation