【JS基础】立即执行函数表达式(自执行函数)

立即执行函数表达式

立即执行函数表达式，大部分人也称为自执行函数。

自执行函数的写法

匿名函数

(function() {console.log(2)
})()

具名函数

(function log() {console.log(2)
})

自执行函数的传参

(function add(a, b) {console.log(a + b)
})(1, 2)

返回值

let fn = (function add(a, b) {return a + b;
}) (2, 4)console.log(fn)

自执行函数也可以传递函数作为参数

var a =2;(function log(fn) {fn(window)
})(function fn(global) {var a = 3;console.log(a); // 3console.log(global.a); // 2
})

立即执行函数有什么用？

只有一个作用：创建一个独立的作用域。

这个作用域里面的变量，外面访问不到（即避免「变量污染」）。

以一个著名的面试题为例：

var liList = ul.getElementsByTagName('li')
for(var i=0; i<6; i++){liList[i].onclick = function(){alert(i) // 为什么 alert 出来的总是 6，而不是 0、1、2、3、4、5}
}

为什么 alert 的总是 6 呢，因为 i 是贯穿整个作用域的，而不是给每个 li 分配了一个 i，如下：

那么怎么解决这个问题呢？用立即执行函数给每个 li 创造一个独立作用域即可（当然还有其他办法）：

var liList = ul.getElementsByTagName('li')
for(var i=0; i<6; i++){!function(ii){liList[ii].onclick = function(){alert(ii) // 0、1、2、3、4、5}}(i)
}

在立即执行函数执行的时候，i 的值被赋值给 ii，此后 ii 的值一直不变。

i 的值从 0 变化到 5，对应 6 个立即执行函数，这 6 个立即执行函数里面的 ii 「分别」是 0、1、2、3、4、5。

为什么还要用另一对括号把匿名函数包起来呢？

其实是为了兼容 JS 的语法。

如果我们不加另一对括号，直接写成

【JS基础】立即执行函数表达式(自执行函数)相关推荐

JavaScript 函数声明，函数表达式，匿名函数，立即执行函数之区别
函数声明:function fnName () {-};使用function关键字声明一个函数,再指定一个函数名,叫函数声明. 函数表达式 var fnName = function () {-};使 ...
函数声明、函数表达式、匿名函数、立即执行函数
函数声明:function fnName () {-};使用function关键字声明一个函数,再指定一个函数名,叫函数声明. 函数表达式 var fnName = function () {-};使 ...
逆推继承看原型函数的角色函数声明和函数表达式的区别函数中this指向的问题
逆推继承看原型 <!DOCTYPE html> <html lang="en"> <head><meta charset="UT ...
matlab已知函数表达式画函数图像,怎么用matlab画已知函数表达式的一个函数图像？函数比较复杂的……...
点击查看怎么用matlab画已知函数表达式的一个函数图像?函数比较复杂的--具体信息答:要具体哦,如果一个自变量,函数图像就是曲线,用plot 如果是2个自变量,函数图像就是曲面了,如f=3*exp ...
函数表达式与命名函数区别
函数表达式: 1.把一个函数赋值给一个变量,叫做函数表达式 2.var 变量名 = 匿名函数; 3.函数表达式中,匿名函数后一定要有";"分号 4.变量名+()括号即调用了函数 ...
JS一起学01：css复习、js基础知识、事件、参数、函数、网页换肤、if判断、className问题、浏览器执行顺序
一.html/css 1. 什么是盒子模型? padding+border+width/height 2. float 浮动 (1)浮动的特性脱离文档流行内 ...
关于函数表达式的标识符/函数名
函数的标识符也就是通常说的函数名,在函数声明中不可省略,而函数表达式中可以省略. 我们都知道,javascript引擎将函数名视同变量名,所以采用function命令声明函数时,整个函数会像变量提升一 ...
matlab 中调用s函数表达式,[求助]S函数中能否调用M函数
[求助]S函数中能否调用M函数我现在写了一个S-FUNCTION 里面调用了一些M函数,当把S函数的名字写入S-FUNCTION块的时候总是出现 ??? SWITCH expression mus ...
JS进阶之---函数，立即执行函数
一.函数函数声明.函数表达式.匿名函数函数声明:使用function关键字声明一个函数,再指定一个函数名,叫函数声明.function name () { - } 函数表达式:使用function ...