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.立即执行函数表达式就是 ...
随机推荐
- 【学习】滚动延迟加载插件scrollLoading用法
今天遇到一个很好用的滚动延迟加载的插件,作者是我的偶象大神张鑫旭,其博客为http://www.zhangxinxu.com/. 以前也写过这种效果,用的是lazyload,不过只能实现图片的加载.而 ...
- 【学习】苹果iPhone safari浏览器样式重置修复按钮圆角bug
iPhone safari浏览器中,input按钮会按苹果的默认UI来渲染,例如,写的按钮明明是这个样的: 但是实际就会是这个样子: 怎么办呢? 为按钮添加:-webkit-appearance: n ...
- 关于string.h中字符串的操作
string.h中字符操作的函数 注意:**对字符数组的多次操作需要进行赋初值.或者善于用memset()函数进行清空数组的操作.** 否则容易出现错误. string.h文件中函数的用法加 ...
- 博客发在win10.me
看到了http://www.win10.me/?page_id=58 说可以把自己的文章投给win10.me 我试试 抱着没有的心态 居然可以 我联系九幽,和他们说我写了很多博客,质量不好,他们说好 ...
- VIM文本替换命令
在VIM中进行文本替换: 1. 替换当前行中的内容: :s/from/to/ (s即substitude) :s/from/to/ : 将当前行中的 ...
- SQL数据库的基础操作
一,认识SQL数据库 美国Microsoft公司推出的一种关系型数据库系统.SQLServer是一个可扩展的.高性能的.为分布式客户机/服务器计算所设计的数据库管理系统,实现了与WindowsNT的有 ...
- 华为笔试题--LISP括号匹配 解析及源码实现
在17年校招中3道题目AC却无缘华为面试,大概是华为和东华互不待见吧!分享一道华为笔试原题,共同进步! ************************************************ ...
- LINUX 笔记-ls命令
常用参数: -l :列出长数据串,包含文件的属性与权限数据等 -a :列出全部的文件,连同隐藏文件(开头为.的文件)一起列出来(常用) -d :仅列出目录本身,而不是列出目录的文件数据 -h :将文件 ...
- IDEA + Maven + JavaWeb项目搭建
前言:在网上一直没找到一个完整的IDEA+Maven+Web项目搭建,对于IDEA和Maven初学者来说,这个过程简单但是非常痛苦的,对中间的某些步骤不是很理解,导致操作错误,从而项目发布不成功,一直 ...
- 实验测试之------创建DBlink,查询远端的yang用户下的abcdedfa表,创建同义词
--测试环境,20远端,30本地: --准备1,20远端建立表的同义词,用户信息: 1.11 ---------------------------------------------------准备 ...