自调用执行函数

发表于 | 分类于

在前辈的基础上，添加了一些自己的理解，记录了自己不熟悉的知识点和盲点。

主要整理内容:

  • 自调用执行函数
  • 使用自调用函数的好处
  • 自调用匿名函数的 三种 等价写法

自调用执行函数

  • jQuery的所有代码被包裹在一个立即执行的匿名函数表达式中，这种结构称为”自调用匿名函数”.
  • 当浏览器加载完jQuery文件后，自调用匿名函数会立即开始执行，初始化jQuery的各个模块. 
1
2
3
4
5
6
7
8
9
//jQuery中的相关代码如下：    
(function (window, undefined) {
    //构建 jQuery对象
    var jQuery = ...
        // Expose jQuery to the global object
        window.jQuery = window.$ = jQuery;
    return jQuery;
})(window);

为什么创建这样一个自调用匿名函数？

通过创建一个自调用执行函数，创建了一个特殊的函数作用域(之前写过关于沙箱模式的一些理解，可以参考理解),该作用域中的代码不会和已有的同名函数、方法名和变量以及
第三方库冲突。

闭包可以确保jQuery的代码不受其他代码的干扰，并且jQuery也不会破坏或者最小程度的破坏和污染全局变量，降低对其他代码的影响。

在自调用匿名函数的最后，通过手动把变量jQuery添加到window对象上，明确地使变量jQuery成为公开的全局变量，而其他的部分将是私有的。

自调用匿名函数的 三种 等价写法

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
//写法1 (常用写法，jQuery采用这一种)
(function () {
    // ...
})();
//写法2
(function () {
    // ...
}());
//写法3
! function () {
    //...
}();
</script>

为什么要为自调用匿名函数传入参数 window，并传入window对象？

  1. 通过传入 window 对象，可以使 window 对象变为局部变量( 即把函数参数作为局部变量使用 )，这样当在jQuery中访问 window 对象时，不需要将作用域链回退到顶层作用域，从而更快的访问 window 对象.

  2. 将 window 对象作为参数传入，可以在压缩代码时进行优化。
    在压缩文件jQuery-1.7.1.min.js中被压缩为：

    1
    2
    (function(a,b){...})(window);
    //参数 window 被压缩为 a,参数 underfined 被压缩为 b

为什么要为自调用函数设置参数 undefined ?

特殊值 undefined 是 window 对象的一个属性。
通过下列代码可以验证：

1
alert('undefined' in window); //true

  1. 通过把参数undefined 作为局部变量使用，但是又不传入任何值，可以缩短查找 undefined 时的作用域链.
  2. 并且可以在压缩代码时进行优化，如前面所示，undefined 会被压缩为 b .
  3. 更重要的原因是，通过这种方式可以确保参数 undefined 的值是 undefined .因为 undefined 有可能被重写为新的值。

注意：

使用自调用匿名函数时，最好不要省略其之前和之后的 分号，否则可能抛出异常.

这个系列的学习都是基于高原著作的《jQuery技术内幕 深入解析jQuery架构设计与实现原理》的学习和理解. -感谢大神们的努力-