快捷導(dǎo)航

jQuery總體架構(gòu)的理解分析

更新時(shí)間：2011年03月07日 09:27:48 作者：

jQuery總體架構(gòu)的理解,學(xué)習(xí)jquery的朋友可以參考下。

jQuery腳本總體結(jié)構(gòu)來說，有如下形式：

 
(function( window, undefined ) { 
// Define a local copy of jQueryvar jQuery = function( selector, context 
) { // The jQuery object is 
actually just the init constructor 
'enhanced' return new 
jQuery.fn.init( selector, context ); }, 
// Expose jQuery to the global objectwindow.jQuery = 
window.$ = jQuery; 
})(window); 

對(duì)這樣的結(jié)構(gòu)不很理解，也沒做深究，只知道和和所謂的

Technorati 標(biāo)簽: JQuery,Javascript,Web前端

js閉包的概念相關(guān)，今天查了一些資料，有了些基本的理解。
實(shí)際是定義了一個(gè)全局函數(shù)，前一個(gè)括號(hào)為一個(gè)匿名函數(shù)，后面為函數(shù)的調(diào)用?？梢赃@樣理解：

復(fù)制代碼代碼如下:

 
var fun=function(window, undefined){ 
... ... 
} 
fun(window); 

整個(gè)腳本是一個(gè)匿名函數(shù)(暫時(shí)叫它mainFn吧),函數(shù)被加載的時(shí)候便開始執(zhí)行,mainFn可以接收兩個(gè)參數(shù),執(zhí)行時(shí)只傳遞一個(gè)參數(shù)window.

1. 具體解釋下這個(gè)寫法的意思:
2. window 函數(shù)執(zhí)行時(shí)會(huì)傳入window,這個(gè)傳入的window是全局對(duì)象(通常為Window)的
3. 一個(gè)屬性且window=this,而傳入mainFn函數(shù)中作為其參數(shù)時(shí),它會(huì)被存儲(chǔ)在
4. mainFn的調(diào)用對(duì)象中.在原型鏈中查找變量的策略是(非嵌套函數(shù)):先查找調(diào)用
5. 對(duì)象,再查找全局對(duì)象,所以這使得整個(gè)mainFn中使用的window時(shí)查找效率更高
6. undefined 由于執(zhí)行時(shí)并未傳遞第二個(gè)參數(shù),故變量undefined的值為undefined.早期版
7. 本的瀏覽器中全局對(duì)象可能沒有undefined屬性,所以不能直接使用它.通常避免
8. 這個(gè)問題的寫法是 window.undefined = window.undefined

然后在最后讓jQuery庫中最重要的對(duì)象jQuery成為了window對(duì)象的一個(gè)屬性，并可以簡(jiǎn)寫為“$”。

其它的補(bǔ)充資料：
JQuery是個(gè)出色的javascript庫，最近結(jié)合它寫javascript，看了下源碼。
先從整體、全局的看，jQuery的源碼幾乎都在下面的代碼中：

復(fù)制代碼代碼如下:

 
(function() { 

//…… 

})();

第一個(gè)括號(hào)里面是個(gè)匿名函數(shù)，第二個(gè)括號(hào)表示馬上執(zhí)行第一個(gè)括號(hào)里面的代碼。
首先明白，javascript里面是沒有命名空間的，要保證你的javascript函數(shù)、對(duì)象與其他的不沖突，這里用了javascript的一個(gè)技巧：你的所有javascript函數(shù)、對(duì)象都在一個(gè)匿名函數(shù)里面定義，確保了所定義的函數(shù)、對(duì)象的有效范圍，起到了命名空間的作用。既然作用范圍在這個(gè)匿名函數(shù)中，怎么被別人使用呢?下面看它的下面代碼：

var jQuery = window.jQuery = function(selector, context) {
//……
};

這里讓jQuery庫中最重要的對(duì)象jQuery成為了window對(duì)象的一個(gè)屬性，這樣就可以在其他地方像使用 document(document也是window的一個(gè)屬性)一樣使用jQuery了。也許使用過jQuery的朋友驚訝－我沒有使用jQuery對(duì)象，一直使用$的。沒錯(cuò)，那是jQuery的同名對(duì)象：

window.$ = jQuery;

現(xiàn)在明白了吧。

這個(gè)庫的結(jié)構(gòu)是這樣的:

復(fù)制代碼代碼如下:

 
(function(window, undefined){ 
var document = window.document; 
var jQuery = ... 
... 
... 
})(window); 

(function(window, undefined){ var document = window.document; var jQuery = ... ... ... })(window); 

整個(gè)腳本是一個(gè)匿名函數(shù)(暫時(shí)叫它mainFn吧),函數(shù)被加載的時(shí)候便開始執(zhí)行,mainFn可以接收兩個(gè)參數(shù),執(zhí)行時(shí)只傳遞一個(gè)參數(shù)window.
1. 具體解釋下這個(gè)寫法的意思:
2. window 函數(shù)執(zhí)行時(shí)會(huì)傳入window,這個(gè)傳入的window是全局對(duì)象(通常為Window)的
3. 一個(gè)屬性且window=this,而傳入mainFn函數(shù)中作為其參數(shù)時(shí),它會(huì)被存儲(chǔ)在
4. mainFn的調(diào)用對(duì)象中.在原型鏈中查找變量的策略是(非嵌套函數(shù)):先查找調(diào)用
5. 對(duì)象,再查找全局對(duì)象,所以這使得整個(gè)mainFn中使用的window時(shí)查找效率更高
6. undefined 由于執(zhí)行時(shí)并未傳遞第二個(gè)參數(shù),故變量undefined的值為undefined.早期版
7. 本的瀏覽器中全局對(duì)象可能沒有undefined屬性,所以不能直接使用它.通常避免
8. 這個(gè)問題的寫法是 window.undefined = window.undefined

您可能感興趣的文章: