JQuery里的原型prototype分析

在 JavaScript 中，每一个函数对象都有一个默认的属性 prototype，称为函数对象的原型成员，这个属性指向一个对象，称为函数的原型对象，当咱们每定义了一个函数的时候，JavaScript 就建立了一个对应的原型对象，也就是说，当咱们定义一个函数的时候，实际上获得了两个对象，一个函数对象，一个原型对象。原型对象是一个特殊的对象，函数的 prototype 成员指向它的原型对象。

能够经过函数对象的 prototype 成员取得这个原型对象的引用。

下面定义一个函数对象 Person，而后经过 prototype 来取得它的原型对象。而后在它的原型对象上定义了一个方法。

01	function Person()

02

{

03

}

04

05	Person.prototype.showPerson = function()

06

{

07	alert( "Person Object.");

08

}

09

10	var alice = new Person();

11	alice.showPerson();

这个原型对象上定义的成员将用来共享给全部经过这个函数建立的对象使用。至关于 C# 中的实例方法，对象，函数和原型在内存中的关系以下图所示：

每一个对象也都有一个原型成员 prototype，经过 new 函数建立的对象会经过函数的 prototype 找到函数的原型，而后将本身的原型指向这个对象。对于不是经过函数建立的对象实例和原型对象，它们的原型会被设置为 Object 函数的原型对象。

Object 函数对象是 JavaScript 中定义的顶级函数对象，在 JavaScript 中全部的对象都直接或者间接地使用 Object 对象的原型。 当访问对象的属性或者方法的时候，若是对象自己没有这个属性或者方法，那么，JavaScript 会检查对象的 prototype 对象是否拥有这个属性或者方法，若是有，则做为对象的属性或者方法返回，若是没有，那么将经过原型对象的 prototype 继续进行检查，直到原型对象为 Object 函数的原型对象为止。

可是 prototype 是一个特殊的属性，在大多数的浏览器上，例如 IE 浏览器，都不能直接访问对象的 prototype 成员。返回的结果为 undefined。不能赋予对象一个新的原型，只能经过建立它的函数来肯定对象的原型。

函数对象的原型有一个特殊的用途，就是经过函数 new 建立出来的对象，会自动将函数对象的原型赋予新建立出的对象的原型。这样，若是为某个函数设置了原型对象，那么，全部经过这个函数建立的对象将拥有一样的原型对象。经过这个方法，可使这些对象共享相同的属性或者方法，来模拟类型的概念。

在 jQuery 中，咱们常常使用的 $() 函数就是定义在 window 对象上的 $() 函数。

1	jQuery = window.jQuery = window.$ = function( selector, context )

2

{

3	// The jQuery object is actually just the init constructor 'enhanced'

4	return new jQuery.fn.init( selector, context );

5

}

这个函数实际上经过 new jQuery.fn.init( selector, context )来完成，也就是经过 init 函数建立了一个对象。

下面从新指定了函数 init 的原型对象。因此 init 函数的原型对象就是 fn 对象。

1	// Give the init function the jQuery prototype for later instantiation

2	jQuery.fn.init.prototype = jQuery.fn;

这样全部经过 $ 建立出来的对象都将共享 fn 对象上的成员。所以，jQuery 对象都有了相似 attr 、html 等等方法了。

整理了一下 jQuery 的原型关系图，理解起来更加方便一些。

图例：黄色的为对象，蓝色的为函数。