关于JQuery源码解析

源码分析-----整体架构

1.首先关于jQuery的闭包结构

function(window,undefined){
    //jquery代码
  jquery=function(selector,context){
    return new jQuery.fn.init(selector,context,rootjQuery);
      };
    jQuery.fn=jQuery.prototype={
          init:function(selector,context,rootjQuery){
          //....
       };
     }
    jquery.fn.init.prototype=jQuery.fn;
    window.jQuery=window.$=jQuery;
 })(window);

为了不造成全局污染和变量冲突,整个实现都包含在一个立即执行的闭包环境里,只在后面暴露了$和jQuery两个变量.

2.jquery实例化对象
在使用$(””),时,其内部调用的是return new jQuery.fn.init(selector,context),其次jquery.fn.init的prototype属性设置为jQuery.fn;所以new jquery.fn.init()生成的对象就能访问到jQuery.fn上的所有原型方法。

3.关于jQuery方法的扩展
extend是jquery中的很重要的一个方法。jquery内部用来扩展静态方法和实例方法。jQuery.extend 是扩展jQuery本身,为类添加新的静态方法。jQuery.fn.extend是给jQuery对象添加实例方法 ,但同时jQuery.fn=jQuery.prototype,所以实例化的对象都能使用。jQuery.extend扩展的静态方法可以通过 .xxxjQuery.fn.extend ().xxx来调用。
1)在 jQuery.extend() 中,this 的指向是 jQuery 对象(或者说是 jQuery 类),所以这里扩展在 jQuery 上;且上下文指向是jQuery构造器
2)在 jQuery.fn.extend() 中,this 的指向是 fn 对象,前面有提到 jQuery.fn = jQuery.prototype ,也就是这里增加的是原型方法,也就是对象方法。



  • 0
    点赞
  • 0
    收藏
    觉得还不错? 一键收藏
  • 0
    评论

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

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

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

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

抵扣说明:

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

余额充值