一、IIFE

IIFE:immediately-invoked function expression,即时调用函数表达式。

如果一个函数,在定义的时候,就想直接调用它,就是一个IIFE。

函数执行方法:在函数名或变量名后面加()运算符。

函数关键字形式,定义时直接在后面加()执行。

function fun(){
console.log(1);
}();

var fun = function(){
console.log(1);
}();

函数表达式形式:能立即执行,函数在赋值给变量的时候就已经被矮化成表达式,可以直接在后面加小括号执行。

结论:如果函数能矮化其表达式,就能够在定义时直接调用,就能实现IIFE。

函数矮化为表达式的方法:在函数定义之前加运算符。

数学运算符中:+  - ()符号,其他不能用。

逻辑运算符中:!

注意:也可以不写函数名

//用运算符将函数矮化为表达式
+function fun(){
console.log('哈哈');
}(); -function fun(){
console.log('哈哈');
}(); !function fun(){
console.log('哈哈');
}(); (function fun(){
console.log('哈哈1');
})();

IIFE还可以进行函数传参,IIFE能够关住函数的作用域。在使用某个变量时,如果变量定义在函数之内,或者函数的参数,只会使用立即调用时的变量值,不会对别人造成影响。

(function fun(a){
console.log(a);
})(8);
fun(5); //IIFE关住fun的作用,外面找不到fun的定义

IIFE可以不写函数名,写匿名函数;IIFE关住函数的作用域,可以用于解决函数闭包带来的错误影响。

最标准常用的IIFE格式:所以IIFE里面的函数,都是匿名函数。

(function(a){
console.log(a);
})(8);

二、结合数组观察闭包

    <script type="text/javascript">
var arr=[]; //定义空数组接收
for(var i=0; i<=10; i++){
// 函数定义时作用域是全局的,全局中有一个变量 ;
//函数只是定义给每一项,并不会立即执行
//函数这个闭包,记住了全局作用域,里面有个i,记住了自己内部的语句
console.log(i);
arr[i]=function(){
console.log(i);
}
}
console.log(arr); //循环结束后全局变量i的值已经变为11; 如果在全局范围内查找i时,用的值就是11
//循环结束后,
console.log(i);
console.log(arr[0]()); //相当于函数内部的console.log(i)执行了一次
console.log(arr[1]());//相当于函数内部的console.log(i)执行了一次
console.log(arr[2]()); //相当于函数内部的console.log(i)执行了一次
</script>

输出的结果

要想实现循环中的i与其下标索引相等,用IIFE()来解决

   <script type="text/javascript">
var arr=[];
for(var i=0; i<=10; i++){
(function (a){
//每次i传进来时,IIFE立即执行
//执行时,每次a的值就是一个确定的i
arr[a]=function(){
console.log(a);
}
})(i);
}
console.log(arr);
console.log(arr[0]());
console.log(arr[1]());
console.log(arr[3]());
</script>

IIFE的更多相关文章

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

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

  2. JavaScript学习笔记(二)——闭包、IIFE、apply、函数与对象

    一.闭包(Closure) 1.1.闭包相关的问题 请在页面中放10个div,每个div中放入字母a-j,当点击每一个div时显示索引号,如第1个div显示0,第10个显示9:方法:找到所有的div, ...

  3. JavaScript学习总结(二)——闭包、IIFE、apply、函数与对象

    一.闭包(Closure) 1.1.闭包相关的问题 请在页面中放10个div,每个div中放入字母a-j,当点击每一个div时显示索引号,如第1个div显示0,第10个显示9:方法:找到所有的div, ...

  4. 什么是IIFE

    立即执行函数表达式(Immediately-invoked function expression) IIFE 我们知道,在javascript(ES5)中,是没有块级作用域的概念的.看一个例子 fo ...

  5. iife js

    摘自:http://dz.sdut.edu.cn/blog/subaochen/2016/02/%E8%AF%B4%E4%B8%80%E8%AF%B4js%E7%9A%84iife/ 1 定义 IIF ...

  6. 深入理解闭包系列第三篇——IIFE

    × 目录 [1]实现 [2]用途 前面的话 严格来讲,IIFE并不是闭包,因为它并不满足函数成为闭包的三个条件.但一般地,人们认为IIFE就是闭包,毕竟闭包有多个定义.本文将详细介绍IIFE的实现和用 ...

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

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

  8. Bootstrap IIFE

    在Bootstrap源码(具体请看<Bootstrap源码解析>)和其他jQuery插件经常看到如下的写法: +function ($) { }(window.jQuery); 这种写法称 ...

  9. 立即调用的函数表达式IIFE

    1.写法 (function () { alert("IIFE");})();//或者(function () { alert("IIFE"); }());

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

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

随机推荐

  1. 高阶篇:4.1.2)QFDII(设计要求逐层分配给各零件)

    本章目的:明确QFDII的作用:输入为设计要求(Design Feature),输出为零件特征(Part Characteristic),将设计要求分配到每一个零件特征中去: 本章开始介绍产品结构设计 ...

  2. Vue.js 项目开发学习路线图

    1. 思维导图 源文件:Vue路线图.xmind 参考文献 [1]. VueJs2.0建议学习路线 - lavyun - 博客园 [2]. Vue学习路线图 - 个人文章 - SegmentFault ...

  3. CentOS7 MongoDB安装及基本配置

    一.安装包的获取 1.创建文件: vi /etc/yum.repos.d/mongodb-org-4.0.repo 2.在上一步创建的文件中,写入如下内容: [mongodb-org-4.0] nam ...

  4. redux-thunk, redux-logger 阮一峰 ( react中间件 )

    http://www.ruanyifeng.com/blog/2016/09/redux_tutorial_part_two_async_operations.html Redux 入门教程(二):中 ...

  5. C# 获取SHA256码

    1. 如果是要获得某个字符串的SHA256,代码如下: public static string SHA256(string str) { //如果str有中文,不同Encoding的sha是不同的! ...

  6. 使用自动化恶意软件分析cuckoo分析exe程序

    Cuckoo是一款监控函数调用,监控文件读写,监控注册表读写等的自动化恶意分析软件. 包括apk.exe.pdf等多种文件的分析,将任务提交给数据库,host从数据库中读取任务,将样本放入虚拟机中运行 ...

  7. iOS 富文本属性

    // NSFontAttributeName 设置字体属性,默认值:字体:Helvetica(Neue) 字号:12 // NSForegroundColorAttributeNam 设置字体颜色,取 ...

  8. javascript高性能

    我在<javascript高性能> 这本书里面读到这个文章,所以做一下学习笔记,供大家一块学习: 无阻塞脚本的概念什么? 为什么要用无阻塞脚本? 如何实现无阻塞脚本,和每个实现方式应该注意 ...

  9. 很小的一个函数执行时间调试器Timer

    对于函数的执行性能(这里主要考虑执行时间,所耗内存暂不考虑),这里写了一个简单的类Timer,用于量化函数执行所耗时间. 整体思路很简单,就是new Date()的时间差值.我仅仅了做了一层简单的封装 ...

  10. Expression Blend实例中文教程(12) - 样式和模板快速入门Style,Template

    在上一篇,介绍了Visual State Manager视觉状态管理器,其中涉及到控件的样式(Style)和模板(Template),本篇将详细介绍样式(Style)和模板(Template)在Sil ...