jQuery和Twitter的引導功能說明

Question

如果發現存在於所有文件Twitter的引導的application.js文件，你會發現一些下面的代碼：

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

有人能解釋爲什麼這是對的情況下代碼的第一行？

感謝

Answer 1

這可以保證在函數內部的代碼，你將能夠使用jQuery的訪問的$速記方式。在某些環境下（例如Wordpress），它們沒有「簡化」的「啓用」以避免與其他JavaScript庫衝突。通過在這裏使用這種方式，您可以在任何環境中使用簡單的$構造（只要定義了window.jQuery）。

因此，基本上它創建一個函數並立即調用它，傳入window.jQuery。這意味着函數中的代碼將會看到$ local變量，並且它被分配了window.jQuery。

Answer 2

這是一個自我執行的函數：

!function(x){}(y) 

x是函數的參數和y是您在自動調用該函數的傳遞參數。

!只是一個視覺指南，告訴你一目瞭然的功能是自我執行。另一種常見做法是將其包裝在括號中。 (function(){}())

Answer 3

這是因爲

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

不是語法有效，但

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

是有效的。

現在的問題是爲什麼第一個案件無效？

我們先來看看這個。匿名函數和命名函數都可以被認爲是表達式，例如，

0 + function(y) { return y; } (1); 
0 + function x(y) { return y; } (1); 

都是有效的。

然後考慮這種情況，這句話包含一個表達

function x(y) { 
    return y; 
} 
(1); 

「這是不正確！」你是否可以這樣說，因爲你知道它們實際上是一個函數定義和一個表達式，其中一個表達式爲(1)。

事實是，這些代碼是不明確的文法分析，因爲它可能被解析爲任一個功能和一個括號包裹的表達或功能調用。爲了避免這種不明確的，使用Javascript規則如果function出現的語句的第一個記號，聲明應該是一個函數定義。因此，function($) {} (window.jQuery);在語法中無效，因爲它不是有效的函數定義。但prepose一個!甚至這種代碼是有效的

0 + function x(y) { 
    return y; 
} 
(1); 

這是一個語句，用二進制加，其RHS是函數調用，它裏面。