這篇文章可以說是讀這篇文章這篇文章後的總結。
jquery最基本的構成結構:
var jquery = window.jquery = window.$ = function(a,b);
jquery.fn = jquery.prototype = ,
age: function ()
};jquery.fn.init.prototype = jquery.fn; // 3
jquery.extend = jquery.fn.extend = function ()
這是jquery原始碼乙個最基本的概要實現,但從這個實現中已經能弄並學到很多東西了。
( 1 ) 首先$
也就是jquery
本身是乙個函式, 但它又不是乙個普通的建構函式,這從$('div')
的這種例項直接產生不需要new
就可以知道,也就是它隱藏了例項new
的過程,jquery
自身只是乙個工廠函式,它產出由它的原型上定義的init
方法的例項,因為擁有了new
的過程,所以例項化中的this
都是指向了 最終產生的例項本身,於是這樣便實現了無new構建。
( 2 ) 這裡在init
函式中有乙個return this;
的操作,一般建構函式不會這樣寫,但這樣寫並不會影響 new 的結果,這參照之前new 的分解,便可以推出結果的一致( 只是返回了不同但值相同的變數 )。而jquery之所以在這裡要返回this
是有用處的,這樣最開始例項的this
便得以儲存,$('div').ready()
這樣的鏈式呼叫便能得到前方的例項物件,也就是說就是return this;
實現了鏈式呼叫。
( 3 ) 那既然是原型上的init
構造器方法構建的例項,又怎麼能獲取到jquery
的原型方法呢,這就需要將 init 方法的原型用jquery
的原型物件覆蓋。也就是 3 部分的操作。
( 4 ) 最後$.extend
與$.fn.extend
之所以會不一樣,只是呼叫時分別是jquery
物件或jquery.prototype
(jquery.prototype = jquery.fn)導致了this
的不同,實際定義是是用的同乙個函式。
jQuery原始碼分析
工具 版本說明 版本號備註 jquery 2.1.1 sublime 3jquery function selector,context jquery.fn jquery.prototype 快速匹配正則 不加g 不光匹配整體項還會匹配到子項 rquickexpr s w w w init jque...
jQuery原始碼分析
一 jquery如何做到不汙染變數名並暴露出 供使用者使用 jquery將變數和 寫進立即執行函式,通過函式來包裹所有的變數和方法,再在這個立即執行函式上將 jquery方法繫結到window上,就可以讓使用者使用到jq方法了。二 jquery是如何做到 jquery 的?function wind...
jquery原始碼分析2
jquery原始碼分析系列2 results is for internal usage only 只是為了內部使用 makearray function arr,results else return ret 很多地方都使用了這個函式 判斷是否是陣列或者是類陣列 返回值是boolean funct...