jQuery中(function(){})()执行顺序的理解

jQuery中 (function(){})() 这种写法是一种立即执行函数表达式（Immediately-Invoked Function Expression，缩写为IIFE），通常用于避免全局变量的污染和函数命名冲突等问题。

该函数表达式在加载 jQuery 库时就会立即执行，而不需要等到 DOM 加载完毕。这个函数可以用来安装 jQuery 插件、定义私有变量、赋值给命名空间等操作。

在解释函数执行顺序之前，先来讲一下IIFE的基本语法：

(function(arg1, arg2,...){
    // 函数体
}(arg1_value, arg2_value,...));

函数体内的代码在定义的时候就被执行了，并且接受外部参数 arg1, arg2, ...。在定义后直接给 IIFE 传入参数 arg1_value, arg2_value, ... 可以直接调用函数体内的代码。这样做的好处也在于保护变量不被污染。

在jQuery中通过IIFE来扩展jQuery库中的函数，例如下面的代码给 jQuery 添加了一个新函数：

(function($){
    $.fn.redColor = function(){
        this.css({'color': 'red'})
    }
})(jQuery);

在这个示例中，函数接收的参数名是$，表示我们可以在代码中使用$作为 jQuery 的别名。通过定义 $.fn.redColor 函数，为所有 jQuery 对象添加了一个名为 redColor 的方法，这个方法可以使调用它的 jQuery 对象的字体变为红色。

至于IIFE函数执行顺序，其实是没有明确的规定的。但是在大部分情况下，jQuery的IIFE函数会在DOM树构建完成后，即document对象完全创建后再执行。

再看一个示例：

<script src="jquery.js"></script>
<script>
(function($){
    console.log("step1");
    $(document).ready(function(){
        console.log("step2");
    });
    console.log("step3");
})(jQuery);
</script>

在这个示例中，IIFE 函数包含了3个console语句，分别输出“step1”，“step3”和“step2”。这表明在执行IIFE时，在它内部包含的文本不会被阻塞，在 console 描述的仅仅是执行顺序而已。

当页面加载jQuery库的时候，它会将 jQuery 和 $ 对象附加在全局对象 window 上。在 IIFE 函数内部，$ 参数可以保证是 jQuery 对象，以此避免了 jQuery 与其他库发生命名冲突。

总之，IIFE 函数是一种非常强大的编程技巧，充分体现了 JavaScript 强大的灵活性。在 jQuery 库的应用中，IIFE 函数常常用于在 jQuery 对象上扩展新的函数和方法。