js立即执行函数: (function ( ){})( ) 与 (function ( ){}( )) 有什么区别?

转自:http://www.jb51.net/article/75089.htm

这篇文章主要介绍了js立即执行函数: (function ( ){})( ) 与 (function ( ){}( )) 有什么区别,需要的朋友可以参考下
 

没有区别。

你需要明白 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() {...}();

这些都可以。

我个人挺偏爱用 void 来转变表达式,因为此关键字不会有返回值。不过这一点真的没有什么要紧的,就当我“龟毛”好了……

复制代码 代码如下:
void function () {
    // 这里是真正需要的代码
}();

OK,所谓不去污染全局命名空间,是因为 IIFE 创建了一个新的函数作用域,你真正的业务代码被封装在其中,自然就不会触碰到全局对象了。如果你需要全局对象,那就 pass 给 IIFE:

复制代码 代码如下:
void function (global) {
    // 在这里,global 就是全局对象了
}(this)    // 在浏览器里,this 就是 window 对象

我在这里写过一个系列,其中一篇讲作用域和命名提升的,里面的知识点对理解 IIFE 有帮助,有兴趣的话可以继续深入阅读:http://www.jb51.net/article/75090.htm

方式一,调用函数,得到返回值。强制函数直接量执行再返回一个引用,引用在去调用执行
方式二,调用函数,得到返回值。强制运算符使函数调用执行
(function(){})(); 是 把函数当作表达式解析,然后执行解析后的函数
相当于 var a = function(){}; a(); a得到的是函数
(function(){}()); 是把函数表达式和执行当作语句直接执行、
相当于 var a = function(){}(); a得到的是结果
最终结果是一样的、
()只是起了 自执行的作用
和 () 一样的还有很多
比如 +function (){}
这个等于 (function (){}) 一般用(function (){}) 还有个作用,就是 避免全局变量

(function ( ){})( ) 与 (function ( ){}( )) 有什么区别?的更多相关文章

  1. 浅析jQuery(function(){})与(function(){})(jQuery)之间的区别

    本篇文章主要是对jQuery(function(){})与(function(){})(jQuery)之间的区别进行了介绍,需要的朋友可以过来参考下,希望对大家有所帮助 Jquery是优秀的Javas ...

  2. (function($){}) 和$(function(){}) 和$(function($){}) 区别

    请问下(function($){}) 和$(function(){}) 和$(function($){}) 有什么区别 谢谢 一.先看 jQuery(function(){ }); 全写为 jQuer ...

  3. function foo(){}、(function(){})、(function(){}())等函数区别分析

    前面一段时间,看到(function(){}),(function(){}())这些函数就犯晕,不知道它到底是什么意思,为什么函数外要加小括号,函数后要加小括号,加和不加到底有什么区别……一直犯迷糊, ...

  4. JavaScript 中,定义函数时用 var foo = function () {} 和 function foo() {}有什么区别?

    对于新手来说(本人也是新手-_-!),好像var foo = function () {} 和 function foo(){}并没有什么区别,意识里可能就认为就是两种不同的写法而已.但是,通过网上查 ...

  5. 从var func=function 和 function func()区别谈Javascript的预解析机制

    var func=function 和 function func()在意义上没有任何不同,但其解释优先级不同:后者会先于同一语句级的其他语句. 即: { var k = xx(); function ...

  6. $.fn与$.fx什么意思; $.extend与$.fn.extend用法区别; $(function(){})和(function(){})(jQuery)

    $.fn是指jquery的命名空间,加上fn上的方法及属性,会对jquery实例每一个有效. 如扩展$.fn.abc() 那么你可以这样子:$("#div").abc(); 通常使 ...

  7. function,new function,Function,new Function 之间的区别

    测试一: var fud01 = function()  { var temp = 100; this.temp = 200; return temp + this.temp; } alert(typ ...

  8. jQuery中$(function(){})与(function($){})(jQuery)、$(document).ready(function(){})等的区别详细讲解

    1.(function($) {…})(jQuery); 1).原理: 这实际上是匿名函数,如下: function(arg){…} 这就定义了一个匿名函数,参数为arg 而调用函数时,是在函数后面写 ...

  9. $(document).ready(function (){}) , $(function(){}) , $().ready(function(){}) , jquery(function(){}) , (function($){})(jquery)有什么区别

    $(document).ready(function(){...}) , $().ready(function(){...}) ,  $(function(){...}) , jquery(funct ...

随机推荐

  1. [Flex] Accordion系列-动态添加或删除Accordion容器中项目

    <?xml version="1.0" encoding="utf-8"?> <!--Flex中如何使用addChild()和removeCh ...

  2. spring-aop示例

    具体案例放在github上,主要是jar包在上面 https://github.com/guoyansi/spring-aop-example knights.xml <?xml version ...

  3. Ext TreeGrid提交修改过的数据

    本打算将整个treestore的数据提交到服务器,但找来找去没有找到好的方法,在翻api的时候发现了getUpdatedRecords()方法,拿来一试,试出此方法可以拿到被修改过的record so ...

  4. 光流算法:Brox光流的OpenCV源码解析

    OpenCV中DeepFlow代码其实是Brox光流,而非真正的DeepFlow光流,在将近一个月的研究.移植及优化过程中,对Brox光流有了较深刻的认识.我对OpenCV中源码进行了详细的分析,并以 ...

  5. Spark是一种分布式的计算方案

    Spark的安装基于HDFS,所以我们要设置hadoop的配置文件,所以spark的存储不是其主要的功能点,而spark作为分布式生态中的角色是一种计算模式(其他 的计算 模式,比如MR,Storm, ...

  6. ORA-00245: control file backup failed; target is likely on a local file system (转载)

    环境:DB VERSION: 11.2.0.4.0RAC 2 nodes 问题:邮件显示rman备份失败,查看rman备份日志 Starting Control File and SPFILE Aut ...

  7. 安装python的redis模块

    wget --no-check-certificate https://pypi.python.org/packages/source/r/redis/redis-2.8.0.tar.gz tar - ...

  8. math对象和date对象

    math对象的函数方法,记住Math首字母要大写 console.log(Math.abs(-5)); //取绝对值 console.log(Math.ceil(1.1)); //向上取舍 conso ...

  9. 再看.net本质(二)

    3.[HTTP协议]  当浏览器寻找到Web服务器的地址之后,浏览器将帮助我们把对服务器的请求转换为一系列参数发送给Web服务器.服务器收到浏览器的请求对数之后,将会分析这些数据并进行处理,然后向浏览 ...

  10. iOS 国际化

    1.在APPproject的新建一个Localizable.strings File->new file--->Resource --->strings File 2.添加需要的语言 ...