jQuery1.11源碼分析(6)-----jQuery結構總攬

(在看如下內容以前請先對原型鏈有必定的瞭解,好比:prototype是對象仍是函數?)javascript

在看jQuery的其餘源碼以前,必須對jQuery的數據結構有必定的瞭解。java

jQuery的核心很簡單,jQuery工廠函數和jQuery對象,其餘的都是各個功能模塊工具函數。數組

jQuery工廠函數主要有兩個做用,生成jQuery對象和充當其餘工具函數的命名空間(總不能把那些函數命名成全局函數來污染了全局變量吧)。數據結構

但jQuery工廠函數不是簡簡單單地直接new jQuery()來生成jQuery對象,而是採用以下的形式。函數

jQuery = function( selector, context ) {
		// The jQuery object is actually just the init constructor 'enhanced'
		// Need init if jQuery is called (just allow error to be thrown if not included)
		return new jQuery.fn.init( selector, context );
	},

上面的代碼是經過調用jQuery.fn.init來生成一個jQuery對象,此處的jQuery.fn和jQuery.prototype和jQuery.fn.init.prototype等價(後面會有賦值),因此也沒什麼特殊的,我暫時沒看出這麼寫的好處。工具

那麼生成的jQuery對象是什麼呢?其實就是一個數組,裏面存放着匹配經過調用Sizzle返回的各個DOM元素,而且給這個數組添加了兩個自定義屬性,selector和context,即這些DOM元素匹配的選擇符和上下文,你能夠試試$('body div').selector和$('body div').context。this

這就是jQuery工廠函數和jQuery對象的最簡形式。prototype

固然,jQuery工廠函數上還存放着各類工具函數,好比jQuery.extend,後續的大多數工具函數都要調用此函數來添加到jQuery工廠函數上。對象

之因此說這些函數是工具函數,是由於這些函數的功能不用考慮任何jQuery對象的結構,後面還有相應的業務函數,即須要考慮jQuery對象結構來實現功能的函數。ip

好比下面代碼中的each就是業務函數,最終是經過調用工具函數來實現功能的

each: function( callback, args ) {
		return jQuery.each( this, callback, args );
	},

如何區分工具函數仍是業務函數?一個簡單的標準就是,看這個函數的命名空間是jQuery仍是jQuery.fn,前者是工具函數,後者是業務函數

相關文章
相關標籤/搜索