当前位置:编程学习 > 网站相关 >>

jQuery解密之----执行过程分析

 javaScript 是一门基于对象的语言,然而它的对象技术的实现与其他的语言有很大的差异。
在javaScript中,定义一个类的一般采用以下这种模式:

[javascript] 
//定义一个构造函数 
testClass(param1,param2){ 
    this.att1=param1; 
    this.att2=param2; 
 .... 

[javascript] 
// 在prototype对象上扩展,加上相应的方法; 
testClass.prototype = { 
   Method1: function() {...}, 
   Method2: function() {...}, 
   ... 

[javascript] 
// 定义一个实例; 
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 = jQuery.prototype; 
   jQuery.fn = jQuery.prototype = { 
     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: { ... }, 
     ... 
   }; 
 
  // jQuery初始化; 
   jQuery.init(); 
 
  // 实现jQuery的重要方法ready(); 
   jQuery.fn.extend({ 
     ready: function( f ) { ... } 
     ... 
   }; 
 
  // 上面ready()方法的具体实现; 
   jQuery.extend({ 
     ready: function() { ... }, 
     ... 
   }; 
 
  // 对浏览器某些事件进行绑定和解绑定; 
  new function() { 
     ... 
     jQuery.event.add( window, "load", jQuery.ready ); 
   }; 
 
  // 当IE浏览器关闭时,清除上面绑定的事件,防止内存泄漏; 
  if ( jQuery.browser.msie ) jQuery(window).unload( ... ); 
 
  // 实现一些浏览器效果; 
   jQuery.fn.extend({ 
     show: function( speed, callback ) { ... }, 
     hide: function( speed, callback ) { ... }, 
     ... 
   }; 
 
  // 上面的一些函数具体实现; 
   jQuery.extend( {...} ); 
 
  // 以下都是Ajax的实现,这里声明原型,具体实现调用下面的函数; 
   jQuery.fn.extend({ 
     loadIfModified: function(url, params, callback ) { ... }, 
     ... 
   }; 
 
  // 针对IE浏览器创建不同的XMLHttpRequest对象; 
  if (jQuery.browser.msie && typeof XMLHttpRequest == "undefined") { ... }; 
 
  // Ajax函数的绑定; 
  new function() { 
    var e = "ajaxStart,ajaxStop,ajaxComplete,ajaxError,ajaxSuccess".split(","); 
     ... 
   }; 
 
  // Ajax函数的具体实现; www.zzzyk.com
   jQuery.extend({ 
     get: function( url, data, callback, type, ifModified ) { ... }, 
     post: function( url, data, callback, type ) { ... }, 
     ajax: function( type, url, data, ret, ifModified ) { ... }, 
     ... 
   } 

补充:综合编程 , 安全编程 ,
CopyRight © 2012 站长网 编程知识问答 www.zzzyk.com All Rights Reserved
部份技术文章来自网络,