阅读 564

全网最易懂版:什么是立即执行函数?有什么作用?

2020年3月12日
《每日一题系列🚀》
作者:王二狗
博客:掘金思否知乎简书CSDN
点赞再看,养成习惯,每日一题系列会一直更新下去,你们的支持是我持续分享的最大动力😘

什么是立即执行函数?

要成为立即执行函数,需要满足两个条件:

  • 声明一个匿名函数
  • 立马调用这个匿名函数

比如,下面就是一个非常典型的立即执行函数:

(function(){console.log('这是一个立即执行函数'))()

//首先声明一个匿名函数(function(){console.log('这是一个立即执行函数'))
//然后再匿名函数的后面接一对括号(),立马调用这个函数
复制代码

大多数小伙伴不理解的可能是为什么要把匿名函数用一对括号包起来。

其实,这么做的目的是为了兼容JS的语法。

除了使用一对括号之外,我们还可以使用下面的语法:

(function(){alert('我是匿名函数')} ()) 
(function(){alert('我是匿名函数')}) ()
!function(){alert('我是匿名函数')}() 
+function(){alert('我是匿名函数')}()
-function(){alert('我是匿名函数')}()
~function(){alert('我是匿名函数')}()
void function(){alert('我是匿名函数')}()
new function(){alert('我是匿名函数')}()
复制代码

立即执行函数有什么作用?

立即执行函数的作用只有一个,那就是创建独立的作用域。 让外部无法访问作用域内部的变量,从而避免变量污染

比如下面的代码,我们就可以使用立即执行函数让for循环输出的值是16,而不是66

for(var i=0; i<6; i++){
  !function(i){//这个i是独立作用域里面的i
        console.log(i)//这个i是独立作用域里面的i
    }
  }(i)//这个i是for循环中的i
}
复制代码

上面的代码之所以输出的结果是16,而不是66,是因为我们每次都将for循环中的i单独赋值给了for循环内部的i

每一次for循环内i值变化的时候,我们都立即执行函数在for循环内部创建了一个独立的作用域,所以最终输出的结果是16

很多小伙伴在看这段代码的时候都容易被里面的i值所混淆,其实两个i并不是同一个值。

下面的代码会让你更加容易理解:

for(var i=0; i<6; i++){
  !function(j){
    console.log(j)
  }(i)
}
复制代码

告诫自己,即使再累也不要忘记学习,成功没有捷径可走,只有一步接着一步走下去。 共勉!

文章中如有不对的地方,欢迎小伙伴们多多指正。

谢谢大家~ 💘