JavaScript:立即执行的函数表达式

先要理解清楚几个概念:

以下转自:http://www.cnblogs.com/TomXu/archive/2011/12/31/2289423.html

问题的核心

当你声明类似function foo(){}或var foo = function(){}函数的时候,通过在后面加个括弧就可以实现自执行,例如foo(),看代码:

// 因为想下面第一个声明的function可以在后面加一个括弧()就可以自己执行了,比如foo(),// 因为foo仅仅是function() { /* code */ }这个表达式的一个引用

var foo = function(){ /* code */ }

// ...是不是意味着后面加个括弧都可以自动执行?

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

上述代码,如果甚至运行,第2个代码会出错,因为在解析器解析全局的function或者function内部function关键字的时候,默认是认为function声明,而不是function表达式,如果你不显示告诉编译器,它默认会声明成一个缺少名字的function,并且抛出一个语法错误信息,因为function声明需要一个名字。

旁白:函数(function),括弧(paren),语法错误(SyntaxError)

有趣的是,即便你为上面那个错误的代码加上一个名字,他也会提示语法错误,只不过和上面的原因不一样。在一个表达式后面加上括号(),该表达式会立即执行,但是在一个语句后面加上括号(),是完全不一样的意思,他的只是分组操作符。

// 下面这个function在语法上是没问题的,但是依然只是一个语句// 加上括号()以后依然会报错,因为分组操作符需要包含表达式

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

// 但是如果你在括弧()里传入一个表达式,将不会有异常抛出// 但是foo函数依然不会执行function foo(){ /* code */ }( 1 );

// 因为它完全等价于下面这个代码,一个function声明后面,又声明了一个毫无关系的表达式: function foo(){ /* code */ }

( 1 );

你可以访问ECMA-262-3 in detail. Chapter 5. Functions 获取进一步的信息。

自执行函数表达式

要解决上述问题,非常简单,我们只需要用大括弧将代码的代码全部括住就行了,因为JavaScript里括弧()里面不能包含语句,所以在这一点上,解析器在解析function关键字的时候,会将相应的代码解析成function表达式,而不是function声明。

// 下面2个括弧()都会立即执行

(function () { /* code */ } ()); // 推荐使用这个(function () { /* code */ })(); // 但是这个也是可以用的

// 由于括弧()和JS的&&,异或,逗号等操作符是在函数表达式和函数声明上消除歧义的// 所以一旦解析器知道其中一个已经是表达式了,其它的也都默认为表达式了// 不过,请注意下一章节的内容解释

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

// 如果你不在意返回值,或者不怕难以阅读// 你甚至可以在function前面加一元操作符号

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

// 还有一个情况,使用new关键字,也可以用,但我不确定它的效率// http://twitter.com/kuvos/status/18209252090847232

new function () { /* code */ }new function () { /* code */ } () // 如果需要传递参数,只需要加上括弧()

