IIFE
IIFE(Immediately Invoked Function Expression)即立即被调用的函数表达式,是一个在定义时就会立即执行的JS函数。它可以创建一块单独的作用域,防止污染全局作用域。
(function () {
xxxxx
})();
IIFE主要包含两部分。前面的()
包含的部分是一个函数表达式,后面的()
表示执行这个函数。
IIFE有什么用?
IIFE 可以创建一个独立的块级作用域,避免变量被外界访问,防止污染全局作用域。
var a = '张三';
(function IIFE(){
var a = '法外狂徒';
console.log( a ); // 法外狂徒
})();
console.log( a ); // 张三
ps: IIFE的名称不是固定的,它可以使任意的,甚至可以没有成为一个匿名函数。
IIFE的其他形式
当然,也有一些人会这么用:
var a = '张三';
(function IIFE(){
var a = '法外狂徒';
console.log( a ); // 法外狂徒
}());
console.log( a ); // 张三
就是将用于调用的 ()
被移动到用于包装的 ( )
内部,这么做也是允许的。
IIFE 还有另一种变种,就是将要被执行的函数,在调用和传参之后给出。这种模式更干净和易懂一些,虽然有点儿繁冗。
var a = 2;
(function IIFE( def ){
def( window );
})(function def( global ){
var a = 3;
console.log( a ); // 3
console.log( global.a ); // 2
});
def
函数表达式在后半部分被定义,然后作为一个参数(也叫 def
)被传递给在代码段前半部分定义的 IIFE
函数。最后,参数 def
(函数)被调用,并将 window
作为 global
参数传入。
IIFE接收参数
IIFE还可以接收参数:
var a = '张三';
(function IIFE(val){
console.log(val); // 张三
})(a);
我们传入 a
但将参数命名为 val
,这样我们对于全局和非全局引用就有了一个清晰的划分。
利用 IIFE 可以创建单独的作用域,以及可以接收参数。我们可以实现在for循环中,输出1、2、3 、4、5
;
for (var i=1; i<=5; i++) {
(function(i){
setTimeout( function timer(){
console.log( i );
}, i*1000 );
})( i );
}
//输出 1 2 3 4 5