JS 匿名函数——几种不同的调用方式[通俗易懂]

全栈程序员站长

发布于 2022-11-09 17:32:28

4K0

发布于 2022-11-09 17:32:28

文章被收录于专栏：全栈程序员必看全栈程序员必看

匿名函数声明和使用

匿名函数有两种用法：

赋值
自我执行

1.声明一个匿名函数，直接赋值给某一个事件

windon.onload = function(){ 
   
	alert('hello');
};

2.使用匿名函数表达式。将匿名函数，赋值给一个变量。

声明：var func=function(){ } 调用：func();

var show = function(){ 
   
	alert('hello');
};
show();

注意：使用匿名函数表达式时，函数的调用语句，必须放在函数声明语句之后！！！原因：检查装载时，会先对show变量及这个匿名函数声明，此时，还未将匿名函数赋值给show变量，如果在表达式之前调用，会报错 show is not a function

js代码的执行顺序问题 js代码在运行时，会分为两大部分———检查装载和执行阶段。

检查装载阶段：会先检测代码的语法错误，进行变量、函数的声明
执行阶段：变量的赋值、函数的调用等，都属于执行阶段。

3.自执行函数。这里我总结了8种常用的匿名函数调用方法：

//1.使用 ！开头，结构清晰，不容易混乱，推荐使用；
!function(){ 

document.write('ni hao');
}()
//2.无法表明函数与之后的()的整体性，不推荐使用。
(function(){ 

document.write('wo hao');
})();
//3.能够将匿名函数与调用的()为一个整体，官方推荐使用；
(function(){ 

document.write('hello');
}());
//4.放在中括号内执行
[function(){ 

document.write('world');
}()];
//5.使用 + 运算符
+function(){ 

document.write('ni hao');
}()
//6.使用 - 运算符
-function(){ 

document.write('ni hao');
}()
//7.使用波浪符 ~
~function(){ 

document.write('ni hao');
}()
//8.使用 void
void function(){ 

document.write('ni hao');
}()