二、jQuery源码分析——jQuery对外提供接口的方式及定义了一些内部使用的变量

        jQuery通过采用了匿名函数自执行的方式创建了块极作用域,使得jQuery内部定义的变量不会污染全局变量,通过给window对象上挂在$和极jQuery方法对外提供接口。

一、jQuery对外提供接口

        jQuery通过使用匿名函数自执行的方式创建块级作用域,通过给window对象上挂在$和极jQuery方法对外提供接口,下面是匿名函数自执行的框架,至于给匿名函数中传递参数的原因,代码注释中有比较详细的介绍。

(function(window, undefinded){

    /* 显式地传入window的原因
     *  1、window对象属于最外层的对象,显示的传递进来可以提高查询速率
     *  2、利于代码的压缩
     */

    /* 显示的传入undefind的原因 
     * undefind不是保留子,防止外部修改
     */
})(window)

二、定义了一些变量

        在jQuery源码的一开始,我们定义了一些变量,这些变量将会在后续的代码被用到,下表表示的是这是变量以及他们各自所代表意思。

变量 含义 初始值
rootjQuery #document undefined
readyList - undefined
core_strundefined 兼容性更强的方式typeof undefinded获取undefinded undefined
location 保存window.location window.location
document #document window.document
docElem #html节点 document.documentElement
_jQuery window.jQuery(JQuery放冲突设置) window.jQuery
_$ window.$(JQuery放冲突设置) window.$
class2type $.type()方法做判断时使用 {}
core_deletedIds 跟数据缓存有关 []
core_version 保存JQuery版本 2.0.3
core_concat core_deletedIds.concat core_deletedIds.concat
core_push core_deletedIds.push core_deletedIds.push
core_slice core_deletedIds.slice core_deletedIds.slice
core_indexOf core_deletedIds.indexOf core_deletedIds.indexOf
core_toString class2type.toString class2type.toString
core_hasOwn class2type.hasOwnProperty class2type.hasOwnProperty
core_trim core_version.trim core_version.trim
core_pnum 匹配数字的正则 /[+-]?(?:\d*.|)\d+(?:[eE][+-]?\d+|)/.source
core_rnotwhite 匹配空格的正则 /\S+/g
rquickExpr

aaa 或者 #div1

/(?:\s*(<[\w\W]+>)[>]|#([\w-]))$/
rsingleTag

/^<(\w+)\s*/?>(?:|)$/
rmsPrefix 驼峰转化时需要的用到的 /^-ms-/
rdashAlpha 驼峰转换时需要用到的 /-([\da-z])/gi
fcamelCase() 转化为驼峰形式的表达式 function( all, letter ) {returnletter.toUpperCase();}
completed() 页面加载完成后调用的方法 function() {document.removeEventListener( "DOMContentLoaded", completed, false );window.removeEventListener( "load", completed, false );jQuery.ready();}

三、定义JQuery函数

jQuery = function( selector, context ) {
        // The jQuery object is actually just the init constructor 'enhanced'
        return new jQuery.fn.init( selector, context, rootjQuery );
    },

此处JQuery设置的很精妙。请往下看。
平常我们使用JavaScript写面向对象程序的时候,都是如下的这种方式

// 这样写我们在调用的时候,必须是
// a.init()   a.css()
function Aaa(){}
Aaa.prototype.init = function(){}
Aaa.prototype.css= function(){}

var a = new Aaa()
a.init()

JQuery采取的是下面的这种方式
1、调用jQuery.init()方法,返回Jquery.init()的对象
2、通过jQuery.prototype.init.prototype =jQuery.prototype将jQuery原型下的方法挂载到jQuery.init的原型下面

function jQuery(){
  return new jQuery.prototype.init()
}
jQuery.prototype.init = function(){}
jQuery.prototype.css = function(){}

jQuery.prototype.init.prototype = jQuery.prototype;
jQuery().css()

       对于这段代码,我们可以很简单的想是 把jQuery的原型赋值到jQuery.init的原型上,也就是说,jQuery.init.prototype拿到了jQuery.prototype原型上的方法。

你可能感兴趣的:(二、jQuery源码分析——jQuery对外提供接口的方式及定义了一些内部使用的变量)