利用暑假时间开始看之前一直想看的jQuery源码,参考资料有高云的《jQuery 技术内幕:深入解析jQuery架构设计与实现原理》,源码版本就是书中的jQuery 1.7.1。
之前就猜到$()应该是调用一个构造器,返回jQuery对象,但真正看到源码才发现,它返回的并不是jQuery的实例,而是另外一个构造函数init()的实例。这样应该是为了在创建jQuery对象的时候省去写new操作符。
(ps:写给初学者:在用new操作符创建一个构造函数的实例的时候,构造函数里的this指向一个新的空的对象,执行完构造函数的代码后,返回这个this,而作者return另外一个构造函数的实例,打破了这个关系,就不会返回jQuery的实例,而是返回init()的实例,因此创建jQuery对象的时候也就不用加new操作符了)
var jQuery = (function() {
var jQuery = function( selector, context ) {
return new jQuery.fn.init( selector, context, root jQuery );
},
// 一堆局部变量声明
jQuery.fn = jQuery.prototype = {
constructor: jQuery,
init: function( selector, context, rootjQuery ) { ... },
// 一堆原型属性和方法
};
jQuery.fn.init.prototype = jQuery.fn;
jQuery.extend = jQuery.fn.extend = function() { ... };
jQuery.extend({
// 一堆静态属性和方法
});
return jQuery;
})();
并且把实际构造函数init()放在原型上,为了让init()的实例能够使用jQuery对象原型上的方法,又把init()的原型指向jQuery的原型,也就是jQuery.fn.init.prototype = jQuery.fn;
我感觉如果是我来写jQuery对象,就算是为了省new操作符而另外写一个构造函数,也不会把init()函数放在原型上,而是会在jQuery并列的地方写个新的构造函数,我不知道作者把init()放在原型上是为了把所有方法封装在jQuery上还是什么。
PS:源码真的写的蛮枯燥的,看不下去的时候,可以写个简单的小的调用例子,打个断点,一行行看。
PS:说法有误的地方希望得到指正