js匿名函数括号的作用

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

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

匿名函数写法一:

    (function(){

         //do something

    }())
匿名函数写法二:

   (function(){

       //do something

   })();
匿名函数写法三: 

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

         //do something

    }();

匿名函数写法四:

    void function(){

         //do something

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

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

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

    (function(){

         alert(1);

    }());

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

    var a = function(){}

    (function(){

         alert(1);

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

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

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

欢迎分享本文,转载请保留出处:前端ABC » js匿名函数括号的作用

赞 (1)
分享到:更多 ()

发表评论 0