jQuery.js的构造函数分析

  上次已经分析过jQuery.js的整个执行过程了,现在需要深入丛林了,从jQuery.js的构造函数开始。

  在jQuery.js的构造函数中,充分利用了JavsScript语言的动态性——对行参的类型和个数没有的严格要求,以至于一个函数可以实现多种功能需求,也为JavaScript语言的多态性提供了基础,在这个构造函数中,提供了六种不同的调用格式(根据官方API文档),具体如下($ = jQuery):

  1、$(String expr):根据给定的CSS选择符查找匹配的元素,如$("div>p");
  2、$(Element elem):将给定的DOM元素对象转换为jQuery对象,如$(document).find("div>p");
  3、$(Array<Element> elems):如$(myForm.elements).hide();
  4、$(Function fn):是$(document).ready()的简写模式,如:$( function fn(){ ... } );
  5、$(jQuery obj):如:var div = $("div");  $(div).find("p");
  6、$(String expr, Element context):在context中查找expr,如:$("div", xml.responseXML);

  另外,jQuery中提到了Chainable Methods的思想,也就是调用jQuery中的方法会返回一个jQuery对象,仍然可以继续调用其中的方法,这样,就形成了一个“链条”,通过“.”一个一个调用下去,这个在构造函数中有具体体现,其中有如下一条语句:

  if( window == this ) return new jQuery( a, c );

  这个就是为了返回一个jQuery对象,在首次调用jQuery( a, c )函数时,this是等于window的,所以每次都会创建一个jQuery对象,更详细的代码分析见下:

//  jQuery的构造函数;
var  jQuery  =   function ( a, c ) {
    
//  $(document).ready()的简写形式,只有在$(function(){...})下才会执行;
     if  ( a  &&   typeof  a  ==   " function "   &&  jQuery.fn.ready )  return  jQuery(document).ready(a);

    
//  确保参数a非空,默认值为document;
    a  =  a  ||  jQuery.context  ||  document;

    
//  如果参数a是jQuery对象(a.jquery="1.0.3"),则克隆一个与a相同的jQuery对象;
     if  ( a.jquery )  return  jQuery( jQuery.merge( a, [] ) );

    
//  从给定的参数c(要求c必须是jQuery对象)中查找a;
     if  ( c  &&  c.jquery )  return  jQuery( c ).find( a );

    
//  如果是初次调用$(),因为在window环境下,所以创建一个新的jQuery对象,如果去掉new则循环执行;
     if  ( window  ==   this  )  return   new  jQuery(a,c);

    
//  分析HTML串,如“div<ul>p”;
     if  ( a.constructor  ==  String ) {
        
var  m  =   /^ [ ^< ] * ( < . +> )[ ^> ] * $ / .exec( a );
        
if  ( m ) a  =  jQuery.clean( [ m[  1  ] ] );
    }

    
//  如果参数a是元素数组,则要执行jQery.merge(),否则要执行jQuery.find();
     this .get( a.constructor  ==  Array  ||  a.length  &&   ! a.nodeType  &&  a[ 0 !=  undefined  &&  a[ 0 ].nodeType
        
?    //  处理元素数组;
            jQuery.merge( a, [] )
        :  
//  查找相匹配的元素并保存;
            jQuery.find( a, c ) );

    
//  如果附加了另外的函数,则在每个相匹配的jQuery对象上执行这个函数;
     var  fn  =  arguments[ arguments.length  -   1  ];
    
if  ( fn  &&   typeof  fn  ==   " function "  )  this .each( fn );

    
return   this ;

}; 
// jQuery的结束;
  • 0
    点赞
  • 0
    收藏
    觉得还不错? 一键收藏
  • 1
    评论

“相关推荐”对你有帮助么?

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论 1
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值