(转）Javascript函数前面的感叹号是用来干嘛的

http://www.jianshu.com/p/f604a1e284c0
文／沈寅（简书作者）
原文链接：http://www.jianshu.com/p/f604a1e284c0
著作权归作者所有，转载请联系作者获得授权，并标注“简书作者”。

今天看到一个库的代码这么写的
!function foo() {}();
感觉这应该是一个Self-executing anonymous function，不过一般我们都这么写啊
(function () {})();
感觉人家应该是有理由的。在网上查了一会，原来用!还真的有好处。先给自己提两个问题：

加一个!有啥作用。
有啥好处。

!有啥作用


下面为啥错误
function foo(){ /* code */ }();
function () {}是一个函数声明（是一个语句），}后面解析语句结束了。而后面的()里面需要包括一个表达式，这里没有，所以报告错误。注意JavaScript的括号中一定是表达式哦，不能为空。


下面为啥错误。
function (){ /* code */ }();
这里有人会说，这不和1一样的嘛。呵呵呵，你看看现在函数有没有名字，这里的错误是因为现在要声明一个函数，但是函数却没有名字。函数只有在表达式中才可以匿名，函数表达式与函数声明的最主要区别是函数名称（function name），在函数表达式中可忽略它，从而创建匿名函数（anonymous functions）。这里还没解析到括号就已经语法错误了。

1和2是不同的语法错误



为啥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