js立即执行函数

一、什么是立即执行函数

顾名思义,声明一个函数并马上调用这个函数就叫做立即执行函数;也可以说立即执行函数是一种语法,让你的函数在定义以后立即执行;立即执行函数又叫做自执行函数。
在这里插入图片描述

二、立即执行函数的写法

立即执行函数的写法有三种:

( function ( “ 参数 ” ) { " 函数方法 " ; } ) ( “ 给参数传的值 ” )
( function ( " 参数 " ) { “ 函数方法 ” ; } ( " 给参数传的值 " ) )
! function ( " 参数 " ) { " 函数方法 " ; } ( " 给参数传的值 " )  
// ! 可以换作 void 或其他运算符(比如 +,-,= 等,都能起到立即执行的作用)

立即执行函数是很自私的,它的内部可以访问全局变量。但是除了它自身内部,外部是无法访问它的。

function aaa(a,b){
    return sum = a + b;
}
(function bbb(a,b){
    return sum = a + b;
}(1, 2))
console.log(aaa)
console.log(bbb)

上面代码中,是一个普通函数与一个立即执行函数,输出这两个函数会发现:普通函数aaa被全部打印出来,而打印立即执行函数bbb却报错。返回结果:
在这里插入图片描述
立即执行函数相当于一个瓶口朝下的杯子,当定义它的时候,它会倾斜,把杯口露出来,吸收外面的新鲜空气;当它执行完毕,杯口不再外露,紧闭起来,与外界再无关联。

三、使用立即执行函数的好处

通过定义一个匿名函数,创建了一个新的函数作用域,相当于创建了一个“私有”的命名空间,该命名空间的变量和方法,不会破坏污染全局的命名空间。此时若是想访问全局对象,将全局对象以参数形式传进去即可,如jQuery代码结构:

(function (window) {
	// jquery code
})(window);

其中window即是全局对象。作用域隔离非常重要,是一个JS框架必须支持的功能,jQuery被应用在成千上万的JavaScript程序中,必须确保jQuery创建的变量不能和导入他的程序所使用的变量发生冲突。

四、注意点

前面介绍了3种立即执行函数的写法,使用前两种写法的立即执行函数,它们的前一个函数必须要有分号。

举个栗子:

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

ECMAScript规范具有分号自动插入规则,但是在上面代码中,在第一个立即执行函数末尾却不会插入“;”,因此上面代码会被解释为如下形式:

(function (a){
  console.log(a)
})(1)(function (a){
  console.log(a)
}(2));

此时浏览器报错:
在这里插入图片描述
因此,立即执行函数前的一个函数必须要有分号,保险起见,可以直接在立即执行函数的前面添加“;”

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

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

五、扩展一道经典的面试题

非匿名自执行函数,函数名只读

看看下面代码输出什么?

var b = 10;
(function b(){
    b = 20
    console.log(window.b)
    console.log(b)
})()

输出:
在这里插入图片描述
再扩展一下:

var b = 10;
(function b(){
    console.log(b)
    b = 5
    console.log(window.b)
    var b = 20
    console.log(b)
})()

输出:
在这里插入图片描述
上面代码中,第一个值undefined,是因为下面有 var b = 20,var声明会提升到function最开头,但赋值发生在最后,function里面的代码等价于:

	var b
	console.log(b)
	b = 5
	console.log(window.b)
	b = 20
	console.log(b)

END

  • 6
    点赞
  • 9
    收藏
    觉得还不错? 一键收藏
  • 2
    评论
评论 2
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值