匿名函數在JavaScript中使用jQuery

Question

的區別是什麼
之間在這裏，我知道全球jQuery是爲$到函數傳遞，

(function($){ 

})(jQuery); 

而這一次

$(function(){ 

})(); 

Answer 1

(function ($) 

})(jQuery); 

它定義了一個函數，然後立即調用，並將JQuery對象作爲參數傳入。 $是JQuery的引用，您可以在該函數內部使用它。這是相同的：

var Test = function ($){}; 
Test(jQuery); 

這：

$(function(){ 

}); 

是jQuery的調用，通過其一旦文檔加載完畢後應執行的功能。

Answer 2

第二個是不是一個普通的模式（它會拋出一個類型錯誤），除非你錯誤地包含了引用括號：

(function($){ 
    // Normal IIFE that happens to pass jQuery in as an argument 
})(jQuery); 

$(function(){ 
    // Shorthand DOM-ready event handler 
}); // <-- Remove the invoking parentheses 

Answer 3

$（function（）{ // Backbone code in here }）; ：

這是jQuery’s 「DOMReady」函數的別名，當DOM準備好被JavaScript代碼處理時執行該函數。這使您可以編寫需要DOM的代碼，並知道DOM可用並準備好被應用程序讀取，寫入或修改。

雖然這不是一個模塊。這只是一個傳遞給DOMReady別名的回調函數。在這種情況下，模塊和回調之間的主要區別在於jQuery等待DOM準備就緒，然後在適當的時候調用回調函數 - 所有這些都來自jQuery的上下文 - 而模塊模式或立即調用函數在定義後立即執行。在上面的例子中，模塊接收jQuery作爲參數，但這與使用jQuery的DOMReady事件不同，因爲模塊函數被調用，立即傳入jQuery作爲參數。它不會等待DOM準備就緒。只要函數被解析，它就會執行。

（函數（$）{// 骨幹在代碼在這裏 }）（jQuery的）;:

這是一個緊調用函數表達式（FKA「匿名功能」，「自我呼叫功能「等）。

這是一個由調用（jQuery）括號立即調用的函數。將jQuery傳遞給括號的目的是爲全局變量提供本地範圍。這有助於減少查找$變量的開銷量，並且在某些情況下允許縮小器的更好的壓縮/優化。

在這種情況下，該函數被用作JavaScript「模塊」模式。在大多數瀏覽器中，當前實現的JavaScript版本中的模塊並不是特定的函數結構。相反，它們是一種實現模式，它使用立即調用功能來提供圍繞相關功能「模塊」的範圍和隱私。模塊通常會公開一個公共API - 「揭示模塊」模式 - 通過從模塊函數中返回一個對象。但有時候，模塊完全獨立，不提供任何外部方法來調用。

check this

Answer 4

$(function(){ 

}); 

這只是對DOM準備的事件處理程序，即相當於速記：在

$(document).ready(function(){ 
    // execution when DOM is loaded... 
}); 

我們這樣的：

(function($){ 
    // code here 
})(jQuery); 

這段代碼不會在DOM準備好時執行，但會直接執行。將jQuery作爲參數傳入函數的好處是避免與美元符號（$）的使用衝突，因爲多個庫將它用作速記引用。函數內部的所有內容都可以安全使用$，因爲這是作爲參考jQuery傳入的。

瞭解更多關於在$符號衝突：jQuery noConflict

如果將二者結合起來的代碼片段，你會得到一個很好的和堅實的設置：

// $ reference is unsafe here in the global scope if you use multiple libraries 

(function($){ 
    // $ is a reference to jQuery here, passed in as argument 

    $(function(){ 
     // executed on dom-ready 
    }); 

})(jQuery); 

PS：在JavaScript由於function能既是一種陳述，也是一種表達，取決於上下文，大多數人在其周圍添加額外的括號以強制它成爲表達式。

Answer 5

當js解析器遇到它時，第一個snipset將執行「function（$）{...}」，在其中創建一種私有上下文，其中$ argument var將指向jQuery，因爲它作爲參數傳遞「 （jQuery）「（如果你想避免與先前聲明的$ var相沖突，這會引用除jQuery對象之外的其他東西）

第二個看起來像JQuery.ready函數調用，但帶有語法錯誤。有雙向的actualy寫它

$(document).ready(function(){ 
    /* DOM has loaded */ 
}); 

$(function(){ 
    /* DOM has loaded */ 
});