一、jQuery整体架构

一、自调用函数

　　jQuery整体架构：

( function( global, factory ) {
} )( typeof window !== "undefined" ? window : this, function( window, noGlobal ) {} );

　　代码分析：jQuery的所有代码都被包含在一个立即执行的匿名函数这种代码可以称为“自调用函数”，上述代码可以简化为

( function( 形参global, 形参factory ) {
} )(实参a, 实参b );

　　匿名函数的作用：

　　通过创建一个自调用匿名函数，创建了一个特殊的函数作用域，该作用域的代码不会和已有的同名函数、方法和变量以及第三方库冲突。任何JavaScript库和框架所必须具备的功能：自己的代码不会受到其他代码（其他js库或框架）的干扰，并且自己的代码不会污染或破坏全局变量以至于影响其他代码。

　　匿名函数的常见写法（大概有十种或更多，我们只选择有代表性的两种）：

　　1、jQuery完整版使用的写法

(function () {
    //......
})();

　　2、jQuery压缩版的写法

!function () {
    //......
}();

　　注意：在匿名函数之前或之后最好加上“;”，否则有可能抛出异常　

代码详解：

　　　　1、实参a： typeof window !== "undefined" ? window : this, 用于判断当前环境是否支持window,支持就使用window，否则就使用this。

　　　　　　作用：通过传入window对象，可以使window对象变为局部变量（即把函数参数作为局部变量使用），这样当在jQuery代码块中访问window对象是，不需要讲作用域链回退到顶层作用域，从而更改地访问window对象，另外，将window对象作为参数传入，可以在压缩代码中进行优化，例如在jQuery v3.3.1压缩版中：

!function(e,t){}()

形参global变成e,factory变成t。

　　　　2、实参b：function( window, noGlobal ) {}，里面存放的是jQuery的功能函数。

　　　　　　　　函数中形参noGlobal的作用是：模块化时，不设置全局。在实参b里面，定义了一个jQuery变量，它是一个方法，执行后返回一个新jQuery对象。在"window.jQuery = window.$ = jQuery"中会让window.jQuery和window.$两个全局变量引用这个jQuery方法。

if ( !noGlobal ) {
	window.jQuery = window.$ = jQuery;
}

　　

　　　　3、匿名函数解析：

 function( global, factory ) {
    "use strict"; //执行JavaScript严格模式
    if ( typeof module === "object" && typeof module.exports === "object" ) {　　//module和module.exports是node.js中创建模块的方法，如果条件成立则执行下列代码兼容node.js,通过factory中间转换使jQuery各个函数功能通过node.js建立模块的方法给建立起来，否则直接执行factory函数。
        module.exports = global.document ?　　//判断当前环境是否支持window.document,
            factory( global, true ) :　　//支持的话直接执行factory()函数
            function( w ) {　　//否则执行函数，报告当前环境不适用jQuery，但是最后仍然返回factory（）函数
                if ( !w.document ) {
                    throw new Error( "jQuery requires a window with a document" );
                }
                return factory( w );
            };
    } else {
        factory( global );
    }
} 

 　　　　4、jQuery代码的总体结构

var
    version = "3.3.1",
    jQuery = function( selector, context ) { //构造jQuery对象
        return new jQuery.fn.init( selector, context );
    }