- 1、本文档共13页,可阅读全部内容。
- 2、原创力文档(book118)网站文档一经付费(服务费),不意味着购买了该文档的版权,仅供个人/单位学习、研究之用,不得用于商业用途,未经授权,严禁复制、发行、汇编、翻译或者网络传播等,侵权必究。
- 3、本站所有内容均由合作方或网友上传,本站不对文档的完整性、权威性及其观点立场正确性做任何保证或承诺!文档内容仅供研究参考,付费前请自行鉴别。如您付费,意味着您自己接受本站规则且自行承担风险,本站不退款、不进行额外附加服务;查看《如何避免下载的几个坑》。如果您已付费下载过本站文档,您可以点击 这里二次下载。
- 4、如文档侵犯商业秘密、侵犯著作权、侵犯人身权等,请点击“版权申诉”(推荐),也可以打举报电话:400-050-0827(电话支持时间:9:00-18:30)。
- 5、该文档为VIP文档,如果想要下载,成为VIP会员后,下载免费。
- 6、成为VIP后,下载本文档将扣除1次下载权益。下载后,不支持退款、换文档。如有疑问请联系我们。
- 7、成为VIP后,您将拥有八大权益,权益包括:VIP文档下载权益、阅读免打扰、文档格式转换、高级专利检索、专属身份标志、高级客服、多端互通、版权登记。
- 8、VIP文档为合作方或网友上传,每下载1次, 网站将根据用户上传文档的质量评分、类型等,对文档贡献者给予高额补贴、流量扶持。如果你也想贡献VIP文档。上传文档
查看更多
《jQuery核心源码解读
总体架构jQuery是个出色的javascript库,最近结合它写javascript,看了下源码。
先从整体、全局的看,jQuery的源码几乎都在下面的代码中:
(function() {//……})();
第一个括号里面是个匿名函数,第二个括号表示马上执行第一个括号里面的代码。首先明白,javascript里面是没有命名空间的,要保证你的javascript函数、对象与其他的不冲突,这里用了javascript的一个技巧:你的所有javascript函数、对象都在一个匿名函数里面定义,确保了所定义的函数、对象的有效范围,起到了命名空间的作用。既然作用范围在这个匿名函数中,怎么被别人使用呢?下面看它的下面代码:
var jQuery = window.jQuery = function(selector, context) {//……};
这里让jQuery库中最重要的对象jQuery成为了window对象的一个属性,这样就可以在其他地方像使用document(document也是window的一个属性)一样使用jQuery了。也许使用过jQuery的朋友惊讶-我没有使用jQuery对象,一直使用$的。没错,那是jQuery的同名对象:
window.$ = jQuery;
现在明白了吧。执行过程分析JavaScript是一门基于对象的语言,而它的对象技术的实现又和其他语言有着很大的差异,在JavaScript中,一个类的定义一般采用下面这种模式(我所看到的):
// 定义一个构造函数;testClass(param1, param2) {??this.attr1 = param1;??this.attr2 = param2;?? ...}// 在prototype对象上扩展,加上相应的方法;testCtotype = {?? Method1: function() {...},?? Method2: function() {...},?? ...}// 定义一个实例;var test = new testClass();
在jQuery.js中,同样也是这种模式,只不过它要复杂很多,而且它还定义了一个jQuery.extend()的静态方法来扩展类的功能,jQuery.js代码执行过程完整分析如下:
// 防止多次载入而进行jQuery对象的判断;if ( typeof window.jQuery == undefined ) {?? window.undefined = window.undefined;??// jQuery的构造函数;??var jQuery = function( a, c ) { ... };??// jQuery的命名空间$;??if ( typeof $ != undefined ) jQuery._$ = $;??var $ = jQuery;??// 给jQuery的prototype增加一些基础方法和属性;??// 其中有些方法是调用下面的扩展方法实现的;??// 注意下面的jQuery.fn = jQtotype;?? jQuery.fn = jQtotype = {???? each: function( fn, args ) { ... },???? find: function( t ) { ... },???? ...?? };??// jQuery实现继承的方法;?? jQuery.extend = jQuery.fn.extend = function( obj, prop ) {...};??// 实现一些基础的函数,有大部分是上面调用;?? jQuery.extend({???? init: function() { ... },???? each: function( obj, fn, args ) { ... },???? find: function( t, context ) { ... },???? ...?? });??// 浏览器版本的检测;??new function() {???? jQuery.browser = { safari:..., opera:..., msie:..., mozilla:... };???? ...?? };??// jQuery.macros扩展,主要用于jQuery.init(),进行jQuery的初始化;?? jQuery.macros = {???? filter: [ ... ],???? attr: { ... },???? each: { ... },???? ...??
文档评论(0)