jquery的2.0.3版本源码系列(1)总体结构

为什么选择2.X版本,而不是1.X版本,因为2.X不兼容IE6/7/8,所以少了兼容代码,让我们更专注于jquery原理的代码。

一共有8830行。

1.1 匿名函数自执行

首先,匿名函数的作用是,把函数内部的变量和函数变成"局部变量"和"局部函数"的,那么就不会与外部的变量和函数发生冲突了。

(function(){

      var a=10;

 })();

alert(a);//console.log报错,"Uncaught ReferenceError: a is not defined"。
(function(){

        var a=10;

         function $(){

                 alert(a);
          }
 })();

$();//console报错,"Uncaught ReferenceError: $ is not defined"

第二,如何对外部提供接口,让外部可以调用jQuery()函数。方式是把$函数挂载到window对象上。

(function(){

      function $(){

              alert("string");
       }

       window.$=$;

})();

$();//那么现在就可以在匿名函数外部调用$(),也就是jQuery()函数。

第三,window参数。为什么要传这个参数呢?

不传,匿名函数可以取到window对象吗?答案是可以的。

传window参数的好处是:

(1)查找速度快:window是作用域链的最顶端,那么传了之后就不用在匿名函数调用window时往外一层层的找了。

(2)压缩的好处:压缩时,window变成字母,能更好的优化。下图是2.0.3压缩版本。

第四,undefined参数。

undefined既不是保留字,也不是关键字,它是window的一个属性。它在某些浏览器中,可以被修改,能够被赋值。

var undefined=10;

alert(undefined);

浏览器IE10的显示效果

浏览器IE7的显示效果

1.2 代码行数的分布

21行-94行,定义了一些变量和函数,jQuery=function(){}。

96行-283行,给jQuery对象,添加一些方法和属性(jquery是基于面向对象的程序)

从下面的写法可以看出,arr是对象,那么调用方法就直接使用点语法,它和jquery的方法调用十分相似。

285行-347行,extend是JQ的继承方法。继承有利于代码的独立性和扩展。

349行-817行,jQuery.extend():扩展了一些工具方法。

jQuery提供了2种操作代码的方式,一种是实例方法,它给JQ对象使用,另一种是静态方法($是一个函数,那么是扩展工具方法),既可以给JQ对象使用,也可以给原生的JS使用。

静态方法更加底层一些。

877行-2856行,sizzle是复杂选择器的实现。Sizzle。

2880行-3042行,callbacks是回调对象。它是函数的统一管理。

首先引入jQuery库,然后参照如下代码。代码通过回调函数cb对函数进行触发fire,删除remove。

function fn1(){alert(1)}

function fn2(){alert(2)}

var cb=$.Callbacks();

cb.add(fn1);
cb.add(fn2);
cb.fire();
cb.remove(fn2);
cb.fire();

3043行-3183行,Deferred延迟对象,它是对异步的统一管理。

第一种代码看起来是十分奇怪的,明明弹出字符串2是写在后面,可是事实上是先执行,然后再弹出2。否则就要把alert出2嵌套进定时器里边儿。

setTimeout(function(){

        alert(1);

 },1000);

alert(2);

第二种是延迟对象的写法,写起来是同步,但执行的时候是异步。

var dfd=$.Deferred();//定义延迟对象。

setTimeout(function(){

     alert(1);
         、
     dfd.resolve(true);

     //定时器等到3秒后,先弹出数字1,然后解决延迟对象,从而触发done方法传进去的函数参数。

},3000);

dfd.done(function(){    //当浏览器的js引擎读到这里时把函数存起来,等到resolve时触发

      alert(2);

})

3184行-3295行,support:功能检测。对浏览器发展非常有用的。checkon老版本的浏览器默认空字符串,新版本的浏览器是on,那么以此来区分新旧浏览器。

3308行-3652行,data():数据缓存。比如获取、删除、设置数据。data并非挂载到元素身上,而是通过一系列的操作。否则,如果挂载到元素上,又操作了对象,那么会发生内存泄漏。

3653行-3797行,queue()队列管理。

3803行-4299行,attr()、prop()、val()、addClass()等,对元素属性的操作。

4300行-5128行,on()、trigger(),事件操作的相关方法。

5140行-6057行,DOM操作:添加、删除、获取、包装、innerHTML、DOM筛选。

6058行-6620行,css():样式的操作。

6621行-7854行,数据和ajax():比如跨域、load()、getJson等。

7855行-8584行,animate():运动的方法,show()、hide()。