上面所说的括弧是消除歧义的,其实压根就没必要,因为括弧本来内部本来期望的就是函数表达式,但是我们依然用它,主要是为了方便开发人员阅读,当你让这些已经自动执行的表达式赋值给一个变量的时候,我们看到开头有括弧(,很快就能明白,而不需要将代码拉到最后看看到底有没有加括弧。

来源: http://www.cnblogs.com/TomXu/archive/2011/12/31/2289423.html

来自为知笔记(Wiz)

时间: 2024-10-13 16:13:02

JavaScript:立即执行的函数表达式的相关文章

javascript立即执行的函数表达式

函数表达式和立即执行函数的区别 http://www.cnblogs.com/TomXu/archive/2011/12/31/2289423.html http://benalman.com/news/2010/11/immediately-invoked-function-expression/

[javascript]IIFE立即执行的函数表达式

近况:最近一直忙着找实习没有更新,不过学习还是在继续的.最近在写Node.js又稍带把javascript的角落知识捡了一遍,过半个月打算去看看python和一些CSS深层的书和博客.工作找的还好,拿了两份实习offer,决定好去当小二了.这几天在看司徒老师的<javascript框架设计>,开篇第一张讲种子模块(即核心模块)里面提到了一个没见过的缩写词IIFE,查了查.看了看. 1.什么是IIFE IIFE是缩写,全拼Imdiately Invoked Function Expression

JavaScript 编码规范 之 函数表达式

! function () { var a = function () // 赋值一个函数表达式 { } , b = function () // b c 效果一样 都是返回一个拥有闭包的函数 { var time = +new Date ; return function () { ; console.log( time ) } }() , c = ( function () // 加上圆括号的原因 1 表示是立即执行 2 拥有闭包元素 { var time = +new Date ; ret

Javascript自执行匿名函数(function() { })()的原理浅析

匿名函数就是没有函数名的函数.这篇文章主要介绍了Javascript自执行匿名函数(function() { })()的原理浅析的相关资料,需要的朋友可以参考下 函数是JavaScript中最灵活的一种对象,这里只是讲解其匿名函数的用途.匿名函数指没有指定函数名或指针的函数,自执行匿名函数只是其中一种,下文中称这种函数为:自执行函数 下面是一个最常见的自执行函数: // 传统匿名函数 (function() { alert('hello'); })(); 这段代码的执行效果就是在页面再载入时弹出

笔记:IIFE 立即执行的函数表达式 +function ($) { }(window.jQuery);

在Bootstrap源码(具体请看<Bootstrap源码解析1>)和其他jQuery插件经常看到如下的写法: +function ($) { }(window.jQuery); 这种写法称为:IIFE 2(Imdiately InvokedFunction Expression 立即执行的函数表达式). 解析: 先弄清函数表达式(function expression)3和 函数声明(function declaration)的区别: 函数表达式  var test = function()

Javascript自执行匿名函数(function() { })()的原理分析

匿名函数指没有指定函数名或指针的函数,自执行匿名函数只是其中一种,下文中称这种函数为:自执行函数 下面是一个最常见的自执行函数: 1 // 传统匿名函数 2 (function() { 3 alert('hello'); 4 })(); 这段代码的执行效果就是在页面再载入时弹出:"hello" 是什么促使它自动执行的?,来看下面的代码 // 在传统写法上去掉小括号,并在前面加上运算符 ~,!,+,- ~function(){ alert('hello'); }(); !function

JavaScript笔记五:函数表达式

1.函数表达式 var function = function() { //函数体 }; 2.递归 function factorial(num) { if(num<=1){ return 1;  } else {return num*factorial(num-1);} } arguments.callee是一个指向正在执行函数的指针,因此可以用它实现递归. function factorial(num) { if(num<=1){ return 1;  } else {return num

理解JavaScript的立即调用函数表达式(IIFE)

首先这是js的一种函数调用写法,叫立即执行函数表达式(IIFE,即immediately-invoked function expression).顾名思义IIFE可以让你的函数立即得到执行(废话). 一般来说,IIFE有以下几种用途: 1. 创建只使用一次的函数,并立即执行它. 2. 创建闭包,保存状态,隔离作用域. 3. 作为独立模块存在(例子如jQuery),防止命名冲突,命名空间注入(模块解耦). 1. 创建只使用一次的函数,并立即执行它 创建只使用一次的函数比较好理解,在需要调用函数的

javascript立即调用的函数表达式N种写法(第二篇)

上一篇博客我谈到将函数声明转换为函数表达式最常见的一种写法是:通过括号()将匿名函数声明转换为函数表达式即(function(){})(); 言外之意就是还有其他方式,记住:任何消除函数声明和函数表达式间歧义的方法,都可以被解析器正确识别!它们可以分为5类,超过10多种: (function(){})(); //最常见的写法 下文没特殊指明就是指它 (function(){}); //容易与上面的混淆 [function()()]; //一元运算符 ~function(){}; +functio