没有区别。

定义函数有两种方式:一种是函数声明,另一种是函数表达式.
函数声明: function foo(arg0,arg1,arg2){
//函数体
}
函数表达式: var foo = function (arg0,arg1,arg2){
//函数体
}
------------------------------------------------------------------------------------------------------
function foo() {...}     // 这是定义,Declaration;定义只是让解释器知道其存在,但是不会运行。

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

IIFE 并非必须,传统一点可以这么写:

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

那么为什么要 IIFE?

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

如果想要立即执行函数表达式这个函数,该怎么办?

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

-------------------------------------------------------------------------------------------------

function foo(参数){代码块}( ); //这样写不可以

(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 对象

立即执行函数: (function(){...})() 与 (function(){...}()) 有什么区别?的更多相关文章

  1. 使用"立即执行函数"(Immediately-Invoked Function Expression,IIFE)

    一.原始写法 模块就是实现特定功能的一组方法. 只要把不同的函数(以及记录状态的变量)简单地放在一起,就算是一个模块. function m1(){ //... } function m2(){ // ...

  2. 立即执行函数(IIFE)的理解与运用

    作为JavaScript的常用语法,立即执行函数IIFE(Immediately-Invoked Function Expression)是值得我们认真去学习探究的. 一.创建函数的两种方式 我们先从 ...

  3. 基础-函数3(IIFE立即执行函数)

    参考链接: http://benalman.com/news/2010/11/immediately-invoked-function-expression/#iife http://segmentf ...

  4. JavaScript中为什么使用立即执行函数来封装模块?

    最近在学习JavaScript基础,在学习到面向对象编程时,学习到在JavaScript中实现模块化的方法,其中一个重要的点是如何封装私有变量. 实现封装私有变量的方法主要是: 使用构造函数 func ...

  5. 【repost】js中(function(){…})()立即执行函数写法理解

    摘要: javascript和其他编程语言相比比较随意,所以javascript代码中充满各种奇葩的写法,有时雾里看花,当然,能理解各型各色的写法也是对javascript语言特性更进一步的深入理解. ...

  6. js中(function(){…})()立即执行函数写法理解

    文章摘自https://my.oschina.net/u/2331760/blog/468672?p={{currentPage+1}} 摘要: javascript和其他编程语言相比比较随意,所以j ...

  7. javascript立即执行函数 (function(){})()

    看到一段代码: (function(){ var outer = $('#subject'); outer.find('li').on('mouseover', mouseover); })() ( ...

  8. 深入理解javascript中的立即执行函数(function(){…})()

    投稿:junjie 字体:[增加 减小] 类型:转载 时间:2014-06-12 我要评论 这篇文章主要介绍了深入理解javascript中的立即执行函数,立即执行函数也叫立即调用函数,通常它的写法是 ...

  9. js中(function(){…})()立即执行函数写法理解(转载oschina)

    ( function(){…} )()和( function (){…} () )是两种javascript立即执行函数的常见写法,最初我以为是一个括号包裹匿名函数,再在后面加个括号调用函数,最后达到 ...

随机推荐

  1. WebApi接口传参不再困惑(4):传参详解(转载)

    WebApi接口传参不再困惑(4):传参详解   前言:还记得刚使用WebApi那会儿,被它的传参机制折腾了好久,查阅了半天资料.如今,使用WebApi也有段时间了,今天就记录下API接口传参的一些方 ...

  2. VC 6中配置OpenGL开发环境

    2010,2012中配置类似 http://hi.baidu.com/yanzi52351/item/f9a600dffa4caa4ddcf9be1d VC 6中配置OpenGL开发环境 这里,我习惯 ...

  3. 网络服务器之HTTPS服务

    import ssl, socket, time if __name__ == "__main__": context = ssl.SSLContext(ssl.PROTOCOL_ ...

  4. target-densitydpi

    一个屏幕像素密度是由屏幕分辨率决定的,通常定义为每英寸点的数量(dpi).Android支持三种屏幕像素密度:低像素密度,中像素密度,高像素密度.一个低像素密度的屏幕每英寸上的像素点更少,而一个高像素 ...

  5. imx6 Image Vector Table (IVT)

    imx6开启启动之后,运行板子上的ROM程序.ROM确定启动的设备,进行一些初始化,然后读取IVT,进行寄存器初始化,最后运行uboot/cpu/arm_cortexa8/start.S中的_star ...

  6. WP8.1 和UWP 如何使用下载网页的上的音频 并保存

    WP8.1: private async Task<StorageFile> GetVoiceData() { HttpClient httpclient = new HttpClient ...

  7. web前端程序员真的值这么多钱吗?

    对于互联网公司来说用户就是上帝,做好客户体验一切才有可能.所以互联网公司都会把钱砸向前端,Web前端程序员也越来越受到企业争相聘用. 前端工程师工资也越来越高,目前Web前端工程师工作1~2年后通常会 ...

  8. kafka windows环境搭建 测试

    http://www.cnblogs.com/alvingofast/p/kafka_deployment_on_windows.html 照着例子搭建成功

  9. Python学习【第六篇】运算符

    运算符 算数运算: a = 21 b = 10 c = 0 c = a + b print ("1 - c 的值为:", c) c = a - b print ("2 - ...

  10. jquery easyui-datagrid/treegrid 清空数据参考

    在使用easyui的treegrid或datagrid的过程经常会有这样的场景,如:需要按不同的类型加载数据时,如果选择的分类下没有数据应该把上次展示的数据清空,以免引用歧义.下面给出两种方法供初学者 ...