版本: 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 );这段代码的主要功能就是:导入那省略的一万多行功能代码。