登录

IIFE(立即调用函数表达式)

1970-01-01 ·SSL证书

Javascript,IIFE

在 Javascript 中,圆括号()是一种运算符,跟在函数名之后,表示调用该函数。比如,print()就表示调用print函数。

有时,我们需要在定义函数之后,立即调用该函数。这时,你不能在函数的定义之后加上圆括号,这会产生语法错误。

function(){ /* code */ }(); 
// SyntaxError: Unexpected token ( 

产生这个错误的原因是,function这个关键字即可以当作语句,也可以当作表达式。

// 语句 function f() {} // 表达式 var f = function f() {} 

为了避免解析上的歧义,JavaScript 引擎规定,如果function关键字出现在行首,一律解释成语句。因此,JavaScript 引擎看到行首是function关键字之后,认为这一段都是函数的定义,不应该以圆括号结尾,所以就报错了。

解决方法就是不要让function出现在行首,让引擎将其理解成一个表达式。最简单的处理,就是将其放在一个圆括号里面。

(function(){ /* code */ }()); // 或者 (function(){ /* code */ })(); 

上面两种写法都是以圆括号开头,引擎就会认为后面跟的是一个表示式,而不是函数定义语句,所以就避免了错误。这就叫做“立即调用的函数表达式”(Immediately-Invoked Function Expression),简称 IIFE。

注意,上面两种写法最后的分号都是必须的。如果省略分号,遇到连着两个 IIFE,可能就会报错。

// 报错 (function(){ /* code */ }()) (function(){ /* code */ }()) 

上面代码的两行之间没有分号,JavaScript 会将它们连在一起解释,将第二行解释为第一行的参数。

推而广之,任何让解释器以表达式来处理函数定义的方法,都能产生同样的效果,比如下面三种写法。

var i = function(){ return 10; }(); true && function(){ /* code */ }(); 0, function(){ /* code */ }(); 

甚至像下面这样写,也是可以的。

!function () { /* code */ }(); ~function () { /* code */ }(); -function () { /* code */ }(); +function () { /* code */ }(); 

通常情况下,只对匿名函数使用这种“立即执行的函数表达式”。它的目的有两个:一是不必为函数命名,避免了污染全局变量;二是 IIFE 内部形成了一个单独的作用域,可以封装一些外部无法读取的私有变量。

// 写法一 var tmp = newData; processData(tmp); storeData(tmp); // 写法二 (function () { var tmp = newData; processData(tmp); storeData(tmp); }()); 

上面代码中,写法二比写法一更好,因为完全避免了污染全局变量。



IIFE( 立即调用函数表达式)是一个在定义时就会立即执行的  JavaScript 函数。

(function () { statements })();

这是一个被称为 自执行匿名函数 的设计模式,主要包含两部分。第一部分是包围在 圆括号运算符 () 里的一个匿名函数,这个匿名函数拥有独立的词法作用域。这不仅避免了外界访问此 IIFE 中的变量,而且又不会污染全局作用域。

第二部分再一次使用 () 创建了一个立即执行函数表达式,JavaScript 引擎到此将直接执行函数。


当函数变成立即执行的函数表达式时,表达式中的变量不能从外部访问。

(function () { var name = "Barry"; })(); // 无法从外部访问变量 name name // 抛出错误:"Uncaught ReferenceError: aName is not defined"

将 IIFE 分配给一个变量,不是存储 IIFE 本身,而是存储 IIFE 执行后返回的结果。

var result = (function () { var name = "Barry"; return name; })(); // IIFE 执行后返回的结果: result; // "Barry"


· END ·

TAG:Javascript,IIFE 来源:网络

热门标签

首页 - 导航 - 免责 - 官方微信 - 用户反馈

© 2019 GOODTEXT.CN