javascript IIFE 的原理

你需要明白 IIFE 的原理，我简单说一下：

function foo() {...}     // 这是定义，Declaration；定义只是让解释器知道其存在，但是不会运行。

foo();                   // 这是语句，Statement；解释器遇到语句是会运行它的。

IIFE 并非必须，传统一点可以这么写：

function foo() {...}
foo();

那么为什么要 IIFE？

1. 传统的方法啰嗦，定义和执行分开写；
2. 传统的方法直接污染全局命名空间（浏览器里的 global 对象，如 window）

于是，开发者们想找一个可以解决以上问题的写法。那么像下面这么写行不行呢？

function foo(...){}();

当然是不能，但是为什么呢？因为 function foo(...){} 这个部分只是一个声明，对于解释器来说，就好像你写了一个字符串 "function foo(...){}"，它需要使用解析函数，比如 eval() 来执行它才可以。所以把 () 直接放在声明后面是不会执行，这是错误的语法。

如何把它变得正确？说起来也简单，只要把 声明 变成 表达式（Expression） 就可以了。

实际上转变表达式的办法还是很多的，最常见的办法是把函数声明用一对 () 包裹起来，于是就变成了：

(function foo() {...})    // 这里是故意换行，实际上可以和下面的括号连起来
();

这就等价于：

var foo = function () {...};    // 这就不是定义，而是表达式了。
foo();

但是之前我们说不行的那个写法，其实也可以直接用括号包起来，这也是一种等价的表达式：

(function foo(){...}());

所以你问有没有区别？很简单：木有～

另外，刚才说过转变表达式的方式很多，的确还有很多别的写法，比如：

!function foo() {...}();

或者

+function foo() {...}();

这些都可以。