菜鸟的jQuery源码学习笔记（二）

标签：style   blog   color   使用   io   数据   ar   art   

jQuery对象是使用构造函数和原型模式相结合的方式创建的。现在来看看jQuery的原型对象jQuery.prototype:

1 jQuery.fn = jQuery.prototype = {
2       //成员变量和方法  
3 }

这里给原型对象起了一个别名叫做jQuery.fn。要注意的是这个jQuery.fn可不是jQuery对象的属性，而是jQuery构造方法本身的属性，它是不会传给它所创建的对象的。如果你在控制台敲$().fn的话输出的结果会是undefined。接下来看看原型对象里面有些什么：

1 jquery: "2.1.1",
2 
3 constructor: jQuery,

jquery:在原型对象中，先定义了jquery属性来标识版本信息，这里是2.1.1版。在我们写代码的时候可以通过查看这个属性判断对象是不是jQuery对象。

constructor:这个属性在低版本的jQuery代码中是没有的(例如远古的1.2.6版本)。在这里我能看见这个属性我真的觉得现在的jQuery成熟了。每一个对象都有一个constructor属性，是由创建它的构造函数的原型对象传递而来，指向了创建它的构造方法。也就是如果你在chrome的控制台敲：

1 var obj = {};
2 
3 obj.constructor;

控制台会显示:

　　function Object() { [native code] }

构造函数的原型是在定义构造函数的时候自动生成，其中的constructor会自动指向该构造函数。也就是你在输入：

1 function Obj(){}
2 
3 Obj.prototype.constructor

控制台会输出： 

　　function Obj(){}

现在回过头我们再来看看jQuery的代码。定义jQuery.prototype时：

1 jQuery.fn = jQuery.prototype = {
2       //成员变量和方法  
3 }

这里的过程其实是新建一个对象，然后将jQuery.prototype指向这个新建的对象。而这时新建对象因为是由function Object(){}方法构建的。所以它的constructor属性其实是指向的function Object(){}方法。进而导致所有由jQuery方法创建的对象的constructor也是指向的

function Object(){}方法。这里重新定义jQuery.prototype.constructor属性，让它重新指向jQuery构造函数。平常我们在使用jQuery的时候也许永远也不会用到constructor这个属性，但是这种小细节的完善无疑让整个代码变得严谨很多。

继续往下看代码：

1 // Start with an empty selector
2 selector: "",
3 
4 // The default length of a jQuery object is 0
5 length: 0,

selector：这个属性指的是默认的选择器。

length：jQuery对象其实是一个类数组对象。什么叫类数组对象？我的理解是它不是一个数组，而是一个对象但是当我们访问它的数据时某些表现形式跟数组很相似，比如可以用[0]、[1]....[n]来访问数据，可以用length来获取数据的数目。jQuery就是一种类数组对象通过选择器选择页面元素，并以jq[0]、jq[1]、jq[2]...、jq[n]的形式将个元素存储在jQuery对象中，这个length属性就是用来记录元素个数。

菜鸟的jQuery源码学习笔记（二）,布布扣,bubuko.com

菜鸟的jQuery源码学习笔记（二）

标签：style   blog   color   使用   io   数据   ar   art   

原文地址：http://www.cnblogs.com/chou/p/3920352.html