今天去看了一个GITHUB上的开源项目,在客户端JS的脚本编写的时候,代码中多次使用了IIFE

一开始我是懵逼的,不知道这种函数的意义何在,小菜鸟嘛。

后面我去研究了一番。发现了它的主要作用就是:让变量私有化

这里给出一个例子:

(function () {
var foo = "bar"; // Outputs: "bar"
console.log(foo);
})(); // ReferenceError: foo is not defined
console.log(foo);

当然,这些是可以使用普通命名函数就能做到的事,凭什么就要IIFE

那么我们为什么还要用IIFE呢?我抱着这个问题,又去实践了一番,发现了IIFE除了它的主要作用外,还有以下三个优点:

  1. 避免了在全局中使用命名空间。因为IIFE可以用匿名函数直接运行。楼主你可以把foo去掉直接运行。
  2. 使用IIFE是自运行的,而不需要你再次去调用,英文中说的是:self-documenting,。
  3. 普通命名函数,不是立即运行的,你可能会在某个地方错误调用它。

然而,现在是ES6的时代了,有了块级作用域的出现,这种函数的作用已经被let、const替代了,所以能看见他们出现的场景不多了。

但是,知道技术是为什么设计出来的还是很不错的。

使用IIFE(立即执行函数)让变量私有化的更多相关文章

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

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

  2. IIFE 立即执行函数表达式-模块化

    1)立即执行 2)表达式 3)括号,分号结束 | 前缀运算符 | 表达式上下文 4)只需要执行一次,内部变量无需维护,可用于初始化 (function( ) { })( ); 或 (function( ...

  3. 详解javascript立即执行函数表达式(IIFE)

    立即执行函数,就是在定义函数的时候直接执行,这里不是申明函数而是一个函数表达式 1.问题 在javascript中,每一个函数在被调用的时候都会创建一个执行上下文,在函数内部定义的变量和函数只能在该函 ...

  4. 原型模式故事链(4)--JS执行上下文、变量提升、函数声明

    上一章:JS的数据类型 传送门:https://segmentfault.com/a/11... 好!话不多少,我们就开始吧.对变量提升和函数声明的理解,能让你更清楚容易的理解,为什么你的程序报错了~ ...

  5. 自执行函数与setTimeout结合计算

    var v1=0,v2=0,v3=0;        for(var i=1;i<=3;i++){            var i2=i;            (function(){   ...

  6. 立即执行函数表达式(IIFE)

    原文地址:benalman.com/news/2010/11/immediately-invoked-function-expression/ 译者:nzbin 也许你还没有注意到,我是一个对术语比较 ...

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

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

  8. (译)详解javascript立即执行函数表达式(IIFE)

    写在前面 这是一篇译文,原文:Immediately-Invoked Function Expression (IIFE) 原文是一篇很经典的讲解IIFE的文章,很适合收藏.本文虽然是译文,但是直译的 ...

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

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

随机推荐

  1. Generator的基本用法

    Generator函数是一个状态机,封装了多个内部状态.执行一个Generator,会返回一个迭代器对象,通过迭代器对象,可以遍历Generator函数内部的每个状态.因此,Generator函数可以 ...

  2. webpack 3.8 使用 extract-text-webpack-plugin 3.0 抽取css失败:You may need an appropriate loader to handle this file type.

    webpack 3.8.1 使用 extract-text-webpack-plugin 3.0.2 抽取css时失败,报错: ERROR in ./src/static/style/localTim ...

  3. git使用笔记(一)入门

    By francis_hao    Nov 17,2016 本来是想把git的使用笔记写在一个文件里,但是越写越长,最后也不得不分开了.这样也好,每一篇一个侧重,可以写的详细一点.   初学乍练 在l ...

  4. [ZJOI2005]午餐 (DP)

    [ZJOI2005]午餐 题目描述 上午的训练结束了,THU ACM小组集体去吃午餐,他们一行N人来到了著名的十食堂.这里有两个打饭的窗口,每个窗口同一时刻只能给一个人打饭.由于每个人的口味(以及胃口 ...

  5. Codeforces Round #534 (Div. 2) D. Game with modulo(取余性质+二分)

    D. Game with modulo 题目链接:https://codeforces.com/contest/1104/problem/D 题意: 这题是一个交互题,首先一开始会有一个数a,你最终的 ...

  6. grub ubuntu启动

    set root=(hd0,gpt10) 现在变为 gpt9 了 安装固态后.变成了 (hd1,gpt11) set prefix=(hd0,gpt10)/boot/grub insmod norma ...

  7. 前端面试:css预处理

    css预处理定义: 定义了一种新的语言,其基本思想是用一种专门编程语言,为css增加了一些编程的特性,将css作为目标生成文件,然后开发者就只要使用这种语言进行编码工作. 几种预处理语言 sass l ...

  8. c# vs2008报表

    1. 做报表没做几次,第一次做的都忘记了,还好今天做一下就把报表弄成功了.报表中“参数字段”是可以变的,就是说需要自己赋值或者是要计算的.而在苏据库字段里面的是固定的值.不需要计算(注:有的字段查询出 ...

  9. 随机洗牌算法Knuth Shuffle和错排公式

    Knuth随机洗牌算法:譬如现在有54张牌,如何洗牌才能保证随机性.可以这么考虑,从最末尾一张牌开始洗,对于每一张牌,编号在该牌前面的牌中任意一张选一张和当前牌进行交换,直至洗到第一张牌为止.参考代码 ...

  10. JS高级技巧(简洁版)

    高级函数 由于在JS中,所有的函数都是对象,所以使用函数指针十分简单,也是这些东西使JS函数有趣且强大 安全的类型检测 JS内置的类型检测机制并不是完全可靠的 typeof 操作符返回一个字符串,表示 ...