(笔记+个人理解)立即执行函数表达式IIFE

本文介绍了JavaScript中的IIFE(立即执行函数表达式),包括其作用、常见用法和进阶技巧。IIFE通过匿名函数表达式避免污染全局变量,常用于模块封装。文中详细阐述了IIFE的两种形式以及如何传递参数,同时探讨了其在代码组织中的应用。

摘要生成于 C知道 ,由 DeepSeek-R1 满血版支持, 前往体验 >

IIFE(Immediately Invoked Function Expression)代表立即执行函数表达式。
下面看一段代码

var a=2;
(function foo(){
    var a=3;
    console.log(a);  //3
})();
console.log(2); //2

由于函数被包含在一对()括号内部,成为了一个表达式,通过在末尾加上另外一个()可以立即执行这个函数。格式:(function foo(){…})().第一个()将函数变成一个表达式,第二个()执行这个函数。
这种模式就是IIFE立即执行函数表达式。
IIFE最常见的用法就是使用一个匿名函数表达式。如:

var a=4;
(function IIFE(){
    var a=5;
    console.log(a);//5
})();
console.log(a);//4

传统的IIFE是第一种形式(function foo(){…})(),很多人更喜欢第二种形式:(funtion(){…}())。第一种函数表达式被包含在()中,然后在后面用一个()来调用。第二种形式中用来调用的()被一斤了用来包装的()中。
IIFE的另一种普遍的进阶用法是把它们当做函数调用并传递参数进去。
如:

 var a=6;
(function IIFE(global){
     var a=7;
     console.log(a);//7
     console.log(global.a);//6
 })(window);
 console.log(a);//6

在这里我们将window对象的引用传递进去,将参数命名为global,因此在代码风格上对全局对象的引用变得比引用一个没有“全局”字样的变量更加清晰。

IIFE还有一种变化的用途是倒置代码的运行顺序,将需要运行的函数放在第二位,在IIFE执行后当做参数传递进去。

var a=8;
(function IIFE(def){
    def(window);
})(function def(global){
    var a=9;
    console.log(a); //9
    console.log(global.a);//8
})

函数表达式def定义在片段的第二部分,然后当做参数(这个参数也叫作def)被传递进IIFE函数定义的第一部分中。最后,参数def(也就是传递进去的函数)被调用,并将window传入当做global参数的值。

通过学习,IIFE 的作用可以简单概括为:第一,隐藏实现;第二,不污染外部(全局)变名空间;第三,用来编码js模块。

以上为个人对《你不知道的JavaScript》中对IIFE讲解的笔记以及个人理解。

知识来源:《你不知道的JavaScript》

评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值