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


Posted in Javascript onNovember 18, 2015

没有区别。

你需要明白 IIFE 的原理,我简单说一下:

function foo() {...}     // 这是定义,Declaration;定义只是让解释器知道其存在,但是不会运行。

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

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

function foo() {...}

foo();

那么为什么要 IIFE?
1.传统的方法??拢?ㄒ搴椭葱蟹挚?矗?br /> 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 有帮助,有兴趣的话可以继续深入阅读:https://3water.com/article/75090.htm

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

Javascript 相关文章推荐
免费空间广告万能消除代码
Sep 04 Javascript
解决 firefox 不支持 document.all的方法
Mar 12 Javascript
THREE.JS入门教程(2)着色器-上
Jan 24 Javascript
Javascript new Date().valueOf()的作用与时间戳由来详解
Apr 24 Javascript
js使用DOM设置单选按钮、复选框及下拉菜单的方法
Jan 20 Javascript
javascript数据结构与算法之检索算法
Apr 04 Javascript
AngularJS中的过滤器filter用法完全解析
Apr 22 Javascript
javascript表单处理具体实现代码(表单、链接、按钮)
May 07 Javascript
纯JS前端实现分页代码
Jun 21 Javascript
详解webpack+vue-cli项目打包技巧
Jun 17 Javascript
javascript 取小数点后几位几种方法总结
Aug 02 Javascript
详解Vue 单文件组件的三种写法
Feb 19 Javascript
z-blog SyntaxHighlighter 长代码无法换行解决办法(基于jquery)
Nov 18 #Javascript
JavaScript如何获取数组最大值和最小值
Nov 18 #Javascript
原生js模拟淘宝购物车项目实战
Nov 18 #Javascript
JavaScript统计网站访问次数的实现代码
Nov 18 #Javascript
javascript实现添加附件功能的方法
Nov 18 #Javascript
Jquery Mobile 自定义按钮图标
Nov 18 #Javascript
javascript实现对表格元素进行排序操作
Nov 18 #Javascript
You might like
虫族 Zerg 魔法科技
2020/03/14 星际争霸
php_imagick实现图片剪切、旋转、锐化、减色或增加特效的方法
2014/12/15 PHP
Zend Framework生成验证码并实现验证码验证功能(附demo源码下载)
2016/03/22 PHP
php实现贪吃蛇小游戏
2016/07/26 PHP
php+js实现百度地图多点标注的方法
2016/11/30 PHP
PHP hebrev()函数用法讲解
2019/02/21 PHP
php引用和拷贝的区别知识点总结
2019/09/23 PHP
多浏览器兼容的获取元素和鼠标的位置的js代码
2009/12/15 Javascript
让浏览器非阻塞加载javascript的几种方法小结
2011/04/25 Javascript
js限制文本框输入长度两种限制方式(长度、字节数)
2012/12/19 Javascript
如何获取select下拉框的值(option没有及有value属性)
2013/11/08 Javascript
深入理解JS中的变量及作用域、undefined与null
2014/03/04 Javascript
使用js检测浏览器是否支持html5中的video标签的方法
2014/03/12 Javascript
JavaScript中getUTCSeconds()方法的使用详解
2015/06/11 Javascript
js表单提交和submit提交的区别实例分析
2015/12/10 Javascript
原生JS实现拖拽图片效果
2020/08/27 Javascript
bootstrap组件之导航组件使用方法
2017/01/19 Javascript
AngularJS $http模块POST请求实现
2017/04/08 Javascript
nodejs个人博客开发第六步 数据分页
2017/04/12 NodeJs
D3.js(v3)+react 实现带坐标与比例尺的柱形图 (V3版本)
2019/05/09 Javascript
[01:13]DOTA2群星解读国服召集令 一起说出回归的理由
2013/07/17 DOTA
[42:56]VGJ.S vs Serenity 2018国际邀请赛小组赛BO2 第二场 8.19
2018/08/21 DOTA
Python  连接字符串(join %)
2008/09/06 Python
Python多进程同步Lock、Semaphore、Event实例
2014/11/21 Python
对pandas中apply函数的用法详解
2018/04/10 Python
Python通过属性手段实现只允许调用一次的示例讲解
2018/04/21 Python
python使用PIL实现多张图片垂直合并
2019/01/15 Python
Django之无名分组和有名分组的实现
2019/04/16 Python
Python实现TCP探测目标服务路由轨迹的原理与方法详解
2019/09/04 Python
python实现udp传输图片功能
2020/03/20 Python
HTML5标签小集
2011/08/02 HTML / CSS
实例教程 利用html5和css3打造一款创意404页面
2014/10/20 HTML / CSS
斯洛伐克最大的婴儿食品和用品网上商店:Feedo.sk
2020/12/21 全球购物
综合办公室个人的自我评价
2013/12/22 职场文书
中国梦我的梦演讲稿
2014/04/23 职场文书
2014班子成员自我剖析材料思想汇报
2014/10/01 职场文书