jQuery.prototype的含义。

转自：http://www.nowamagic.net/librarys/veda/detail/653

在 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 的原型关系图，理解起来更加方便一些。

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

jQuery.prototype的含义。相关推荐

jQuery.fn和jQuery.prototype区别。
近期在读jQuery的源码. 发现这里有个东西很难理解. 这里的 jQuery , jQuery.fn , jQuery,fn,init ,jQuery,prototype 都代表什么. 来看下jQu ...
css+javascript+jquery+prototype+ajax+html5+iis+apache
CSS是为了统一HTML中各标识的显示属性而存在的. 它的特点就是:精简代码,加快网页访问速度,还有对于搜索引擎有好处. 有许多用HTML实现不了的想法,总结如下: 如何显示弹出框? 如何知道用户在使 ...
如果我有jQuery背景，那么“ AngularJS中的思考”吗？ [关闭]
已关闭 . 这个问题需要更加集中 . 它当前不接受答案. 想改善这个问题吗? 更新问题,使其仅通过编辑此帖子来关注一个问题. 4年前关闭. 已锁定 . 该问题及其答案被锁定,因为该问题是题外话,但具有 ...
jquery内核学习(6)--扩展实现extend
本篇继续丰富我的jquery框架,利用extend来扩展! 扩展的优点不必每次增加新的方法都直接往jQuery或者jQuery.fn追加. jQuery.fn.extend({fun1: funct ...
jQuery工具方法
目录常用工具方法判断数据类型的方法 Ajax操作 $.ajax 简便写法 Ajax事件返回值 JSONP 文件上传参考链接 jQuery函数库提供了一个jQuery对象(简写为$),这个对象本 ...
[jQuery] jquery.extend与jquery.fn.extend的区别？
[jQuery] jquery.extend与jquery.fn.extend的区别? 1.认识jQuery extend()和jQuery.fn.extend()jQuery的API手册中,exte ...
jQuery 结构分析
jquery核心转自http://www.iteye.com/topic/783260 (function( window, undefined ) { // 构造jQuery对象 var jQu ...
jQuery自定义插件
1.对象级别的插件开发,即给jQuery对象添加方法,封装对象方法的插件,如:parent().appendTo() 2.一种是类级别的插件开发,即给jQuery添加新的全局函数,相当于给jQuery ...
jQuery整体框架
前言 jQuery整体框架甚是复杂,也不易读懂,这几日一直在研究这个笨重而强大的框架.jquery的总体架构可以分为:入口模块.底层模块和功能模块.这里,我们以jquery-1.7.1为例进行分析. ...

jQuery.prototype的含义。

jQuery.prototype的含义。相关推荐

最新文章

热门文章