IIFE总结

来源:互联网 发布:mac常用快捷键 编辑:程序博客网 时间:2024/06/07 05:33

IIFE是JavaScript中从常见的一种模式,叫做立即执行的函数表达式。究竟IIFE是怎样的?下面给出一个最简单的IIFE:

(function(){//open IIFE

}());//close IIFE

(1)他是立即执行的。

函数结束的大括号后面还有一对括号,这对括号就是用来立即调用函数的,函数体会在此刻立即执行。

(2)他必须是一个表达式。

解析器会把一个以function关键字开头的语句当做一个函数定义,但是一个函数声明并不会立即执行,因此在我们在语句前加了一个左括号,告诉解析器function关键词正处于一个表达式的范围之内,因为在括号中,只存在表达式。

(3)后面有分号

如果两个IIFE之间缺失了分号,代码不会正常运行。前一个IIFE作为函数调用,后一个IIFE作为变量。

IIFE的几个应用

(1)保持数据私有性,避免创建全局变量。我们要尽可能地避免创建全局变量,因为依赖全局作用域的代码片段会产生一些边缘效应,程序可能不够健壮,重用性低;其次是可能产生名字冲突。

function f(){
    if(condition){  
        var tmp=fenerateData;
    }
//tmp still exit here
}

没有使用IIFE的时候,tmp变量是可以在if语句外访问到的。

function f(){
(function(){
    var tmp=generatData();//local scope
    processData(tmp);
});
//tmp cannot be here
}

通过使用IIFE,我们使得tmp成为一个私有的数据,外界无法访问到。

这里吧保持数据私有性和避免全局变量放到一起,是因为避免使用全局变量的时候也是类似的。

<script>

var tmp=genearateData;
processData(tmp);

</script>

tmp此时是一个全局变量。我们使用IIFE将它隐藏在一个小的作用域中。

function f(){
    (function(){
        var tmp=genearateData;
        processData(tmp);
    })();
}

(2)把私有全局数据存储于一个单例对象

var obj=function(){
var self={
    pubilcMethod:function(){
        privateData=1;
        privateFunc();
    },
    publicData:1
};
function privateFunc(){


}
return self;
}();

(3)把全局数据放入一个方法中。

var obj={
    method:function(){
        var invocCount=0;
        return function(){
            invocCount++;
            console.log(invocCount);
        };
    }()
};


0 0