说到jQuery, 大家可能直觉的认为jQuery的源码应该就是一个jquery.xx.js这样的一个文件. 但是看到真正的源码的时候, 整个人都思密达了.jQuery的源码做的事远比你想象的多, 为了保证代码的可维护性, 健壮性, 通用性等等, jQuery将各个功能模块独立成单个的js文件, 并通过依赖管理管理模块之间的依赖关系, 在构建的时候通过这种依赖关系将各个模块合并成一个js文件, 最后经过压缩混淆等步骤才会产生我们经常用的jquery.xx.min.js文件( q君:上来就说这些恶心的东西, 大家看不懂要跳过啊! ).

源码来源:

　　github: https://github.com/jquery/jquery

源码版本:

　　2.1.1: https://github.com/jquery/jquery/archive/2.1.1.zip

目录结构:

/

----build/   构建jQuery代码用的一些文件

----dist/     构建完成产生的文件

----src/      源码文件, 这是本系列文章主要分析的内容

----test/     测试相关, 主要为了保证代码的健壮性

----其他文件     包括grunt, bower jshint相关的配置

　　src/是jQuery真正的代码, 里面包含jQuery的各个功能模块, 接下来我们会逐步分析每一个模块.

辅助环境搭建:

　　在根目录下创建analysis目录, 用来辅助分析源码, 方便调试, 观察代码运行的一些细节.

　　分析过程中, 我会在analysis目录下创建很多html用于加载源码的各个模块. 以core为示例, 创建core.html

<!DOCTYPE html>

<html>

    <head>

        <meta charset="utf-8">

        <title>core</title>

    </head>

    <body>

        <script src="require.js" type="text/javascript" charset="utf-8"></script>

        <script type="text/javascript" charset="utf-8">

            require(['../src/core.js'], function($) {

                console.log($);

            })

        </script>

    </body>

</html>

　　require.js是针对AMD规范做的一个类库, AMD即Asynchronous Module Definition(异步模块加载机制), 提供异步加载和依赖管理支持.( q君: 这个不是做CPU的AMD啦! ) jQuery的源码采用AMD, 或者说是遵循requirejs方式定义每一个模块, 所以我们通过requirejs来正确加载jQuery模块代码.

　　更多细节可参阅requirejs官网: http://www.requirejs.org/

附件:

　　源码+analysis目录 : http://yunpan.cn/Q75WBaPr4RkT8  提取码 8469

jQuery 源码分析和使用心得 - 关于源码的更多相关文章

  1. Tomcat源码分析一：编译Tomcat源码

    Tomcat源码分析一:编译Tomcat源码 1 内容介绍 在之前的<Servlet与Tomcat运行示例>一文中,给大家带来如何在Tomcat中部署Servlet应用的相关步骤,本文将就 ...

  2. Android源码分析（十一）-----Android源码中如何引用aar文件

    一:aar文件如何引用 系统Settings中引用bidehelper-1.1.12.aar 文件为例 源码地址:packages/apps/Settings/Android.mk LOCAL_PAT ...

  3. jQuery 源码分析和使用心得 - 序

    众所周知, jQuery (个人简称为jq) 在前端开发中占有着非常重要的地位, 可以说jQuery的存在大大降低了学习网页设计和交互的门槛, 他的简单的语法和顺畅的使用逻辑激发了人们强烈的学习兴趣, ...

  4. $Django cbv源码分析 djangorestframework框架之APIView源码分析

    1 CBV的源码分析 #视图 class login (View): pass #路由 url(r'^books/$', views.login.as_view()) #阅读源码: #左侧工程栏--- ...

  5. 第十篇：Spark SQL 源码分析之 In-Memory Columnar Storage源码分析之 query

    /** Spark SQL源码分析系列文章*/ 前面讲到了Spark SQL In-Memory Columnar Storage的存储结构是基于列存储的. 那么基于以上存储结构,我们查询cache在 ...

  6. 第九篇：Spark SQL 源码分析之 In-Memory Columnar Storage源码分析之 cache table

    /** Spark SQL源码分析系列文章*/ Spark SQL 可以将数据缓存到内存中,我们可以见到的通过调用cache table tableName即可将一张表缓存到内存中,来极大的提高查询效 ...

  7. 深度 Mybatis 3 源码分析（一）SqlSessionFactoryBuilder源码分析

    MyBatis消除了几乎所有的JDBC代码和参数的手工设置以及对结果集的检索封装.MyBatis可以使用简单的XML或注解用于配置和原始映射,将接口和Java的POJO(Plain Old Java ...

  8. JDK1.8源码分析03之idea搭建源码阅读环境

    序言:上一节说了阅读源码的顺序,有了一个大体的方向,咱们就知道该如何下手.接下来,就要搭建一个方便阅读源码及debug的环境.有助于跟踪源码的调用情况. 目前新开发的项目, 大多数都是基于JDK1.8 ...

  9. Android源码分析（四）-----Android源码编译及刷机步骤

    一 : 获取源码: 每个公司服务器地址不同,以如下源码地址为例: http://10.1.14.6/android/Qualcomm/msm89xx/branches/msm89xx svn环境执行: ...

随机推荐

  1. Oracle 10G 使用UTL_SMTP发送中文电子邮件[Z]

    CREATE OR REPLACE PROCEDURE SCOTT.HTML_EMAIL( P_TO IN VARCHAR2, --收件人地址 P_SUBJECT IN VARCHAR2, --邮件主 ...

  2. S - stl 的mapⅠ

    先来介绍一下stl中的map这个功能 头文件#include<map> map是STL的一个关联容器,它提供一对一的数据处理能力 就像一个人对应一个编号一样 定义 为  map<in ...

  3. CDZSC_2015寒假新人（1）——基础 c

    Description FatMouse prepared M pounds of cat food, ready to trade with the cats guarding the wareho ...

  4. 如何查找ORACLE中的跟踪文件

    一.跟踪文件是干什么用的?        跟踪文件中包含了大量而详细的诊断和调试信息.通过对跟踪文件的解读和分析,我们可以定位问题.分析问题和解决问题.从跟踪文件的产生的来源来看,跟踪文件又可以分为两 ...

  5. jQuery插件的点点滴滴

    说起jQuery插件,很多人的脑海种已经有了一定的雏形,仿佛感觉仅仅就是那样子,事实呢?当你看了Bootstrap.js,品读了slidesjs,观摩了jquery.cycle2.js,不禁发现,原来 ...

  6. encoding（hdoj1020）

    Problem Description Given a string containing only 'A' - 'Z', we could encode it using the following ...

  7. FatMouse' Trade（hdoj1009）

    Problem Description FatMouse prepared M pounds of cat food, ready to trade with the cats guarding th ...

  8. MYSQL <=>运算符

    <=> 与 =

  9. CSS3 设置 Table 隔行变色

    table tr:nth-child(odd){background:#F4F4F4;} table td:nth-child(even){color:#C00;}

  10. wafer

    Wafer Dicing:晶圆划片 wafer:晶圆 Wafer bumping:晶圆凸起 300mm wafer line:300mm晶圆线 wafer fabrication:晶圆加工 silic ...