您的位置:首页 > Web前端 > JQuery

jquery源码分析二 21-94行源码解析

2015-01-03 17:26 344 查看
//21-94 行源码分析

(function(window, undefined){

}(window)

这样写法的好处:

1.jquery这样设计第一个把window作为参数传递过来,

javascript查找是一层一层向上查找,里面大量用到了window对象,

如果查找多次影响性能,故作为参数,减少浏览器花时间去查找.

2.方便压缩版压缩,压缩版本的写法

(function(e, undefined){

})(window)

由此可见传递window,把window用参数e接收,可以进行压缩

类似于var e = window;

以后我们自定义内部对象也可以参照写

(function(Person, Man){})(Person, Man)//当然后面还需要自己挂载,这先不介绍,我也是刚开始研究的.可以自己扩展下

3.防止undefined被重写,有的版本如果写undefied = 10 ,那undefined失去了他本来的意义,变成10了,这是错误的

//下面正式从21行开始介绍

var

// A central reference to the root jQuery(document)

//类似于把$(document)=jQuery(document)用变量rootjQuery接收,好处就是增强代码的维护性

rootjQuery,//866行 rootjQuery = jQuery(document);

// The deferred used on DOM ready

//Deferred对象到后面再详细介绍下,我也正在研究这部分

readyList,//822行 readyList = jQuery.Deferred();

// Support: IE9

// For `typeof xmlNode.method` instead of `xmlNode.method !== undefined`

//2.0的js对老版本ie678不在支持了,从ie9开始

/*我们经常会碰到 if(a == undefinded){}这样的写法在有的版本是不支持的,

而typeof a == 'undefined' 这是在各个浏览器都兼容的
*/

core_strundefined = typeof undefined,//如果没有定义,则返回的是字符串'undefined'

// Use the correct document accordingly with window argument (sandbox)

location = window.location,

document = window.document,

docElem = document.documentElement,

// Map over jQuery in case of overwrite

_jQuery = window.jQuery,

// Map over the $ in case of overwrite

_$ = window.$,

// [[Class]] -> type pairs

class2type = {},

// List of deleted data cache ids, so we can reuse them

core_deletedIds = [],

core_version = "2.0.3",

// Save a reference to some core methods

core_concat = core_deletedIds.concat,

core_push = core_deletedIds.push,

core_slice = core_deletedIds.slice,

core_indexOf = core_deletedIds.indexOf,

core_toString = class2type.toString,

core_hasOwn = class2type.hasOwnProperty,

core_trim = core_version.trim,

// Define a local copy of jQuery

/*上面那些都是定义变量.

这个是jQuery的函数初始化

283行 jQuery.fn.init.prototype = jQuery.fn

把jquery原型对象覆盖了jquery.prototype.init.prototype即init构造器的原型对象

这样就可以调用jQuery原型上的方法啦.

下面是个例子:

var aQuery = function(selector, context) {

return new aQuery.prototype.init();

}

aQuery.prototype = {

init: function() {

return this;

},

name: function() {

return this.age

},

age: 20

}

aQuery.prototype.init.prototype = aQuery.prototype;

console.log(aQuery().name()) //20

这是从别的网站拷贝的,感觉比较容易理解点,读者体味下

*/

jQuery = function( selector, context ) {

// The jQuery object is actually just the init constructor 'enhanced'

return new jQuery.fn.init( selector, context, rootjQuery );

},

// Used for matching numbers 匹配数字 +=.eE(科学计数法)

core_pnum = /[+-]?(?:\d*\.|)\d+(?:[eE][+-]?\d+|)/.source,

// Used for splitting on whitespace 匹配空格, \S:空格

core_rnotwhite = /\S+/g,

// A simple way to check for HTML strings

// Prioritize #id over <tag> to avoid XSS via location.hash (#9521)

// Strict HTML recognition (#11290: must start with <)

/* 匹配两种:<p>aaa 标签|| #id */

rquickExpr = /^(?:\s*(<[\w\W]+>)[^>]*|#([\w-]*))$/,

// Match a standalone tag

/* 匹配空标签<p></p>,<div></div> */

rsingleTag = /^<(\w+)\s*\/?>(?:<\/\1>|)$/,

// Matches dashed string for camelizing

//css3 中特有如: margin-left : marginLeft ,ms-margin-left 则会 MsMarginLeft 就这个区别

rmsPrefix = /^-ms-/,

rdashAlpha = /-([\da-z])/gi,

// Used by jQuery.camelCase as callback to replace()

fcamelCase = function( all, letter ) {

return letter.toUpperCase();

},

// The ready event handler and self cleanup method

completed = function() {

document.removeEventListener( "DOMContentLoaded", completed, false );

window.removeEventListener( "load", completed, false );

jQuery.ready();

};
内容来自用户分享和网络整理,不保证内容的准确性,如有侵权内容,可联系管理员处理 点击这里给我发消息
标签: