Jquery源码分析(一)
版本: jQuery JavaScript Library v3.2.1
分析架构:
打开jquery.js,哇塞,一万多行,噩梦啊!很多人就say bye-bye了。其实,将代码结构拆分后,再分析源代码就简单多了。
( function( global, factory ) {
"use strict";
if ( typeof module === "object" && typeof module.exports === "object" ) {
module.exports = global.document ?
factory( global, true ) :
function( w ) {
if ( !w.document ) {
throw new Error( "jQuery requires a window with a document" );
}
return factory( w );
};
} else {
factory( global );
}
} )( typeof window !== "undefined" ? window : this, function( window, noGlobal ) {
// 此处省略一万多行代码
} );
其实,整个jquery.js代码就是一个自执行的匿名函数,将自执行函数的函数体省略:
( function( global, factory ) {
"use strict";
} )( typeof window !== "undefined" ? window : this, function( window, noGlobal ) {
// 此处省略一万多行代码
} );
这样就可以看出jquery.js,就是一个有两个形参( global、factory )的自执行的匿名函数。当匿名函数执行时,传入的两个实参:
typeof window !== "undefined" ? window : this
和
function ( window, noGlobal ){
//此处省略一万多行代码
}
也就是说:形参global的值是:typeof window !== "undefined" ? window : this ;而形参factory的值又是一个匿名函数,这个匿名函数中省略的一万多行代码就是jquery实现各种功能的函数。
if ( typeof module === "object" && typeof module.exports === "object" ) {
module.exports = global.document ?
factory( global, true ) :
function( w ) {
if ( !w.document ) {
throw new Error( "jQuery requires a window with a document" );
}
return factory( w );
};
} else {
factory( global );
}
这段代码是为了兼容Node.js 和 CommonJS的。如何没有Node.js和CommonJS,就直接执行 factory( global );这段代码的主要功能就是:导入那省略的一万多行功能代码。
Jquery源码分析(一)的更多相关文章
- jQuery源码分析系列
声明:本文为原创文章,如需转载,请注明来源并保留原文链接Aaron,谢谢! 版本截止到2013.8.24 jQuery官方发布最新的的2.0.3为准 附上每一章的源码注释分析 :https://git ...
- [转] jQuery源码分析-如何做jQuery源码分析
jQuery源码分析系列(持续更新) jQuery的源码有些晦涩难懂,本文分享一些我看源码的方法,每一个模块我基本按照这样的顺序去学习. 当我读到难度的书或者源码时,会和<如何阅读一本书> ...
- jQuery 源码分析 8: 回头看jQuery的构造器(jQuery.fn,jQury.prototype,jQuery.fn.init.prototype的分析)
在第一篇jQuery源码分析中,简单分析了jQuery对象的构造过程,里面提到了jQuery.fn.jQuery.prototype.jQuery.fn.init.prototype的关系. 从代码中 ...
- [转]jQuery源码分析系列
文章转自:jQuery源码分析系列-Aaron 版本截止到2013.8.24 jQuery官方发布最新的的2.0.3为准 附上每一章的源码注释分析 :https://github.com/JsAaro ...
- jquery源码分析之一前言篇
1.问:jquery源码分析的版本是什么? 答:v3.2.1 2.问:为什么要分析jquery源码? 答:javascript是一切js框架的基础,jquery.es6.vue.angular.rea ...
- jQuery源码分析-each函数
本文部分截取自且行且思 jQuery.each方法用于遍历一个数组或对象,并对当前遍历的元素进行处理,在jQuery使用的频率非常大,下面就这个函数做了详细讲解: 复制代码代码 /*! * jQuer ...
- jQuery源码分析系列(转载来源Aaron.)
声明:非本文原创文章,转载来源原文链接Aaron. 版本截止到2013.8.24 jQuery官方发布最新的的2.0.3为准 附上每一章的源码注释分析 :https://github.com/JsAa ...
- jQuery源码分析系列——来自Aaron
jQuery源码分析系列——来自Aaron 转载地址:http://www.cnblogs.com/aaronjs/p/3279314.html 版本截止到2013.8.24 jQuery官方发布最新 ...
- jQuery源码分析系列(36) : Ajax - 类型转化器
什么是类型转化器? jQuery支持不同格式的数据返回形式,比如dataType为 xml, json,jsonp,script, or html 但是浏览器的XMLHttpRequest对象对数据的 ...
- jQuery源码分析-01总体架构
1. 总体架构 1.1自调用匿名函数 self-invoking anonymous function 打开jQuery源码,首先你会看到这样的代码结构: (function( window, und ...
随机推荐
- C++ const关键字修饰引用
//const修饰引用的两种用法 #include<iostream> using namespace std; struct Teacher{ ]; int age; }; void S ...
- C++ c++与C语言的区别(三目运算符,const修饰符)
//区别⑦:三目运算符(C++版本) #include<iostream> using namespace std; //三目运算符 C语言返回变量的值 C++语言是返回变量本身 void ...
- qtcreator 中文乱码
qt输入法不能用,ui中不能显示中文,开发板不能显示中文,这几个一直困扰这我,网上查找资料,在代码中添加各种支持,都没有解决问题.今天刚好解决了,记录于此. 参考链接 http://blog.163. ...
- HashMap与HashCode有关,用Sort对象排序
遍历Map,使用keySet()可以返回set值,用keySet()得到key值,使用迭代器遍历,然后使用put()得到value值. 上面这个算法的关键语句: Set s=m.keySet(); I ...
- node 下好用的工具
1. supervisor Node Supervisor is used to restart programs when they crash. Node Supervisor 是用来当程序崩溃时 ...
- redis的简单操作
今天在代码中使用hset存入redis中:jedis.hset(key.getBytes(), field.getBytes(), ObjectInfoPojo); 需要在redis中去验证数据是否存 ...
- OpenSSL创建私有CA
1.编辑/etc/pki/tls/openssl.cnf [ CA_default ] dir = /etc/pki/CA # 工作目录certs ...
- MediaPlayer播放音频,也可以播放视频
使用MediaPlayer播放音频或者视频的最简单例子: JAVA代码部分: public class MediaPlayerStudy extends Activity { private Butt ...
- linux shell 脚本使用
定义变量 fileName=text.txt 变量名称fileName,变量名称text.txt 使用变量 $fileName 用美元符号$开头,后面加变量名称,即可使用变量 使用用户输入参数 打印第 ...
- Java 数组详解 - 用法、遍历、排序、实用API
数组,就是相同数据类型的元素按一定顺序排列的集合,就是把有限个类型相同的变量用一个名字命名,然后用编号区分他们的变量的集合,这个名字称为数组名,编号称为下标. 组成数组的各个变量称为数组的分量,也称为 ...