jqeury源碼分析事件

/**
 * Created by dadawang on 2016/10/6.
 */
//自己寫的jquery
(function (window,undefiend) {
    //--------------------------jquery變量聲明------------------------------------------------
    var jQuery = function (selector,context) {
        return new jQuery.fn.init(selector,context);
    },
        _jQuery = window.jQuery,

        _$ = window.$,

        document = window.document;  //後面還有好多的變量



    //---------------------------jqeury方法 -------------------------------------------------------
    //沒寫出來的eq  first ready animated last not ....
    jQuery.fn = jQuery.prototype = {     //給jQuery增加一個fn對象
        init : function (selector, context) {
            var match,elem,ret,doc;
        },

        //--------------------jquery對象訪問-------
        selector:"",

        jquery:"1.4.2",   //jquery版本號

        length:0,

        each:function (callback,args) {
            return jQuery.each(this,callback,args);
        },

        size:function () {
            return this.length;
        },

        toArray:function () {
            return slice.call(this ,0);
        },

        get:function (num) {
            return num == null ?
                this.toArray():
                (num < 0 ? this.slice(num)[0] : this[num]);
        }

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

    //------------------------jquery插件開發----------
    //插件擴展jquery對象
    // jQuery(document);   //jquery.fn.init的實例
    // jQuery.trim();      //jquery的靜態方法
    // jQuery.newMethod = function () {};  //靜態方法
    // jQuery.newMethod();
    //
    // jQuery.fn.init.prototype.newMethod = function () {}; //這種涉及了jquery內部構造 要理解了才能添加 但是插件就不需要考慮內部結構 直接可以添加方法
    jQuery.extend = jQuery.fn.extend = function () {

        //這裏面是源碼
        /*
           *target被擴展的對象
           *length參數的數量
           *deep是否深度操作
           */
        var options, name, src, copy, copyIsArray, clone,
            target = arguments[0] || {},
            i = 1,
            length = arguments.length,
            deep = false;

        // target爲第一個參數,如果第一個參數是Boolean類型的值,則把target賦值給deep
        // deep表示是否進行深層面的複製,當爲true時,進行深度複製,否則只進行第一層擴展
        // 然後把第二個參數賦值給target
        if ( typeof target === "boolean" ) {
            deep = target;
            target = arguments[1] || {};

            // 將i賦值爲2,跳過前兩個參數
            i = 2;
        }

        // target既不是對象也不是函數則把target設置爲空對象。
        if ( typeof target !== "object" && !jQuery.isFunction(target) ) {
            target = {};
        }

        // 如果只有一個參數,則把jQuery對象賦值給target,即擴展到jQuery對象上
        if ( length === i ) {
            target = this;

            // i減1,指向被擴展對象
            --i;
        }

        // 開始遍歷需要被擴展到target上的參數

        for ( ; i < length; i++ ) {
            // 處理第i個被擴展的對象,即除去deep和target之外的對象
            if ( (options = arguments[ i ]) != null ) {
                // 遍歷第i個對象的所有可遍歷的屬性
                for ( name in options ) {
                    // 根據被擴展對象的鍵獲得目標對象相應值,並賦值給src
                    src = target[ name ];
                    // 得到被擴展對象的值
                    copy = options[ name ];

                    // 這裏爲什麼是比較target和copy?不應該是比較src和copy嗎?
                    if ( target === copy ) {
                        continue;
                    }

                    // 當用戶想要深度操作時,遞歸合併
                    // copy是純對象或者是數組
                    if ( deep && copy && ( jQuery.isPlainObject(copy) || (copyIsArray = jQuery.isArray(copy)) ) ) {
                        // 如果是數組
                        if ( copyIsArray ) {
                            // 將copyIsArray重新設置爲false,爲下次遍歷做準備。
                            copyIsArray = false;
                            // 判斷被擴展的對象中src是不是數組
                            clone = src && jQuery.isArray(src) ? src : [];
                        } else {
                            // 判斷被擴展的對象中src是不是純對象
                            clone = src && jQuery.isPlainObject(src) ? src : {};
                        }

                        // 遞歸調用extend方法,繼續進行深度遍歷
                        target[ name ] = jQuery.extend( deep, clone, copy );

                        // 如果不需要深度複製,則直接把copy(第i個被擴展對象中被遍歷的那個鍵的值)
                    } else if ( copy !== undefined ) {
                        target[ name ] = copy;
                    }
                }
            }
        }
        // 原對象被改變,因此如果不想改變原對象,target可傳入{}
        return target;
    }
    jQuery.extend({
        //------這裏不是noConflict聲明 他的聲明不在這裏 不知道是不是jquery裏-----------------
        noConflict:function (deep) {
            window.$ = _$;

            if(deep){
                window.jQuery = _jQuery;
            }

            return jQuery;
        },
        //--------------這裏也不是ready()的聲明 他的聲明在jquery裏--------------
        isReady:false,
        ready:function () {
            if(!jQuery.isReady){
                if(!document.body){
                    return setTimeout(jQuery.ready, 13);
                }

                jQuery.isReady = true;

                if(readyList){
                    var fn, i = 0;
                    while((fn = readyList[i++])){
                        fn.call(document, jQuery);
                    }
                    readyList = null;
                }

                if(jQuery.fn.triggerHandler){
                    jQuery(document).triggerHandler("ready");
                }
            }
        },
    });


    //---------------------------jQuery事件   綁定bind()  one()。。。------------------
    jQeury.each(["bind", "one"],function(i,name){
        //這裏面是源碼
    });
})(window);
發表評論
所有評論
還沒有人評論,想成為第一個評論的人麼? 請在上方評論欄輸入並且點擊發布.
相關文章