jQuery来源学习笔记：扩展的实用功能

// 扩展的实用功能
jQuery.extend({
    // http://www.w3school.com.cn/jquery/core_noconflict.asp
    // 释放$的 jQuery 控制权
    // 很多 JavaScript 库使用 $ 作为函数或变量名，jQuery 也一样。
    // 在 jQuery 中，$ 仅仅是 jQuery 的别名，因此即使不使用 $ 也能保证全部功能性。
    // 假如我们须要使用 jQuery 之外的还有一 JavaScript 库，我们能够通过调用 $.noConflict() 向该库返回控制权。       // 通过向该方法传递參数 true，我们能够将 $ 和 jQuery 的控制权都交还给还有一JavaScript库。    noConflict: function( deep ) {       // 交出$的控制权       if ( window.$ === jQuery ) {           window.$ = _$;       }       // 交出jQuery的控制权       if ( deep && window.jQuery === jQuery ) {           window.jQuery = _jQuery;       }          return jQuery;    },       // Is the DOM ready to be used?
 Set to true once it occurs.    isReady: false,       // A counter to track how many items to wait for before    // the ready event fires. See #6781    // 一个计数器，用于跟踪在ready事件出发前的等待次数    readyWait: 1,       // Hold (or release) the ready event    // 继续等待或触发    holdReady: function( hold ) {       if ( hold ) {           jQuery.readyWait++;       } else {           jQuery.ready( true );       }    },       // Handle when the DOM is ready    // 文档载入完成句柄    // http://www.cnblogs.com/fjzhou/archive/2011/05/31/jquery-source-4.html    ready: function( wait ) {       // Either a released hold or an DOMready/load event and not yet ready       //       if ( (wait === true && !--jQuery.readyWait) || (wait !== true && !jQuery.isReady) ) {           // Make sure body exists, at least, in case IE gets a little overzealous (ticket #5443).           // 确保document.body存在           if ( !document.body ) {              return setTimeout( jQuery.ready, 1 );           }              // Remember that the DOM is ready           jQuery.isReady = true;              // If a normal DOM Ready event fired, decrement, and wait if need be           if ( wait !== true && --jQuery.readyWait > 0 ) {              return;           }              // If there are functions bound, to execute           readyList.resolveWith( document, [ jQuery ] );              // Trigger any bound ready events           if ( jQuery.fn.trigger ) {              jQuery( document ).trigger( "ready" ).unbind( "ready" );           }       }    },       // 初始化readyList事件处理函数队列    // 兼容不同浏览对绑定事件的差别    bindReady: function() {       if ( readyList ) {           return;       }          readyList = jQuery._Deferred();          // Catch cases where $(document).ready() is called after the       // browser event has already occurred.       if ( document.readyState === "complete" ) {           // Handle it asynchronously to allow scripts the opportunity to delay ready           return setTimeout( jQuery.ready, 1 );       }          // Mozilla, Opera and webkit nightlies currently support this event       // 兼容事件，通过检測浏览器的功能特性。而非嗅探浏览器       if ( document.addEventListener ) {           // Use the handy event callback           // 使用较快的载入完成事件           document.addEventListener( "DOMContentLoaded", DOMContentLoaded, false );              // A fallback to window.onload, that will always work           // 注冊window.onload回调函数           window.addEventListener( "load", jQuery.ready, false );          // If IE event model is used       } else if ( document.attachEvent ) {           // ensure firing before onload,           // maybe late but safe also for iframes           // 确保在onload之前触发onreadystatechange，可能慢一些可是对iframes更安全           document.attachEvent( "onreadystatechange", DOMContentLoaded );              // A fallback to window.onload, that will always work           // 注冊window.onload回调函数           window.attachEvent( "onload", jQuery.ready );              // If IE and not a frame           // continually check to see if the document is ready           var toplevel = false;              try {              toplevel = window.frameElement == null;           } catch(e) {}              if ( document.documentElement.doScroll && toplevel ) {              doScrollCheck();           }       }    },       // See test/unit/core.js for details concerning isFunction.    // Since version 1.3, DOM methods and functions like alert    // aren't supported. They return false on IE (#2968).    // 是否函数    isFunction: function( obj ) {       return jQuery.type(obj) === "function";    },       // 是否数组    // 假设浏览器有内置的 Array.isArray 实现，就使用浏览器自身的实现方式，    // 否则将对象转为String。看是否为"[object Array]"。    isArray: Array.isArray || function( obj ) {       return jQuery.type(obj) === "array";    },       // A crude way of determining if an object is a window    // 简单的推断（推断setInterval属性）是否window对象    isWindow: function( obj ) {       return obj && typeof obj === "object" && "setInterval" in obj;    },       // 是否是保留字NaN    isNaN: function( obj ) {       // 等于null 或 不是数字 或调用window.isNaN推断       return obj == null || !rdigit.test( obj ) || isNaN( obj );    },    // 获取对象的类型    type: function( obj ) {       // 通过核心API创建一个对象。不须要newkeyword       // 普通函数不行       // 调用Object.prototype.toString方法，生成 "[object Xxx]"格式的字符串       // class2type[ "[object " + name + "]" ] = name.toLowerCase();       return obj == null ?           String( obj ) :           class2type[ toString.call(obj) ] || "object";    },       // 检查obj是否是一个纯粹的对象（通过"{}" 或 "new Object"创建的对象）    // console.info( $.isPlainObject( {} ) ); // true    // console.info( $.isPlainObject( '' ) ); // false    // console.info( $.isPlainObject( document.location ) ); // true    // console.info( $.isPlainObject( document ) ); // false    // console.info( $.isPlainObject( new Date() ) ); // false    // console.info( $.isPlainObject( ) ); // false       // isPlainObject分析与重构 http://www.jb51.net/article/25047.htm    // 对jQuery.isPlainObject()的理解 http://www.cnblogs.com/phpmix/articles/1733599.html    isPlainObject: function( obj ) {       // Must be an Object.       // Because of IE, we also have to check the presence of the constructor property.       // Make sure that DOM nodes and window objects don't pass through, as well       // 必须是一个对象       // 由于在IE8中会抛出非法指针异常，必须检查constructor属性       // DOM节点和window对象，返回false             // obj不存在 或 非object类型 或 DOM节点 或 widnow对象。直接返回false       // 測试下面三中可能的情况：       // jQuery.type(obj) !== "object" 类型不是object，忽略       // obj.nodeType 觉得DOM节点不是纯对象       // jQuery.isWindow( obj ) 觉得window不是纯对象       if ( !obj || jQuery.type(obj) !== "object" || obj.nodeType || jQuery.isWindow( obj ) ) {           return false;       }          // Not own constructor property must be Object       // 測试constructor属性       // 具有构造函数constructor，却不是自身的属性（即通过prototype继承的），       if ( obj.constructor &&           !hasOwn.call(obj, "constructor") &&           !hasOwn.call(obj.constructor.prototype, "isPrototypeOf") ) {           return false;       }          // Own properties are enumerated firstly, so to speed up,       // if last one is own, then all properties are own.          var key;       for ( key in obj ) {}       // key === undefined及不存在不论什么属性，觉得是简单的纯对象       // hasOwn.call( obj, key ) 属性key不为空。且属性key的对象自身的（即不是通过prototype继承的）       return key === undefined || hasOwn.call( obj, key );    },    // 是否空对象    isEmptyObject: function( obj ) {       for ( var name in obj ) {           return false;       }       return true;    },    // 抛出一个异常    error: function( msg ) {       throw msg;    },    // 解析JSON    // parseJSON把一个字符串变成JSON对象。    // 我们一般使用的是eval。
parseJSON封装了这个操作。可是eval被当作了最后手段。    // 由于最新JavaScript标准中加入了JSON序列化和反序列化的API。    // 假设浏览器支持这个标准。则这两个API是在JS引擎中用Native Code实现的。效率肯定比eval高非常多。
    // 眼下来看。Chrome和Firefox4都支持这个API。    parseJSON: function( data ) {       if ( typeof data !== "string" || !data ) {           return null;       }          // Make sure leading/trailing whitespace is removed (IE can't handle it)       data = jQuery.trim( data );          // Attempt to parse using the native JSON parser first       // 原生JSON API。
反序列化是JSON.stringify(object)       if ( window.JSON && window.JSON.parse ) {           return window.JSON.parse( data );       }          // Make sure the incoming data is actual JSON       // Logic borrowed from http://json.org/json2.js       // ... 大致地检查一下字符串合法性       if ( rvalidchars.test( data.replace( rvalidescape, "@" )           .replace( rvalidtokens, "]" )           .replace( rvalidbraces, "")) ) {              return (new Function( "return " + data ))();          }       jQuery.error( "Invalid JSON: " + data );    },       // Cross-browser xml parsing    // (xml & tmp used internally)    // 解析XML 跨浏览器    // parseXML函数也主要是标准API和IE的封装。    // 标准API是DOMParser对象。    // 而IE使用的是Microsoft.XMLDOM的 ActiveXObject对象。    parseXML: function( data , xml , tmp ) {          if ( window.DOMParser ) { // Standard 标准XML解析器           tmp = new DOMParser();           xml = tmp.parseFromString( data , "text/xml" );       } else { // IE IE的XML解析器           xml = new ActiveXObject( "Microsoft.XMLDOM" );           xml.async = "false";           xml.loadXML( data );       }          tmp = xml.documentElement;          if ( ! tmp || ! tmp.nodeName || tmp.nodeName === "parsererror" ) {           jQuery.error( "Invalid XML: " + data );       }          return xml;    },    // 无操作函数    noop: function() {},       // Evaluates a script in a global context    // Workarounds based on findings by Jim Driscoll    // http://weblogs.java.net/blog/driscoll/archive/2009/09/08/eval-javascript-global-context    // globalEval函数把一段脚本载入到全局context（window）中。
    // IE中能够使用window.execScript。
    // 其它浏览器 须要使用eval。    // 由于整个jQuery代码都是一整个匿名函数，所以当前context是jQuery。假设要将上下文设置为window则需使用globalEval。    globalEval: function( data ) {       // data非空       if ( data && rnotwhite.test( data ) ) {           // We use execScript on Internet Explorer           // We use an anonymous function so that context is window           // rather than jQuery in Firefox           ( window.execScript || function( data ) {              window[ "eval" ].call( window, data );           } )( data );       }    },    // 推断节点名称是否同样    nodeName: function( elem, name ) {       // 忽略大写和小写       return elem.nodeName && elem.nodeName.toUpperCase() === name.toUpperCase();    },       // args is for internal usage only    // 遍历对象或数组    each: function( object, callback, args ) {       var name, i = 0,           length = object.length,           isObj = length === undefined || jQuery.isFunction( object );       // 假设有參数args。调用apply。上下文设置为当前遍历到的对象。參数使用args       if ( args ) {           if ( isObj ) {              for ( name in object ) {                  if ( callback.apply( object[ name ], args ) === false ) {                     break;                  }              }           } else {              for ( ; i < length; ) {                  if ( callback.apply( object[ i++ ], args ) === false ) {                     break;                  }              }           }          // A special, fast, case for the most common use of each       // 没有參数args则调用。则调用call，上下文设置为当前遍历到的对象，參数设置为key/index和value       } else {           if ( isObj ) {              for ( name in object ) {                  if ( callback.call( object[ name ], name, object[ name ] ) === false ) {                     break;                  }              }           } else {              for ( ; i < length; ) {                  if ( callback.call( object[ i ], i, object[ i++ ] ) === false ) {                     break;                  }              }           }       }          return object;    },       // Use native String.trim function wherever possible    // 尽可能的使用本地String.trim方法，否则先过滤开头的空格，再过滤结尾的空格    trim: trim ?       function( text ) {           return text == null ?
              "" :              trim.call( text );       } :          // Otherwise use our own trimming functionality       function( text ) {           return text == null ?              "" :              text.toString().replace( trimLeft, "" ).replace( trimRight, "" );       },       // results is for internal usage only    // 将伪数组转换为数组    makeArray: function( array, results ) {       var ret = results || [];          if ( array != null ) {           // The window, strings (and functions) also have 'length'           // The extra typeof function check is to prevent crashes           // in Safari 2 (See: #3039)           // Tweaked logic slightly to handle Blackberry 4.7 RegExp issues #6930           // 一大堆浏览器兼容性測试，真实蛋疼           var type = jQuery.type( array );           // 測试：有没有length属性、字符串、函数、正则           // 不是数组。连伪数组都不是           if ( array.length == null                  || type === "string"                  || type === "function"                  || type === "regexp"                  || jQuery.isWindow( array ) ) {              push.call( ret, array );           } else {              // $.type( $('div') ) // object              jQuery.merge( ret, array );           }       }          return ret;    },    //    inArray: function( elem, array ) {       // 是否有本地化的Array.prototype.indexOf       if ( indexOf ) {           // 直接调用Array.prototype.indexOf           return indexOf.call( array, elem );       }       // 遍历数组。查找是否有全然相等的元素。并返回下标       // 循环的小技巧：把array.length存放到length变量中，能够降低一次作用域查找       for ( var i = 0, length = array.length; i < length; i++ ) {           if ( array[ i ] === elem ) {              return i;           }       }       // 假设返回-1，则表示不在数组中       return -1;    },    // 将数组second合并到数组first中    merge: function( first, second ) {       var i = first.length, //           j = 0;             // 假设second的length属性是Number类型，则把second当数组处理       if ( typeof second.length === "number" ) {           for ( var l = second.length; j < l; j++ ) {              first[ i++ ] = second[ j ];           }          } else {           // 遍历second。将非undefined的值加入到first中           while ( second[j] !== undefined ) {              first[ i++ ] = second[ j++ ];           }       }       // 修正first的length属性。由于first可能不是真正的数组        first.length = i;          return first;    },    // 过滤数组，返回新数组；callback返回true时保留；假设inv为true。callback返回false才会保留    grep: function( elems, callback, inv ) {       var ret = [], retVal;       inv = !!inv;          // Go through the array, only saving the items       // that pass the validator function       // 遍历数组，仅仅保留通过验证函数callback的元素       for ( var i = 0, length = elems.length; i < length; i++ ) {           // 这里callback的參数列表为：value, index，与each的习惯一致           retVal = !!callback( elems[ i ], i );           // 是否反向选择           if ( inv !== retVal ) {              ret.push( elems[ i ] );           }       }          return ret;    },       // arg is for internal usage only    // 将数组或对象elems的元素/属性。转化成新的数组    map: function( elems, callback, arg ) {       var value, key, ret = [],           i = 0,           length = elems.length,           // jquery objects are treated as arrays           // 检測elems是否是（伪）数组           // 1. 将jQuery对象也当成数组处理           // 2. 检測length属性是否存在，length等于0，或第一个和最后一个元素是否存在，或jQuery.isArray返回true           isArray = elems instanceof jQuery              || length !== undefined && typeof length === "number"                  && ( ( length > 0 && elems[ 0 ] && elems[ length -1 ] ) || length === 0 || jQuery.isArray( elems ) ) ;             // 是数组或对象的差别，仅仅是遍历的方式不同，没有其它的差别             // Go through the array, translating each of the items to their       // 遍历数组。对每个元素调用callback，将返回值不为null的值。存入ret       if ( isArray ) {           for ( ; i < length; i++ ) {              // 运行callback，參数依次为value, index, arg              value = callback( elems[ i ], i, arg );              // 假设返回null，则忽略（无返回值的function会返回undefined）              if ( value != null ) {                  ret[ ret.length ] = value;              }           }          // Go through every key on the object,       // 遍历对象，对每个属性调用callback，将返回值不为null的值，存入ret       } else {           for ( key in elems ) {              // 运行callback，參数依次为value, key, arg              value = callback( elems[ key ], key, arg );              // 同上              if ( value != null ) {                  ret[ ret.length ] = value;              }           }       }          // Flatten any nested arrays       // 使嵌套数组变平       // concat：       // 假设某一项为数组，那么加入其内容到末尾。
       // 假设该项目不是数组，就将其作为单个的数组元素加入到数组的末尾。       return ret.concat.apply( [], ret );    },       // A global GUID counter for objects    guid: 1,       // Bind a function to a context, optionally partially applying any    // arguments.    // 代理方法：为fn指定上下文（即this）    // jQuery.proxy( function, context )    // jQuery.proxy( context, name )    proxy: function( fn, context ) {       // 假设context是字符串，设置上下文为fn。fn为fn[ context ]       // 即设置fn的context方法的上下文为fn（默认不是这样吗？？？TODO）       if ( typeof context === "string" ) {           var tmp = fn[ context ];           context = fn;           fn = tmp;       }          // Quick check to determine if target is callable, in the spec       // this throws a TypeError, but we will just return undefined.       // 高速測试fn是否是可调用的（即函数），在文档说明中，会抛出一个TypeError，       // 可是这里仅返回undefined       if ( !jQuery.isFunction( fn ) ) {           return undefined;       }          // Simulated bind       var args = slice.call( arguments, 2 ), // 从參数列表中去掉fn,context           proxy = function() {              // 设置上下文为context和參数              return fn.apply( context, args.concat( slice.call( arguments ) ) );           };          // Set the guid of unique handler to the same of original handler, so it can be removed       // 统一guid。使得proxy能够被移除       proxy.guid = fn.guid = fn.guid || proxy.guid || jQuery.guid++;          return proxy;    },       // Mutifunctional method to get and set values to a collection    // The value/s can be optionally by executed if its a function    // 多功能函数，读取或设置集合的属性值；值为函数时会被运行    // fn：jQuery.fn.css, jQuery.fn.attr, jQuery.fn.prop    access: function( elems, key, value, exec, fn, pass ) {       var length = elems.length;          // Setting many attributes       // 假设有多个属性，则迭代       if ( typeof key === "object" ) {           for ( var k in key ) {              jQuery.access( elems, k, key[k], exec, fn, value );           }           return elems;       }          // Setting one attribute       // 仅仅设置一个属性       if ( value !== undefined ) {           // Optionally, function values get executed if exec is true           exec = !pass && exec && jQuery.isFunction(value);              for ( var i = 0; i < length; i++ ) {              fn( elems[i], key, exec ? value.call( elems[i], i, fn( elems[i], key ) ) : value, pass );           }              return elems;       }          // Getting an attribute       // 读取属性       return length ? fn( elems[0], key ) : undefined;    },    // 获取当前时间的便捷函数    now: function() {       return (new Date()).getTime();    },       // Use of jQuery.browser is frowned upon.    // More details: http://docs.jquery.com/Utilities/jQuery.browser    // 不赞成使用jQuery.browser，推荐使用jQuery.support    // Navigator 正在使用的浏览器的信息    // Navigator.userAgent 一个仅仅读的字符串，声明了浏览器用于HTPP请求的用户代理头的值    uaMatch: function( ua ) {       ua = ua.toLowerCase();       // 依次匹配各浏览器       var match = rwebkit.exec( ua ) ||           ropera.exec( ua ) ||           rmsie.exec( ua ) ||           ua.indexOf("compatible") < 0 && rmozilla.exec( ua ) ||           [];       // match[1] || ""       // match[1]为false（空字符串、null、undefined、0等）时。默觉得""       // match[2] || "0"       // match[2]为false（空字符串、null、undefined、0等）时，默觉得"0"       return { browser: match[1] || "", version: match[2] || "0" };    },    // 创建一个新的jQuery副本。副本的属性和方法能够被改变，可是不会影响原始的jQuery对象    // 有两种使用方法：    // 1. 覆盖jQuery的方法，而不破坏原始的方法    // 2.封装，避免命名空间冲突，能够用来开发jQuery插件    // 值得注意的是，jQuery.sub()函数并不提供真正的隔离，全部的属性、方法依旧指向原始的jQuery    // 假设使用这种方法来开发插件。建议优先考虑jQuery UI widgetproject    sub: function() {       function jQuerySub( selector, context ) {           return new jQuerySub.fn.init( selector, context );       }       jQuery.extend( true, jQuerySub, this ); // 深度拷贝，将jQuery的全部属性和方法复制到jQuerySub       jQuerySub.superclass = this;       jQuerySub.fn = jQuerySub.prototype = this(); //       jQuerySub.fn.constructor = jQuerySub;       jQuerySub.sub = this.sub;       jQuerySub.fn.init = function init( selector, context ) {           if ( context && context instanceof jQuery && !(context instanceof jQuerySub) ) {              context = jQuerySub( context );           }              return jQuery.fn.init.call( this, selector, context, rootjQuerySub );       };       jQuerySub.fn.init.prototype = jQuerySub.fn;       var rootjQuerySub = jQuerySub(document);       return jQuerySub;    },    // 浏览器类型和版本号：    // $.browser.msie/mozilla/webkit/opera    // $.browser.version    // 不推荐嗅探器浏览器类型jQuery.browser，相反，它会检查浏览器的功能jQuery.support    // 未来jQuery.browser你可以移动到一个插件    browser: {}});