本文主要介绍如何理解JavaScript中的立即执行函数,帮助大家更好的学习JavaScript。感兴趣的朋友可以了解一下。
目录
立即执行函数格式化其他立即执行函数的方式表达式立即执行函数可以带参数。应用总结有时候你会在JavaScript中看到一些很神奇的函数,比如下面的截图:
这种功能只要浏览器加载就会自动运行,但是需要调用。这种函数之前在关闭的时候也提到过,一般叫做:立即执行函数。
立即函数的特征:
会自动执行。
它只会被执行一次。
立即执行函数格式
立即执行函数通常具有以下格式:
#格式1 (//W3C推荐这种写法)
(函数(){
}())
#格式2(但这是最常用的方式之一)
(函数(){
})();
其实从上面也可以看出,函数的立即执行一般不写函数名,意义不大。毕竟immediate函数不一定要用函数名来调用,类似于函数的字面定义。
现在,让我们举一个把闭包和立即执行函数结合起来的例子:
var fun=(
函数(){
功能测试(a,b){
console . log(a b);
}
返回测试;
}
)()
立即执行函数其他方式表达式
上面的格式定义了立即执行的功能,但是还有其他的方式来实现这个功能,比如下面这个就不是上面的格式。
!函数(){
console . log(' test ');
}()
看它输出的两行,第一行是test,即有一个立即执行函数的结果,true是输出因为前面还有!这是隐式转换时说的,在!布尔类型将被强制换行。
现在又有一个问题,这个方法为什么能实现?
要分析这种情况的发生,先来一个表达式函数:
var test=function(){
Console.log('测试表达式')
}
#这个语句之后,怎么用?如下
test();
这时,有一个大胆的想法。赋值函数可以用变量值+()执行,为什么不能直接写?
var test=function(){
Console.log('测试表达式')
}()
这里我们可以看到表达式函数也有即时效果。
(补充:为什么会有未定义?因为这个函数本身没有返回值,所以在浏览器的控制台面板中会输出一个未定义的值。)
可以直接在函数后面放圆括号吗?
函数(){
Console.log('测试表达式')
}()
可见你需要用表达式前提,才能在后面放()否则报错。
我这时候有了一个大胆的想法,其实!后来其实是把函数转换成了表达式函数,所以后面可以直接运行+()了。这是一个大胆的想法。在这种情况下,尝试直接在函数前添加一个加号()。
函数(){
Console.log('测试表达式')
}()
既然加号可以那么:
-
!
~
当然,所谓的乘号和除号是实现不了的。还有一个神奇的关键词可以有这种神奇的效果,那就是new和void。
新函数(){
Console.log('测试表达式')
}()
还有一个,就是量子逻辑算符||也可以实现。
不过这个需要根据其特点来判断真假,不能单独使用。
1函数(){
Console.log('测试表达式')
}()
或者
0 || function(){
Console.log('测试表达式')
}()
还有一个神奇的符号(逗号)也可以实现这个功能:
1、函数(){
Console.log('测试表达式')
}()
可以看出,如果使用逗号,不管前面的是真还是假,下面的表达式函数都会被执行。
立即执行函数可以带参数
立即执行函数也可以有参数,如下所示
(函数(a,b){
console.log(a,b)
})(1,2)
应用
这个问题是经典的面试问题。首先,创建下一个html
!文档类型html
超文本标记语言
头
meta charset='utf-8 '
标题测试/标题
/头
身体
ul id="测试"
这是第一个/李
李这是第二篇文/李
李这是第三篇/李
/ul
脚本
var liList=document . getelementsbytagname(' Li ');
for(var I=0;iliList.length我)
{
莉莉丝特[我]。onclick=function(){
console.log(一);
}
};
/脚本
/body
/html
李的目的是点击哪个标签来输出几个,但是结果呢
因为当你点击李的时候,for循环就已经结束了,你可以用前面学过的let,关键字也可以求解。
var liList=document . getelementsbytagname(' Li ');
for(设I=0;iliList.length我)
{
liList[I]. o nclick=function(){
console.log(一);
}
};
这样可以解决这个问题,但是不需要马上运行函数。当然也可以通过立即执行函数来修改。
var liList=document . getelementsbytagname(' Li ');
for(设I=0;iliList.length我)
{(函数(a){
liList[a]. o nclick=function(){
console . log(a);
}
})(一)
};
可以看出,函数的立即执行会形成自己的封闭空间,不会受到其他外部变量的影响。其实如果再有退货的话,那就是标准的封闭包装了。
总结
本文到此为止。希望能帮到你,也希望你能多关注我们的更多内容!
郑重声明:本文由网友发布,不代表盛行IT的观点,版权归原作者所有,仅为传播更多信息之目的,如有侵权请联系,我们将第一时间修改或删除,多谢。