8585行-8792行,offset():位置与尺寸的方法。

8804行-8821行,JQ支持模块化的模式,比如commonJS、CMD规范。

8826行,window.jQuery=window.$=jQuery;对外提供接口。

时间: 2024-10-06 19:53:06

jquery的2.0.3版本源码系列(1)总体结构的相关文章

jquery的2.0.3版本源码系列(3):285-348行,extend方法详解

目录 1 . jquery extend的基本使用 通过285行的源码 jQuery.extend = jQuery.fn.extend = function() { ,extend方法要么是直接挂在到jQuery的静态方法,要么是挂载到fn上其实就是原型上(参考283行的赋值操作)的实例方法.extend方法可以传一个对象,类似于插件的方式,也可以传多个对象进行拷贝. <script src="js/jquery-2.0.3.js"></script> <

Spring各版本源码下载

spring framework 各版本源码下载地址 现在spring的源码下载地址真是不好找,这次终于找到了.记录一下,以帮助需要的朋友. https://github.com/spring-projects/spring-framework/tags可以选择需要的版本进行下载. 感谢网友 xiyuan1999 在csdn上提供的此下载地址.

可解决由于IIS、VS低版本源码 兼容性问题。

安装完 Internet Information Services和 Web 管理工具 后,重启VS,以管理员身份打开,同时 选择源码--属性--安全--添加 everyone 所有权限,配置IIS,即可解决由于IIS.VS低版本源码 兼容性问题. 解决方法: 重新启动时  右键 选以管理员身份运行 那是兼容性还没配置把 控制面板-程序和功能 打开或关闭 Windows 功能 找到这个Internet Information Services 展开Web 管理工具 安装完 Internet In

Android4.4版本源码变化

一,WifiManager 新增: 1 public void setTdlsEnabled (InetAddress remoteIPAddress, boolean enable) 2 3 Enable/Disable TDLS on a specific local route. 4 5 TDLS enables two wireless endpoints to talk to each other directly without going through the access po

Elk实时日志分析平台5.0版本源码安装配置

目录 一. 安装JAVA. 1 二. 安装elasticsearch. 2 三. 配置elasticsearch. 2 四. 安装logstash. 3 五. 配置 logstash. 3 六. 安装kibana. 4 七. 配置kibana. 5 八. 安装x-pack插件... 5 九. x-pack管理用户... 6 1. 添加用户... 6 2. 查看用户... 6 3. 测试用户登录... 6 4. 删除用户... 6 十. 安装filebeat. 7 一. 安装JAVA # mkdi

网站安全通用防护代码(C#版本源码提供)

每一个开发者都会意识到,网站发布之前,需要进行安全检查. 那么如何拦截攻击者注入恶意代码?如何防御诸如跨站脚本攻击(XSS).SQL注入攻击等恶意攻击行为? 针对目前常见的一些安全问题,结合目前一些常见的防护办法,通用权限管理系统底层增加了安全防护代码, 现将源码提供如下 namespace DotNet.Utilities { /// <summary> /// 网站安全通用防护 /// /// 主要功能: /// 拦截攻击者注入恶意代码,可以防御诸如跨站脚本攻击(XSS).SQL注入攻击等

【开源】ZXING的.NET版本源码解析

[概述] ZXing ("zebra crossing") is an open-source, multi-format 1D/2D barcode image processing library implemented in Java, with ports to other languages. 开源地址: https://github.com/zxing/zxing [工程结构] 以ZXing.Net.Source.0.14.0.0版本为例,此文件目录下对应两个工程: Bas

Apache Ranger0.6版本源码编译

1 Ranger简介 Apache Ranger提供一个集中式安全管理框架,它可以对Hadoop生态的组件如Hive,Hbase进行细粒度的数据访问控制.通过操作Ranger控制台,管理员可以轻松的通过配置策略来控制用户访问HDFS文件夹.HDFS文件.数据库.表.字段权限.这些策略可以为不同的用户和组来设置,同时权限可与hadoop无缝对接. 2 准备 2.1 环境说明 1 Ranger源码编译依赖如下linux组件:maven,git,gcc,MySQL 2 安装git和gcc时采用yum安

《k8s-1.13版本源码分析》-调度器初始化

源码分析系列文章已经开源到github,地址如下: github:https://github.com/farmer-hutao/k8s-source-code-analysis gitbook:https://farmer-hutao.github.io/k8s-source-code-analysis 本文大纲 概述 从 --config 开始 options.Option 对象 config.Config对象 runCommand ApplyFeatureGates 默认算法注册 特性开关