jquery的总体架构分析及实现示例详解
jQuery整体框架甚是复杂，也不易读懂，这几日一直在研究这个笨重而强大的框架。jQuery的总体架构可以分为：入口模块、底层模块和功能模块。这里，我们以jquery-1.7.1为例进行分析。
jquery的总体架构
16(function(window,undefined){
//构造jQuery对象
22 varjQuery=(function(){
25 varjQuery=function(selector,context){
27 returnnewjQuery.fn.init(selector,context,rootjQuery);
28 },
//一堆局部变量声明
97 jQuery.fn=jQuery.prototype={
98 constructor:jQuery,
99 init:function(selector,context,rootjQuery){...},
//一堆原型属性和方法
319 };
322 jQuery.fn.init.prototype=jQuery.fn;
324 jQuery.extend=jQuery.fn.extend=function(){...};
388 jQuery.extend({
//一堆静态属性和方法
892 });
955 returnjQuery;
957 })();
//省略其他模块的代码...
9246 window.jQuery=window.$=jQuery;
9266})(window);
分析一下以上代码，我们发现jquery采取了匿名函数自执行的写法，这样做的好处就是可以有效的防止命名空间与变量污染的问题。缩写一下以上代码就是：
(function(window,undefined){
varjQuery=function(){}
//...
window.jQuery=window.$=jQuery;
})(window);
参数window
匿名函数传了两个参数进来，一个是window，一个是undefined。我们知道，在js中变量是有作用域链的，这两个变量的传入就会变成匿名函数的局部变量，访问起来的时候速度会更快。通过传入window对象可以使window对象作为局部变量使用，那么，函数的参数也都变成了局部变量，当在jquery中访问window对象时，就不需要将作用域链退回到顶层作用域，从而可以更快的访问window对象。
参数undefined
js在查找变量的时候，js引擎首先会在函数自身的作用域中查找这个变量，如果没有的话就继续往上找，找到了就返回该变量，找不到就返回undefined。undefined是window对象的一个属性，通过传入undefined参数，但又不进行赋值，可以缩短查找undefined时的作用域链。在自调用匿名函数的作用域内，确保undefined是真的未定义。因为undefined能够被重写，赋予新的值。
jquery.fn是啥？
jQuery.fn=jQuery.prototype={
constructor:jQuery,
init:function(selector,context,rootjQuery){...},
//一堆原型属性和方法
};
通过分析以上代码，我们发现jQuery.fn即是jQuery.prototype，这样写的好处就是更加简短吧。之后，我们又看到jquery为了简洁，干脆使用一个$符号来代替jquery使用，因此，在我们使用jquery框架的使用经常都会用到$()，
构造函数jQuery()
图片描述
jQuery的对象并不是通过newjQuery创建的，而是通过newjQuery.fn.init创建的：
varjQuery=function(selector,context){
returnnewjQuery.fn.init(selector,context,rootjQuery);
}