[學習jquery]深入了解jquery(1)-jquery對象

題記： 使用了jquery時間有兩年了， 使用js也有3年了。 自認為略懂了一些， 不再是門外漢。 那麼我應該也寫寫部落格了， 系統地梳理一次學習過的知識。 溫故而知新嘛，也養成自己寫部落格的習慣，提高寫作水準， 為以後可能的轉型做準備。

一切從簡

$(document).ready(function () {      

var jqObj = $("div");      

});      

這裡的jqobj到底是一個什麼對象呢？firebug得到它是一個

這樣的對象。通過jqobj.constructor得到的是object而不是array。 那麼肯定它是一個僞數組。（什麼的僞數組？僞數組）。 好， 讓我們深入進去， 看看jquery到底傳回一個什麼對象。

下面是我從jquery中摘下來的簡略版的中心代碼：

(function () {      

var jquery = window.jquery = $ = window.$ = function (selector, context) {      

return new jquery.fn.init(selector, context);      

}      

$.prototype = jquery.fn = jquery.prototype = {      

init: function (selector, context) {      

if (selector.nodeType == 1) {      

this[0] = selector;      

this.length = 1;      

return this;      

}      

}      

}      

jquery.prototype.init.prototype = $.prototype;      

})();      

傳回的也是一個和jquery一樣的對象。 不過目前還沒有jquery那樣多的屬性和支援方法。我們來分解一下 $(“div”)這個動作.

執行到function (selector, context) {        return new jquery.fn.init(selector, context);     }. context為上下文, 不填的話jquery預設為document. 在此我們暫時忽略.return new jquery.fn.init(selector, context); 這樣我們可以初步得出結論. 傳回的是jquery.fn.init方法類的執行個體.

這時候, 我們疑問了. 因為jquery傳回回來的對象有很多的方法, 比如html(), each(),等等. 嗯. 關鍵在于

jQuery.fn.init.prototype = jQuery.fn;

這句話,相當于init類原型式繼承了jQuery類. 不過這裡不是完全繼承. 隻是擷取了jQuery的原型方法.

我們給jquery.prototype加上如下方法:

, css: function (cssjson) {      

for (var i = 0; i < this.length; i++) {      

for (var stylename in cssjson) {      

this[i].style[stylename] = cssjson[stylename];      

}      

}      

return this;      

}       

總結:

1. jquery對象是一個僞數組, 是jquery.fn.init類的執行個體.

2. jquery對象的成員是init類this的成員 + jquery.prototype成員

3. 通過jquery.fn.extend({……});擴充的成員.

參考資料http://www.cnblogs.com/snandy/category/285213.html

轉載于:https://www.cnblogs.com/jianjialin/archive/2011/06/10/2077859.html