jQuery源码学习笔记一

学习jQuery源码，我主要是通过妙味视频上学习的。这里将所有的源码分析，还有一些自己弄懂过程中的方法及示例整理出来，供大家参考。

我用的jquery v2.0.3版本。

var

   rootjQuery,

   readyList,

   core_strundefined = typeof undefined,

   location = window.location,

   document = window.document,

   docElem = document.documentElement,

   _jQuery = window.jQuery,

   _$ = window.$,

   class2type = {},

   core_deletedIds = [],

   core_version = "2.0.3",

   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,

   jQuery = function( selector, context ) {

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

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

   },

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

   // 匹配非空字符

   core_rnotwhite = /\S+/g,

   //匹配HTML标签或#id，例如<div>或#top

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

   // 匹配<p></p>类似的空标签

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

   // 匹配-ms-

   rmsPrefix = /^-ms-/,

   // 匹配带-的小写数字

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

   // 将字符串转换成大写

   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();

   };

正则表达式的分析：

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

解析：判断是否为HTML标签或#id，例如<div>或#top

x|y 表示匹配x或者y

这里可以分为两个部分来看^{(?:\s*(<[\w\W]+>)[}>]和 #([\w-]))$

1、^{(?:\s*(<[\w\W]+>)[}>]

?: (?:pattern)匹配pattern但不获取匹配结果，也就是说这是一个非获取匹配，不进行存储供以后使用。例如“industr(?:y|ies)”就是一个比“industry|industries”更简略的表达式。

\s 匹配任何空白字符，包括空格、制表符、换页符等等,零次或者多次。

[\w\W]+ 匹配于'[A-Za-z0-9_]'或[^A-Za-z0-9_]' 一次或多次

(<[\w\W]+>) 匹配的用<>包含的字符串，如<li>

2、#([\w-]*))$

匹配结尾带上#号的任意字符，包括下划线与-

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

\1表示跟第一个（）中的内容匹配。<p></p>匹配，<li></p>不匹配

秒客网

jQuery源码学习笔记一

相关文章