jQuery源码分析之整体框架分析
?
? ? 读一个开源框架，大家最想学到的就是设计的思想和实现的技巧。最近读jQuery源码，记下我对大师作品的理解和心得，跟大家分享，权当抛砖引玉。
?
先附上jQuery的代码结构。
?
?
其实在使用返回 new jQuery.fn.init( selector, context, rootjQuery ) 对象方式，我还有另一种实现：var jQuery = function( selector, context ) { //如果以$("#id") 方式调用this就不是jQuery.这样返回jQuery对象 if(!(this instanceof jQuery)) { return new jQuery(selector, context); } if(this.init) { this.init(); }}//这行就可以注释了//jQuery.fn.init.prototype = jQuery.fn;?这种经过测试时可以的，不知道还有没有其他的隐蔽问题，暂时没发现，也算是一种实现吧。供大家参考。三. 框架里最看到的 extend 函数在后面的段落中有大段大段的 jQuery.extend({...}) 和 jQuery.fn.extend({...}) 代码。这里先解释下这个的作用和不同。extend 在java中是继承，在我之前写的一篇 <简单实现Javascrip继承> 文章不同，也都是用了extend关键字。那些我们都说叫继承，而这里我更加喜欢叫扩展。为什么呢？ 继承是产生了新的类，而这里没有，这里的2个函数第一个是扩展jQuery的静态方法，而第二个是用户自己扩展对象的方法。静态方法？对象方法？这里我来做个解释，在jQuery中有2中调用形式：1）$.Ajax(...);2）$("#id").data("xxx");第一种调用我称为静态调用，就类似于Java的静态方法一样，不用生成对象，而是类级函数。这里的$就相当于命名空间一样。我们知道在以往js的编程中，如果有命名空间我们都这样:var ns = {};ns.Ajax = function(){...};那为什么这里不是对象，而是函数做一个命名空间呢？ 其实在js中一切都是对象！包括函数也是对象(说Java一切都是对象，我觉得其实这句话形容js更加贴切)。第二种调用我成为对象调用，因为.data()方法是定义在原型中的，只有new个对象才能调用的，所以成为对象方法。我们看代码jQuery.extend =?jQuery.fn.extend = function(){...}; 这个是连等，也就是2个指向同一个函数，怎么会实现不同的功能呢？这就是this 的功能了。jQuery.extend 调用的时候，this是指向jQuery对象的(jQuery是函数，也是对象！)，所以这里扩展在jQuery上。 而jQuery.fn.extend 调用的时候，this指向fn对象，而上图中科院看到，jQuery.fn 和jQuery.prototype指向同一对象，扩展fn就是扩展jQuery.prototype原型对象。这里增加的是原型方法，也就是对象方法了。所以jQuery的api中提供了以上2中扩展函数。本章结束，有不对和不准确的地方望大家指正。有疑问可以留言。下篇介绍jQuery的data实现。欢迎关注。
