IIFE(立即执行函数表达式)
我们经常会看到这样的写法:
;(fuction () {
// do something
})()
这就是一个简单的IIFE(立即执行函数表达式,immediately-invoked function expression)了。
这样的写法有什么好处呢?来简单分析一下。
1. 开头的分号
我们都知道,js是可以加分号或者不加分号的,在某些情况下,不加分号会让解析器解析出错,举个例子:
var
a = 0
, b = 0
;
a = b + 3
(b = a)
// Uncaught TypeError: 3 is not a function
解析代码的时候,a = b + 3和(b = a)这两条语句之间没有明确的分界,回车和空格会自动被忽略。解析器会认为这是一句。所以,此时会认为3是一个函数,b=a是他的参数。
在知乎的这个问题下,尤大做了解释。
真正会导致上下行解析出问题的 token 有 5 个:括号,方括号,正则开头的斜杠,加号,减号。我还从没见过实际代码中用正则、加号、减号作为行首的情况,所以总结下来就是一句话:一行开头是括号或者方括号的时候加上分号就可以了,其他时候全部不需要。其实即使是这两种情况,在实际代码中也颇为少见。
ok,回到我们的例子,我们的例子就是以括号开头的,如果上一个语句没有加分号,很可能会出现这样问题,这个分号就是为了防止这样的情况发生,称之为防御性分号。
2. function(){}
函数有两种声明方式:
function foo () {}
var foo = function () {}
这两种声明方式的不同之处在于,使用var声明的函数不会自动提升到顶部。也就是说,不能在var声明函数的语句之前调用函数,否则会抛出undefined的错误。
function () {}这种形式被称为匿名函数。匿名函数没有名字,也就是没有指针,是无法在其他地方调用的。
将匿名函数赋值给foo,则可以通过foo来调用。
当然还有办法调用它,就是例子中的两对括号。第一对括号将匿名函数包装成了一个表达式,而第二对括号意思就是立即执行它。
function () {console.log('a')} // 报错 Uncaught SyntaxError: Unexpected token (
(function () {console.log('a')}) // 返回函数定义 ƒ () {console.log('a')},没有log
(function () {console.log('a')})() // a
function foo() {console.log('a')}() // 报错 Uncaught SyntaxError: Unexpected token )
第一行,因为不是合法的声明方式,希望找到函数名的地方是‘(’,所以抛出了该异常。
第二行,()中的语句被当成了表达式,解析器会认为是var声明的方式。
第三行,自执行。
第四行,function foo() {console.log('a')}是正确的函数声明方式,被正确解析。接下来的一对括号依次解析,括号里需要有表达式,但是没有,所以会抛出这样的异常。
3. 好处
IIFE的好处就是不会污染全局变量,就在当前的函数体的作用域下进行操作,保证了父作用域的干净,如果return出一些函数,那这些函数就形成了闭包。
我们常用IIFE来写module。
var counter = (function(){
var i = 0;
return {
get: function(){
return i;
},
set: function( val ){
i = val;
},
increment: function() {
return ++i;
}
};
})()
Refer:
IIFE(立即执行函数表达式)的更多相关文章
- IIFE 立即执行函数表达式-模块化
1)立即执行 2)表达式 3)括号,分号结束 | 前缀运算符 | 表达式上下文 4)只需要执行一次,内部变量无需维护,可用于初始化 (function( ) { })( ); 或 (function( ...
- 立即执行函数表达式(IIFE)
原文地址:benalman.com/news/2010/11/immediately-invoked-function-expression/ 译者:nzbin 也许你还没有注意到,我是一个对术语比较 ...
- (译)详解javascript立即执行函数表达式(IIFE)
写在前面 这是一篇译文,原文:Immediately-Invoked Function Expression (IIFE) 原文是一篇很经典的讲解IIFE的文章,很适合收藏.本文虽然是译文,但是直译的 ...
- JS立即执行函数表达式(IIFE)
原文为 http://benalman.com/news/2010/11/immediately-invoked-function-expression/#iife ----------------- ...
- 【JavaScript】浅析IIFE(立即执行函数表达式)的作用
什么是IIFE IIFE就是立即执行函数表达式(Immediately-Invoked Function Expression) 为什么需要IIFE 应用IIFE有两个比较经典的使用场景, 第一就是在 ...
- 详解javascript立即执行函数表达式(IIFE)
立即执行函数,就是在定义函数的时候直接执行,这里不是申明函数而是一个函数表达式 1.问题 在javascript中,每一个函数在被调用的时候都会创建一个执行上下文,在函数内部定义的变量和函数只能在该函 ...
- [转]Javascript中的自执行函数表达式
[转]Javascript中的自执行函数表达式 本文转载自:http://www.ghugo.com/javascript-auto-run-function/ 以下是正文: Posted on 20 ...
- IIFF(立即执行函数表达式)
立即执行函数表达式(Immediately-invoked function expression,IIFF) 在javascript(ES5)中,是没有块级作用域的概念的 for (var i = ...
- 【JavaScript专题】--- 立即执行函数表达式
一 什么是立即执行函数表达式 立即执行函数表达式,其实也可以叫初始化函数表达式,英文名:IIFE,immediately-inovked-function expression.立即执行函数表达式就是 ...
随机推荐
- APP崩溃提示:This application is modifying the autolayout engine from a background thread after the engine was accessed from the main thread. This can lead to engine corruption and weird crashes.
崩溃输出日志 2017-08-29 14:53:47.332368+0800 HuiDaiKe[2373:1135604] This application is modifying the auto ...
- spring-data-jpa 中,如果使用了one-to-many , many-to-one的注释,会在Jackson进行json字符串化的时候出现错误
问题: spring-data-jpa 中,如果使用了one-to-many , many-to-one的注释,会在Jackson 2.7.0 进行json字符串化的时候出现错误. 解决办法: 通过在 ...
- 关于tarjan算法的空间优化
最近随着对tarjan算法理解的加深,我发现用另外一种途径实现tarjan的方法,且可以省去DFN数组,大大节省了空间.经过大量测试,已经无误.以下将分阶段阐述进行优化的过程. 第一阶段 下面来说一下 ...
- Eclipse中Hibernate插件的安装
在使用Hibernate开发时,大多数情况下涉及到其XML配置文件的编辑,尤其是.cfg.xml(配置文件)和hbm.xml(关系映射文件)这两种.为了更方便的使用此框架,其插件的安装是很有必要的. ...
- lintcode 132 模式
题目要求 给你一个 n 个整数的序列 a1,a2,...,an,一个 132 模式是对于一个子串 ai,aj,ak,满足 i < j < k 和 ai < ak < aj.设计 ...
- wsimport 命令不是内部命令
问题: 1. webservice在输入命令的时候wsimport的时候会出现如下错误: wsimport不是内部或者外部命令. 2. javac不是内部或者外部命令 3 java 就可以显示配置成功 ...
- 微信小程序用setData修改数组或对象中的一个属性值
在page中有如下数组 data: { info:[ { name:"yuki", tou:"../img/head.jpg", zGong:130, gMon ...
- Python学习之二:Python 与 C 区别
引自http://www.lxway.com/181844.htm 从开始看Python到现在也有半个多月了,前后看了Python核心编程和Dive into Python两本书.话说半个月看两本,是 ...
- 如何清楚微信页面的缓存(静态资源(图片,js,页面))
就不说啥子原因了,反正就是微信的缓存问题,照着下面的做法做,一定ok了. 不过就是有些麻烦,但是微信的缓存是为了提高自身的性能,我们这些开发要用人家的平台,只有自己去填坑了. 直接贴代码好了,加上去就 ...
- Travel
Travel Time Limit: 10000/2000 MS (Java/Others) Memory Limit: 32768/32768 K (Java/Others) Total Submi ...