jQuery乱谈

一直想对jQuery框架做一个深入而全面的分析，可惜总是没做到，正好这段时间闲着，我就赶紧把这事给办了，省的惦记着。

　　jQuery，相信大家都不陌生，对它的介绍我就不说了，我只说一下我对jQuery自己的一些理解。在我看来，jQuery虽然应用面非常广，但它更多的用于中小型网站的开发，或者偏向于设计的人员使用。相对于YUI、Ext-JS这些大的库来说，jquery更像是个人的巅峰之作。而像YUI、Ext-JS这些库，它们的应用面更偏重于企业级开发。这也是库与框架的区别。

　　虽然如此，jQuery还是有很多的闪光点值得我们学习，这也是我决定对jQuery做深入而细致的分析的原因。当然，网上已经有很多人对jQuery做了很深入的研究，本人的分析肯定会和别人有很多重复的地方，请不要见怪，我只想把我想到的东西写下来而已。闲话不说了，下面正式开始分析。

注：文章中针对的是jQuery-1.8.3.js，也就是最新的版本，若需要下载，请点击：http://code.jquery.com/jquery-1.8.3.js

　　整个jQuery就是一个自执行匿名函数。所谓的自执行匿名函数，就是没有函数名的定义后直接执行的函数。通常有两种格式：

(function () {    /* code */  } ());   (function () {    /* code */  })();

jQuery使用的就是第二种格式：

(function( window, undefined ) {    /*code*/ })( window );

　也许你会发现，这个匿名函数有两个形参：window、undefined，但是只有一个实参：window。为什么要把window这个在JavaScript中属于“超级全局变量”的已存在的值传给函数呢？这里面涉及到了作用域链的知识，有兴趣的同学可以参考这篇文章：深入理解JavaScript系列（14）：作用域链(Scope   Chain) 

　　这里把window作为实参可以减少作用域链的长度，有利于性能的优化。至于把undefined作为形参而又不传实参，是因为undefined在ECMAScript第三版中不属于关键字未来关键字（Javascript关键字是不能作为变量名和函数名使用的，使用Javascript关键字作为变量名或函数名，会使Javascript在载入过程中出现编译错误），所以是可以允许用户对undefined进行赋值的：

/*未对undefined赋值*/ var a = undefined; console.log(a);  //undefined  /*对undefined赋值*/ var undefined = 'Hello!'; var a = undefined; console.log(a);  //"Hello!"

幸好现代浏览器（FireFox、IE9+、Opera、Safari、Chrome）已经纠正了这一错误。在这些浏览器中即使对undefined进行赋值，浏览器依旧会把undefined赋值给变量：

　　而jQuery采用这种写法，可以避免jQuery里面的undefined遭到污染。在执行匿名函数的时候，只传递一个参数 window, 而不传递 undefined，那么函数体中的 undefined 局部变量的值，刚好就是 undefined。

　　接下来，在jQuery里面定义了一大堆的变量和方法：

(function( window, undefined ) { var       /*一堆局部变量*/      jQuery = function( selector, context ) { /*该方法是jQuery的基础*/         // The jQuery object is actually just the init constructor 'enhanced'         return new jQuery.fn.init( selector, context, rootjQuery );     },      jQuery.fn = jQuery.prototype = {     /*code*/    }; })(window);

　jQuery在内部把大部分的变量放到了最上面，这样虽然有利于变量在作用域链的查找（作用域链问题请参考：深入理解JavaScript系列（14）：作用域链(Scope   Chain)），但我认为这种写法在这里虽然无可厚非，但在我们平常写JavaScript代码时不是一种很好的编程习惯。我更推荐当我们用到变量时在定义，这样写出来的代码更加清晰。至于性能方面的损耗，真的可以忽略不计。当然，在大型的开发中，由于我们已经对各种变量的生存情况有了很清晰地了解，这时候把变量全部放在头部，再加上适当的注释，代码的结构会更加明确。

　　jQuery.fn.init( selector, context, rootjQuery )这个方法是整个jQuery的核心，大家应该对类似$('div .hd')的选择器不陌生吧，该方法提供了jQuery选择器的全部功能。至于该方法的具体实现，明天我再好好写一下吧。

　　另外我发现，在jQuery里面，注释很丰富，很全面，这对于我们了解jquery源码是个不小的帮助。工作中我们也需要养成这样的好习惯。

　　这篇文章只是对jQuery做一个简单的分析，后面的会更加全面，同时还会加上我的一些见解和评价，以及相关的资料参考。我写这些文章的目的就是对jQuery进行全面和仔细的分析，里面的一些观点也许有不对的地方，忘大家原谅，毕竟本人学习jQuery时间也不长。