jQuery 的原型關系圖，整體把握jQuery

        若干個月前，在博客園中看到 一篇文章，內容很簡單，就是一幅圖，展示的是 jQuery 中各對象之間的關系，當時就覺得，這就是我想要的最直觀的總結 jQuery 的方式。在那篇文章中，也有很多人表示不解，說看不明白。這里我也重畫了一幅，並逐一解釋。附件提供了 visio 格式的文件。 



        下面將結合 jQuery 源碼，對上圖的各個部分逐一解釋。在圖中，圓圈數字代表的是 jQuery 源碼的位置，圓圈數字一樣的位置表明這幾個地方出自同塊(block)代碼。 

/**
 * ① 何為 jQuery？
 *
 * window 是對象，它有兩個屬性，分別為 jQuery 和 $，其值是一函數，此函數的名字是 jQuery。在函數
 * 的定義實體中，其實是通過 jQuery.fn.init 函數來構造對象的，init 函數才是真正的構造函數。也就是說，
 * 我們通過 ${ ... ) 得到的其實就是 jQuery.fn.init 的實例。
 */
var jQuery = window.jQuery = window.$ = function( selector, context ) {
    // The jQuery object is actually just the init constructor 'enhanced'
    return new jQuery.fn.init( selector, context );
};

/**
 * ② 所謂的 jQuery 的體魄
 *
 * jQuery 函數有兩個屬性，分別為 fn 和 prototype，其值是一匿名對象(json 對象)。
 */
jQuery.fn = jQuery.prototype = {
    init: function( selector, context ) {
        ...
    },

    jquery: "1.2.6",

    get: function( num ) {
        ...
    },

    ...
}

/**
 * ③ 賦予 jQuery 力量吧
 *
 * 這段代碼別看就一句話，很短，不是嗎？但這段代碼是非常重要的。
 *
 * 首先，init 只是一個函數，通過 jQuery.fn.init 構造出來的對象，只是 jQuery.fn.init 的實例而已，
 * jQuery.fn 之前也說了，它是一匿名的 json 對象，包含 init 等等函數，我們想讓 jQuery.fn.init 構造
 * 出來的對象具備很多行為的話，prototype 就是最好的手段之一。假設我們定義一個 function，名字叫做 Car
 * 吧，使用 prototype 為其添加行為的方式我們很熟悉吧：
 * function Car(owner) {
 *   this.owner = owner;
 * }
 * Car.prototype = {
 *   go: function() { ... }
 *   brake: function() { ... }
 * }
 * 這樣，通過 new Car() 構造出來的對象就具備了 go 和 brake 行為。
 *
 * 因此，就因為下面的一句話，被 init 構造出來的對象就具備了 jQuery.fn 所定義的所有行為了，很帥吧！
 */
// Give the init function the jQuery prototype for later instantiation
jQuery.fn.init.prototype = jQuery.fn;

/**
 * ④ 給我擴展的自由好嗎
 *
 * 誠然，jQuery 或 jQuery.fn 定義的 function 你有可能會覺得不夠用，沒關系，John Resig 為我們提供了
 * 擴展的空間。jQuery 和 jQuery.fn 都有一個名字為 extend 的屬性，該屬性的類型就是一個 function，
 * 這個 function 本身就已經為我們提供了擴展功能。
 *
 * extend 屬性所代表的 function，不過 50 行代碼，寫的太精辟了，有時間的話，大家可以一步一步的調試下，
 * 見識下 John Resig 的神功～
 */
jQuery.extend = jQuery.fn.extend = function() {
    ......
}

         整個 jQuery 的核心內容就是以上四塊代碼，諸如事件處理的代碼，你都可以從以上四塊代碼找到影子。Enjoy jQuery～

• jQuery_的原型關系圖.rar (181 KB)