Une fonction est un bloc de code réutilisable qui est piloté par un événement ou exécuté lorsqu'il est appelé. Ensuite, suivez l'éditeur pour apprendre la fonction en JavaScript. Amis, venez nous rejoindre. apprendre
Tout d'abord, je vais vous présenter plusieurs façons de définir des fonctions en JavaScript :
1. Le plus basique Utilisé comme déclaration de fonction distincte.
Le code est le suivant :
function func(){Copier après la connexion
ou
var func=function(){}Copier après la connexion
2. Utiliser comme constructeur de classe :
function class(){}
class.prototype={};
var item=new class();Copier après la connexion
3. Utiliser comme fermeture :
(function(){
//独立作用域
})();Copier après la connexion
4. :
var addEvent=new function(){
if(!-[1,])
return function(elem,type,func){
attachEvent(elem,'on'+type,func);
};
else
return function(elem,type,func){
addEventListener(elem,type,func,false);
}
};//避免了重复判断Copier après la connexion
5. Application mixte des quatre situations ci-dessus :
var class=new function(){
var privateArg;//静态私有变量
function privateMethod=function(){};//静态私有方法
return function(){/*真正的构造器*Copier après la connexion
Types de fonctions de fonction JavaScript : présentez principalement les fonctions ordinaires, les fonctions anonymes et les fonctions de fermeture
Introduction aux fonctions ordinaires
1.1 Exemple
function ShowName(name) {
alert(name);
}Copier après la connexion
1.2 Couverture des fonctions du même nom en Js
En Js, les fonctions ne sont pas surchargées Définissez des fonctions avec le même nom de fonction et différentes. les signatures de paramètres et les fonctions suivantes écraseront la fonction précédente. Lorsqu'elles sont appelées, seules les fonctions suivantes seront appelées.
var n1 = 1;
function add(value1) {
return n1 + 1;
}
alert(add(n1));//调用的是下面的函数，输出：3
function add(value1, value2) {
return value1 + 2;
}
alert(add(n1));//输出：3Copier après la connexion
1.3 objets arguments
arguments est similaire aux params de C#, exploitant les paramètres des variables : le nombre de paramètres passés dans la fonction est supérieur au paramètres lorsqu'il a été défini quantité.
function showNames(name) {
alert(name);//张三
for (var i = 0; i < arguments.length; i++) {
alert(arguments[i]);//张三、李四、王五
}
}
showNames('张三','李四','王五');Copier après la connexion
1.4 Valeur de plage par défaut de la fonction
Si la fonction ne spécifie pas de valeur de retour, la valeur de retour par défaut est « non définie »
function showMsg() {
}
alert(showMsg());//输出：undefinedCopier après la connexion
2. Fonction anonyme
2.1 Fonction anonyme variable
2.1.1 Description
peut être Les fonctions sont affectées aux variables et aux événements.
2.1.2 Exemple
//变量匿名函数，左侧可以为变量、事件等
var anonymousNormal = function (p1, p2) {
alert(p1+p2);
}
anonymousNormal(3,6);//输出9Copier après la connexion
2.1.3 Scénarios applicables
①Évitez la pollution du nom de la fonction. Si vous déclarez d'abord une fonction avec un nom puis l'attribuez à une variable ou à un événement, vous abuserez du nom de la fonction.
2.2 Fonction anonyme sans nom
2.2.1 Description
c'est lorsque la fonction est déclarée, suivie des paramètres. Lorsque la syntaxe JS analyse cette fonction, le code qu'il contient est exécuté immédiatement.
2.2.2 Exemple
(function (p1) {
alert(p1);
})(1);Copier après la connexion
2.2.3 Scénario applicable
①Il ne doit être exécuté qu'une seule fois. Si le navigateur est chargé, la fonction ne doit être exécutée qu'une seule fois et ne sera pas exécutée ultérieurement.
3. Fonction de fermeture
3.1 Description
Supposons que la fonction A déclare une fonction B à l'intérieur et que la fonction B fasse référence à l'extérieur de la fonction B. variable, et la valeur de retour de la fonction A est une référence à la fonction B. Alors la fonction B est une fonction de fermeture.
3.2 Exemple
3.2.1 Exemple 1 : Référence globale et référence locale
function funA() {
var i = 0;
function funB() { //闭包函数funB
i++;
alert(i)
}
return funB;
}
var allShowA = funA(); //全局变量引用：累加输出1,2,3,4等
function partShowA() {
var showa = funA();//局部变量引用：只输出1
showa();
}Copier après la connexion
allShowA est une variable globale et fait référence à la fonction funA . L'exécution répétée de allShowA() affichera les valeurs accumulées de 1, 2, 3, 4, etc.
Exécutez la fonction partShowA(), car seule la variable locale showa est déclarée en interne pour référencer funA. Après exécution, les ressources occupées par showa sont libérées en raison de la portée.
La clé de la fermeture est la portée : les ressources occupées par les variables globales ne seront libérées que lorsque la page changera ou que le navigateur sera fermé. Lorsque var allShowA = funA(), cela équivaut à allShowA faisant référence à funB(), de sorte que les ressources de funB() ne seront pas recyclées par GC, donc les ressources de funA() ne seront pas non plus recyclées.
3.2.2 Exemple 2 : Fonction de fermeture paramétrique
function funA(arg1,arg2) {
var i = 0;
function funB(step) {
i = i + step;
alert(i)
}
return funB;
}
var allShowA = funA(2, 3); //调用的是funA arg1=2，arg2=3
allShowA(1);//调用的是funB step=1,输出 1
allShowA(3);//调用的是funB setp=3,输出 4Copier après la connexion
3.2.3 Exemple 3 : Partage de variables au sein de la fonction parent funA
function funA() {
var i = 0;
function funB() {
i++;
alert(i)
}
allShowC = function () {// allShowC引用匿名函数,与funB共享变量i
i++;
alert(i)
}
return funB;
}
var allShowA = funA();
var allShowB = funA();//allShowB引用了funA，allShowC在内部重新进行了绑定，与allShowB共享变量iCopier après la connexion
3.3 Scénarios applicables
Assurer la sécurité des variables à l'intérieur de la fonction funA, car les variables de funA ne sont pas directement accessibles de l'extérieur.
Le contenu ci-dessus est l'introduction de cet article à la fonction function dans js. J'espère que vous l'aimerez. Pour plus de didacticiels connexes, veuillez visiter le Tutoriel vidéo JavaScript !
![[Web front-end] Démarrage rapide de Node.js](https://img.php.cn/upload/course/000/000/067/662b5d34ba7c0227.png)
