Jquery中的(function($){...})(jQuery)，jqueryfunction
當你第一眼看到“(function($){...})(jQuery)”的時候，你有什麼感覺？呵呵呵，我當時還是止不住的從心底裡罵了一句——操，這他媽什麼勞什子。時過境遷，對於現在無比倚重Jquery的我，自感當時的自己是那麼的無知，今天忙裡偷閒，解釋一下究竟“(function($){...})(jQuery)”該怎樣理解：
代碼一：
<html><head><title>代碼一</title><meta http-equiv="Content-Type" content="text/html; charset=UTF-8"><script type="text/javascript">(function(name){alert(name);})("GaoHuanjie");</script></head><body></body></html>
說明：在瀏覽器中運行上面代碼，會彈出一個對話方塊，對話方塊的內容為GaoHuanjie。
上面代碼中執行的JavaScript指令碼和“(function($){...})(jQuery)”是一樣的，也就是說“(function($){...})(jQuery)”中的函數會自動被執行，那麼究竟該怎樣理解“(function($){...})(jQuery)”呢？“(function($){...})(jQuery)”實際上表示的是已處於調用狀態的匿名函數：function($){...}是定義的匿名函數，參數為$（之所以將參數聲明為$是為了不與其他庫衝突）；為了調用該函數則在該匿名函數的後面添上了括弧和實參（這裡為jQuery），但又由於操作符的優先順序，函數本身也需要用括弧，所以又為匿名函數添加了括弧。一、我運行下面代碼為什麼報錯——jQuery is not defined：
<html><head><title>代碼二</title><meta http-equiv="Content-Type" content="text/html; charset=UTF-8"><script type="text/javascript">(function($){alert($);})(jQuery);</script></head><body></body></html> 嗯嗯，瀏覽器在解析上述js指令碼時確實會出現問題，假如為jQuery添加英文雙引號，再次使用瀏覽器運行上述指令碼則不會出錯，為什麼不加就會出錯呢，呵呵呵，其實這裡的jQuery還是一個變數，如果為上述代碼引入jQuery庫，再次使用瀏覽器運行上述代碼則不會出現問題：
<html><head><title>代碼三</title><script type="text/javascript" src="./jquery-1.6.2.js"></script><meta http-equiv="Content-Type" content="text/html; charset=UTF-8"><script type="text/javascript">(function($){alert($);})(jQuery);</script></head><body></body></html>
【0分下載資源】
在引入jQuery庫後之所以不會出錯是因為jQuery庫中定義了jQuery變數。 二、和$(function(){ })相比，(function($){...})(jQuery)的執行時機也是在網頁DOM載入完畢後才執行嗎？
不是的，比如如下例子：
<html><head><title>代碼四</title><meta http-equiv="Content-Type" content="text/html; charset=UTF-8"><script type="text/javascript">(function(){alert(document.getElementById("name").value);})();</script></head><body><input type="hidden" id="name" name="name" value="GaoHuanjie" /></body></html> 上述例子在瀏覽器中啟動並執行時候會報錯，究其原因(function(){...})()函數的執行時機並不是在DOM載入完畢後才執行，而是隨著頁面自上而下來執行，如果將其改成如下代碼則再次使用瀏覽器運行指令碼則不會出現問題：
<html><head><title>代碼五</title><meta http-equiv="Content-Type" content="text/html; charset=UTF-8"></head><body><input type="hidden" id="name" name="name" value="GaoHuanjie" /><script type="text/javascript">(function(){alert(document.getElementById("name").value);})();</script></body></html>
一句話：“$(function(){ });”用於存放操作DOM對象的代碼，執行其中代碼時DOM對象已存在；“(function(){})(jQuery);”用於存放開發外掛程式的代碼，執行其中代碼時DOM不一定存在。
1 首先(function(){})()這種寫法 是建立了一個匿名的方法並立即執行（function(){})這個是匿名方法後面的括弧就是立即調用了這個方法）。
這樣做可以建立一個範圍以保證內部變數與外部變數不發生衝突，比如$ jQuery 等jquery內部定義的變數。
2 (function($){})(jQuery) 這個寫法主要的作用還是保證jquery不與其他類庫或變數有衝突 首先是要保證jQuery這個變數名與外部沒有衝突（jquery內部$與jQuery是同一個東西 有兩個名字的原因就是怕$與其他變數名有衝突二jQuery與其他變數衝突的幾率非常小）並傳入匿名對象，匿名對象給參數起名叫做$(其實和jquery內部是一樣的) 然後你就可以自由的在(function($){})(jQuery)裡寫你的外掛程式而不需要考慮與外界變數是否存在衝突
jquery (function(a){})(jQuery);
這是一個匿名函數被執行了，他的實參是jQuery對象。
相當於：
function test(a){}
test(jQuery);
上面這種寫法，一般是為了保護本地變數不被外部變數汙染。寫自己的js庫的時候，不妨也這樣寫：
(function(w){
//這裡面就可以寫的你js公用庫了
var my_func = function(){}
w.my_func = my_func;//要把函數引用賦給頂級對象window，不然外部調用不了了。
})(window);
Start building with 50+ products and up to 12 months usage for Elastic Compute Service
1 on 1 presale consultation
24/7 Technical Support 6 Free Tickets per Quarter Faster Response
Alibaba Cloud offers highly flexible support services tailored to meet your exact needs.
A comprehensive suite of global cloud computing services to power your business
Payment Methods We Support
