立即执行函数: (function(){...})() 与 (function(){...}()) 有什么区别?
没有区别。
定义函数有两种方式:一种是函数声明,另一种是函数表达式.
函数声明: function foo(arg0,arg1,arg2){
//函数体
}
函数表达式: var foo = function (arg0,arg1,arg2){
//函数体
}
------------------------------------------------------------------------------------------------------
function foo() {...} // 这是定义,Declaration;定义只是让解释器知道其存在,但是不会运行。
foo(); // 这是语句,Statement;解释器遇到语句是会运行它的。
IIFE 并非必须,传统一点可以这么写:
function foo() {...}
foo();
那么为什么要 IIFE?
- 传统的方法啰嗦,定义和执行分开写;
- 传统的方法直接污染全局命名空间(浏览器里的
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(){...}()) 有什么区别?的更多相关文章
- 使用"立即执行函数"(Immediately-Invoked Function Expression,IIFE)
一.原始写法 模块就是实现特定功能的一组方法. 只要把不同的函数(以及记录状态的变量)简单地放在一起,就算是一个模块. function m1(){ //... } function m2(){ // ...
- 立即执行函数(IIFE)的理解与运用
作为JavaScript的常用语法,立即执行函数IIFE(Immediately-Invoked Function Expression)是值得我们认真去学习探究的. 一.创建函数的两种方式 我们先从 ...
- 基础-函数3(IIFE立即执行函数)
参考链接: http://benalman.com/news/2010/11/immediately-invoked-function-expression/#iife http://segmentf ...
- JavaScript中为什么使用立即执行函数来封装模块?
最近在学习JavaScript基础,在学习到面向对象编程时,学习到在JavaScript中实现模块化的方法,其中一个重要的点是如何封装私有变量. 实现封装私有变量的方法主要是: 使用构造函数 func ...
- 【repost】js中(function(){…})()立即执行函数写法理解
摘要: javascript和其他编程语言相比比较随意,所以javascript代码中充满各种奇葩的写法,有时雾里看花,当然,能理解各型各色的写法也是对javascript语言特性更进一步的深入理解. ...
- js中(function(){…})()立即执行函数写法理解
文章摘自https://my.oschina.net/u/2331760/blog/468672?p={{currentPage+1}} 摘要: javascript和其他编程语言相比比较随意,所以j ...
- javascript立即执行函数 (function(){})()
看到一段代码: (function(){ var outer = $('#subject'); outer.find('li').on('mouseover', mouseover); })() ( ...
- 深入理解javascript中的立即执行函数(function(){…})()
投稿:junjie 字体:[增加 减小] 类型:转载 时间:2014-06-12 我要评论 这篇文章主要介绍了深入理解javascript中的立即执行函数,立即执行函数也叫立即调用函数,通常它的写法是 ...
- js中(function(){…})()立即执行函数写法理解(转载oschina)
( function(){…} )()和( function (){…} () )是两种javascript立即执行函数的常见写法,最初我以为是一个括号包裹匿名函数,再在后面加个括号调用函数,最后达到 ...
随机推荐
- android studio 2.0 GPU Debugger使用说明
GPU Debugger GPU Debugging Tools The GPU debugging tools are an experimental feature intended to hel ...
- C#中异常:“The type initializer to throw an exception(类型初始值设定项引发异常)”的简单分析与解决方法
对于C#中异常:“The type initializer to throw an exception(类型初始值设定项引发异常)”的简单分析,目前本人分析两种情况,如下: 情况一: 借鉴麒麟.NET ...
- iOS 简单滤镜
转自:http://blog.csdn.net/lovechris00/article/details/51496458 1.主要是运用 ImageUtil库,把原图通过矩阵色值设置层不同滤镜效果下的 ...
- netstrem获取302后的地址,可用来截图,加载实际跨域文件
直接放代码,老外博客看来的,老外还是牛逼,这都用出来了:http://jessewarden.com/2009/03/handling-crossdomainxml-and-302-redirects ...
- Windows Live Writer体验
[安装] 首先下载安装包安装软件,没啥好说的,baidupan有记录: 顺便下载两个工具,备用: a)SourceCodePlugin_version_1.1.zip 将WindowsLiveWrit ...
- java内存泄漏的定位与分析
1.为什么会发生内存泄漏 java 如何检测内在泄漏呢?我们需要一些工具进行检测,并发现内存泄漏问题,不然很容易发生down机问题. 编写java程序最为方便的地方就是我们不需要管理内存的分配和释放, ...
- LoadRunner访问Mysql数据库
这是很久以前编写的一个测试案例,那时是为了检查大量往Mysql数据库里插入数据,看一下数据库的性能如何?服务器是否会很快就被写满了. 前期的准备工作:Mysql 数据库搭建,LoadRunner,li ...
- 如何删除NSDictionary或NSArray中的NSNull
前段时间与某公司的技术交流,被问到一个问题,如何删除NSDictionary中的NSNull.当时在纸上写,以前太依赖Xcode编译器了,以至于方法名都写不全,最终也没写出来,我想我肯定被鄙视的体无完 ...
- 对bootstrap中confirm alert进行封装
HTML: <!-- system modal start --> <div id="ycf-alert" class="modal"> ...
- Android studio 出现 Unsupported major.minor version 52.0
参考资料:http://blog.csdn.net/fakine/article/details/51241202 最近更新了Android studio 之后,出现了Error:java.lang. ...