jq架構

(function(ROOT) {

        // 構造函數
        var jQuery = function(selector) {

            // 在jQuery中直接返回new過的實例，這裏的init是jQuery的真正構造函數
            return new jQuery.fn.init(selector)
        }

        jQuery.fn = jQuery.prototype = {
            constructor: jQuery,

            version: '1.0.0',

            init: function(selector) {
                // 在jquery中這裏有一個複雜的判斷，可是這裏我作了簡化
                var elem, selector;
                elem = document.querySelector(selector);
                this[0] = elem;

                // 在jquery中返回一個由全部原型屬性方法組成的數組，咱們這裏簡化，直接返回this便可
                // return jQuery.makeArray(selector, this);
                return this;
            },

            // 在原型上添加一堆方法
            toArray: function() {},
            get: function() {},
            each: function() {},
            ready: function() {},
            first: function() {},
            slice: function() {}
            // ... ...
        }

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

        // 實現jQuery的兩種擴展方式
        jQuery.extend = jQuery.fn.extend = function(options) {

            // 在jquery源碼中會根據參數不一樣進行不少判斷，咱們這裏就直接走一種方式，因此就不用判斷了
            var target = this;
            var copy;

            for(name in options) {
                copy = options[name];
                target[name] = copy;
            }
            return target;
        }

        // jQuery中利用上面實現的擴展機制，添加了許多方法，其中

        // 直接添加在構造函數上，被稱爲工具方法
        jQuery.extend({
            isFunction: function() {},
            type: function() {},
            parseHTML: function() {},
            parseJSON: function() {},
            ajax: function() {}
            // ...
        })

        // 添加到原型上
        jQuery.fn.extend({
            queue: function() {},
            promise: function() {},
            attr: function() {},
            prop: function() {},
            addClass: function() {},
            removeClass: function() {},
            val: function() {},
            css: function() {}
            // ...
        })

        // $符號的由來，實際上它就是jQuery，一個簡化的寫法，在這裏咱們還能夠替換成其餘可用字符
        ROOT.jQuery = ROOT.$ = jQuery;

    })(window);