網(wǎng)友解答: 其實，這個問題去看jquery源碼就能很清楚的知道了，從樓主的問題說明里面只是明白了jquery的方法擴(kuò)展方式，但并沒有真正理解其主要架構(gòu)方式；我下面所說的都是基于2.0.3

其實，這個問題去看jquery源碼就能很清楚的知道了，從樓主的問題說明里面只是明白了jquery的方法擴(kuò)展方式，但并沒有真正理解其主要架構(gòu)方式；

我下面所說的都是基于2.0.3版本jquery源碼進(jìn)行說明，首先，描述中有幾個錯誤需要指正下：

第一，在jquery中，$('xxx').xxxx()這種寫法，其實是通過jQuery.fn.extend({xxx: function() {}})的方式進(jìn)行方法綁定和擴(kuò)展的，而$.xxx()這種方式的方法是通過jQuery.extend({xxx: function() {}})的方式進(jìn)行方法綁定和擴(kuò)展的；如下圖，$.ajax通過下圖綁定：

而$('xxxx').attr()則通過下面方式：

第二，console.log(jQuery()) 其實是個對象，

console.log(jQuery('#test'))，如果有此元素存在，看起來像數(shù)組，如下圖，其實也是對象，這種叫“類數(shù)組”；可以百度去看下類數(shù)組相關(guān)知識；

好，下面開始說下樓主的兩個問題，第一是extend的實現(xiàn)方法；第二是jquery為什么能同時支持$.xxx()與$().xxx()這兩種寫法；

第一，extend的實現(xiàn)方法；由于源碼較多，我在這兒就不直接展示出來了，有興趣可以去找到看看；其實簡單講，extend主要用于對象的合并，如下圖；

但是從源碼可以看出，當(dāng)參數(shù)只有一個對象的時候，就是直接將傳入對象合并到調(diào)用的對象上 (即jquery或jquery.fn);

所以，當(dāng)調(diào)用jQuery.extend時，就會將傳入的對象里面的方法合并寫入到j(luò)Query對象上面，就可以對其進(jìn)行擴(kuò)展; 同理，使用jQuery.fn.extend時，就可以對jQuery.fn進(jìn)行擴(kuò)展；

第二，$.xxx()與$().xxx()兩種的區(qū)別；第一種$.xxx()其實是調(diào)用的jQuery對象上面的方法，也就是通過jQuery.extend進(jìn)行擴(kuò)展的方法；有人會說，jQuery是一個函數(shù)，但是函數(shù)在js也是對象，也可以向其添加屬性和方法；而第二種$().xxx()則是調(diào)用的jQuery.fn對象上面的方法，也就是通過jQuery.fn.extend進(jìn)行擴(kuò)展的方法；

第一種通過jQuery.extend進(jìn)行擴(kuò)展的屬性和方法是直接寫入jQuery對象，所以也就可以直接通過$.xxx()的方式調(diào)用，這個很容易理解；

第二種，通過jQuery.fn.extend進(jìn)行擴(kuò)展的方法和屬性為何能夠通過$().xxx()進(jìn)行調(diào)用呢；這個就要從jQuery的整個架構(gòu)來說；當(dāng)執(zhí)行$()時，訪問了下圖代碼：可以看出，其實是實例化了一個jQuery.fn.init的對象；在這我們就不再討論jQuery.fn.init里面具體干了什么，但可以通過源碼可以看出，其最終執(zhí)行了“return this”，也就是返回了jQuery.fn.init的實例對象；那如何通過$()可以訪問到j(luò)Query.fn上面的屬性和方法呢？就是通過下圖這句代碼：

它將jQuery.fn賦給了jQuery.fn.init.prototype，所以，jQuery.fn.init的實例對象也就可以直接訪問jQuery.fn上面的方法和屬性了；所以，當(dāng)你通過$().xxx()時，其實訪問了jQuery.fn.xxx()方法;