js匿名函数括号的作用

2019/07/27 00:12
阅读数 227

 详细解释请看原文。我觉得还是挺有帮助的。我主要摘抄了部分主要内容,加了部分自己的理解:

     ( function(){…} )()和( function (){…} () )是两种javascript立即执行函数的常见写法,最初我以为是一个括号包裹匿名函数,再在后面加个括号调用函数,最后达到函数定义后立即执行的目的。后来明白,要在函数体后面加括号就能立即调用,则这个函数必须是函数表达式,不能是函数声明。

    在function前面加!、+、 -甚至是逗号等到都可以起到函数定义后立即执行的效果,而()、!、+、-、=等运算符,都将函数声明转换成函数表达式,消除了javascript引擎识别函数表达式和函数声明的歧义,告诉javascript引擎这是一个函数表达式,不是函数声明,可以在后面加括号,并立即执行函数的代码。接下来看看匿名韩输的几种写法。

匿名函数写法一:

 

  1. (function(){

  2. //do something

  3. }())

 

 

匿名函数写法二:

 

  1. (function(){

  2. //do something

  3. })();


匿名函数写法三: 

 

  1. !function(){ //可以把!换成+、-、=等

  2. //do something

  3. }();

匿名函数写法四

 

  1. void function(){

  2. //do something

  3. }();

 

    加括号是最安全的做法,因为!、+、-等运算符还会和函数的返回值进行运算,有时造成不必要的麻烦。

    加括号的两种写法中,一定要注意匿名函数的前面一定好有分号,否则有可能引发错误。先看下写法一。下面的a函数会把后面的匿名函数作为参数传入a,导致a直接变成undefined,而不是一个函数。

 

  1. var a =function(value){alert(value);} //value值为undefined。因为没有返回值,a也变成undefined

  2. (function(){

  3. alert(1);

  4. }());

    再看下写法二,下面的代码会抛出错误“Uncaught TypeError: (intermediate value)(...) is not a function(…)”。 上例中就出现了错误,这就是因为a函数会把他后面的匿名函数作为参数传入a中,这也就解释了为什么有人习惯在匿名函数之前添加;了,就是为了防止上文没有严格遵循javascript语法,漏掉;的问题。

 

  1. var a = function(){}

  2. (function(){

  3. alert(1);

  4. })(); //抛出错误。最后面的()没有应用在函数上。Uncaught TypeError: (intermediate value)(...) is not a function(…)

    javascript中没用私有作用域的概念,如果在多人开发的项目上,你在全局或局部作用域中声明了一些变量,可能会被其他人不小心用同名的变量给覆盖掉,根据javascript函数作用域链的特性,可以使用这种技术可以模仿一个私有作用域,用匿名函数作为一个“容器”,“容器”内部可以访问外部的变量,而外部环境不能访问“容器”内部的变量,所以( function(){…} )()内部定义的变量不会和外部的变量发生冲突,俗称“匿名包裹器”或“命名空间”。 

    JQuery使用的就是这种方法,将JQuery代码包裹在 ( function (window,undefined){…jquery代码…} (window))中,在全局作用域中调用JQuery代码时,可以达到保护JQuery内部变量的作用。

展开阅读全文
加载中
点击引领话题📣 发布并加入讨论🔥
打赏
0 评论
0 收藏
0
分享
返回顶部
顶部