今天看到一个库的代码这么写的
!function foo() {}();
感觉这应该是一个Self-executing anonymous function,不过一般我们都这么写啊
(function () {})();
感觉人家应该是有理由的。在网上查了一会,原来用!
还真的有好处。先给自己提两个问题:
- 加一个!有啥作用。
- 有啥好处。
!有啥作用
- 下面为啥错误
function foo(){ /* code */ }();
function () {}
是一个函数声明(是一个语句),}
后面解析语句结束了。而后面的()
里面需要包括一个表达式,这里没有,所以报告错误。注意JavaScript的括号中一定是表达式哦,不能为空。
- 下面为啥错误。
function (){ /* code */ }();
这里有人会说,这不和1一样的嘛。呵呵呵,你看看现在函数有没有名字,这里的错误是因为现在要声明一个函数,但是函数却没有名字。函数只有在表达式中才可以匿名,函数表达式与函数声明的最主要区别是函数名称(function name),在函数表达式中可忽略它,从而创建匿名函数(anonymous functions)。这里还没解析到括号就已经语法错误了。
- 为啥
foo()
可以成功。因为foo是函数名称。在当前作用域可以找到这个函数的名字,然后调用。
function foo(){ /* code */ }
foo();
- 为啥下面也可以成功,因为
foo
只是function表达式的引用,所以等于调用一个表达式。注意这个时候foo
并不是函数名字,只是一个变量名字。
var foo = function(){};
foo();
- 下面是怎么回事
function foo(){ /* code */ }( 1 );
上面这个代码语法没错,但是不能调用函数,因为它等于下面
function foo(){ /* code */ }
( 1 );
- 为啥下面能工作
(function () {})();
在JavaScript中,括号里面只能是表达式,不能是语句,所以上面的写法强制让解析引擎认为这里是一个函数表达式,后面在加上()
就可以调用了,参见3。
- 其他方式
// Either of the following two patterns can be used to immediately invoke
// a function expression, utilizing the function's execution context to
// create "privacy."
(function(){ /* code */ }()); // Crockford recommends this one
(function(){ /* code */ })(); // But this one works just as well
// Because the point of the parens or coercing operators is to disambiguate
// between function expressions and function declarations, they can be
// omitted when the parser already expects an expression (but please see the
// "important note" below).
var i = function(){ return 10; }();
true && function(){ /* code */ }();
0, function(){ /* code */ }();
// If you don't care about the return value, or the possibility of making
// your code slightly harder to read, you can save a byte by just prefixing
// the function with a unary operator.
!function(){ /* code */ }();
~function(){ /* code */ }();
-function(){ /* code */ }();
+function(){ /* code */ }();
// Here's another variation, from @kuvos - I'm not sure of the performance
// implications, if any, of using the `new` keyword, but it works.
// http://twitter.com/kuvos/status/18209252090847232
new function(){ /* code */ }
new function(){ /* code */ }() // Only need parens if passing arguments
!有啥好处
第一个好处就是打括号比较麻烦,要不然lisp语言造就流行了。那么还有没有其他好处呢。
!function abc(){}()
!function bca(){}();
和下面是一样的。
!function abc(){}()
;(function bca(){})();
意思就是感叹号可以帮助我们家上一个分号,防止代码在合并的时候发生错误。javascript经常会把几个js合并成一个公告的js文件,来加快下载速度。所以比较好的写法就是
!function bca(){}();
注意我们自己是要加上分号的,感叹号是为了防止别人没加哦。
关于ASI-Automatic semicolon insertion in JavaScript
这篇文章的思想来源于这个讨论what-does-the-exclamation-mark-do-before-the-function