在js函數前加符號的作用詳解

大家在看一些jquery插件的時候常常可以看到js函數前加的有分號、感嘆號等，我相信很多同學都並不是特理解加這個符號的作用到底在哪裡，不加不也是正常嘛，那麼我們今天就來詳細的講講js函數前加符號的作用吧!

##js函數前加分號和感嘆號的作用

js函數前符號是什麼意思？有什麼用？

一般看JQuery外掛裡的寫法是這樣的

(function($) {         
  //...  
})(jQuery);

今天看到

bootstrap的javascript元件是這樣寫的

!function( $ ){
  //...
}( window.jQuery );

為什麼要在前面加一個" ! " 呢？

我們都知道，函數的宣告方式有這兩種

function fnA(){alert('msg');}//声明式定义函数
var fnB = function(){alert('msg');}//函数赋值表达式定义函数

小編問題中出現的兩個函數，都是

匿名函數。通常，我們呼叫一個方法的方式就是 FunctionName()

但是，如果我們嘗試為一個「定義函數」結尾加上()，解析器是無法理解的。

function msg(){
  alert('message');
}();//解析器是无法理解的

定義函數的呼叫方式應該是msg() ;

如果將函數體部分用()包裹起來就可以運行並且解析器是不報錯的，如：

(function($) {         
  //...  
})(jQuery);

那為什麼將函數體部分用()包起來就可以了呢？

原來，使用括號包裹定義函數體，解析器會以

函數表達式的方式去呼叫定義函數。也就是說，任何能將函數變成一個函數表達式的作法，都可以讓解析器正確的呼叫定義函數。

而 ! 就是其中一個，而 + - || 都有這樣的功能。

另外，用 ! 可能更多的是一個習慣問題，不同的運算符，性能是不同的。

就是為了能省略一個字元…

// 这么写会报错，因为这是一个函数定义：
function() {}()
// 常见的（多了一对括号），调用匿名函数：
(function() {})()
// 但在前面加上一个布尔运算符（只多了一个感叹号），就是表达式了，将执行后面的代码，也就合法实现调用
!function() {}()

在前面加上~+-等一元

運算子也可以。 。其實還有好幾種符合都可以保證匿名函數宣告完就立即執行

var hi = function(){
 alert("hi") 
};
hi();

等於...

(function(){
 alert("hi")
 })
();

!、+和()一樣的效果可以把換成

!function(){
 alert("hi")
}
();

!比()節省一個字符，或者說比()好看些

我們都知道分號是為了和前面的程式碼隔開，js可以用換行分隔程式碼，但合併壓縮多個js檔案之後，換行符通常會被刪掉，所以連在一起可能會出錯，加上分號就保險了。你看到的感嘆號，通常是在壓縮過的js檔案裡面，因為在匿名函數呼叫的時候，通常我們都是用：  

(function(){})()  的形式，但也可以使用另一種形式：!function(){}()　前面的!號可以換成-+~等等一元操作符，從而省下了1位元組。

其他文章推薦：

#JavaScript函數綁定用法解析#

以上是在js函數前加符號的作用詳解的詳細內容。更多資訊請關注PHP中文網其他相關文章！