jQuery源码解析之自调用匿名函数

(function( window, undefined ) {
// 构造jQuery 对象
var jQuery = (function() {
var jQuery = function( selector, context ) {
return new jQuery.fn.init( selector, context, ro otjQuery );
}
return jQuery;
})();
// 工具方法 Utilities
// 回调函数列表 Callbacks Object
// 异步队列 Deferred Object
// 浏览器功能测试 Support
// 数据缓存 Data
// 队列 Queue
// 属性操作 Attributes
// 事件系统 Events
// 选择器 Sizzle
// DOM 遍历 Traversing
// DOM 操作 Manipulation
// 样式操作 CSS(计算样式、内联样式)
// 异步请求 Ajax
// 动画 Effects
// 坐标 Offset、尺寸 Dimensions
window.jQuery = window.$ = jQuery;
})(window);




自调用匿名函数
从上述代码中我们可以看到,jQuery的所有代码都被包裹在一个立即执行的匿名函数中表达式中,这种代码结构叫做自调用匿名函数,当浏览器加载完jQuery文件之后,自调用匿名函数会立即开始执行


(function( window, undefined ) {
var jQuery = ...
// ...
window.jQuery = window.$ = jQuery;
})(window);




1)为什么要创建这样一个自调用匿名函数?
通过创建一个自调用匿名函数,创建了一个特殊的函数作用域,该作用域中的代码不
会和已有的同名函数、方法和变量以及第三方库冲突。由于jQuery 会被应用在成千上万的
JavaScript 程序中,所以必须确保jQuery 的代码不会受到其他代码的干扰,并且jQuery 不能破坏和污染全局变量以至于影响到其他代码。这一点是任何一个JavaScript 库和框架所必须
具备的功能。
注意,在这个自调用匿名函数的最后,通过手动把变量jQuery 添加到window 对象上,
明确地使变量jQuery 成为公开的全局变量,而其他的部分将是私有的。
另外,自调用匿名函数还可以有两种等价的写法,如下所示(注意加了底纹的圆括号的
位置):
// 写法1(常见写法,也是 jQuery 所采用的)
( function() {
// ...
} )();
// 写法2
( function() {
// ...
}() );
// 写法3
!function() {
// ...


为什么要为自调用匿名函数设置参数window,并传入window 对象?


通过传入window 对象,可以使window 对象变为局部变量(即把函数参数作为局部
变量使用),这样当在jQuery 代码块中访问window 对象时,不需要将作用域链回退到顶
层作用域,从而可以更快地访问window 对象,这是原因之一;另外,将window 对象作
为参数传入,可以在压缩代码时进行优化,在压缩文件jquery-1.7.1.min.js 中可以看到下
面的代码:
(function(a,b){ ... })(window);
// 参数 window 被压缩为 a,参数 undefined 被压缩为 b


什么要为自调用匿名函数设置参数undefined ?
特殊值undefined 是window 对象的一个属性,例如,执行下面的代码将会弹出true:
alert( "undefined" in window ); // true
通过把参数undefined 作为局部变量使用, 但是又不传入任何值, 可以缩短查
找undefined 时的作用域链,并且可以在压缩代码时进行优化,如前面代码所示,参数
undefined 会被压缩为b。
另外,更重要的原因是,通过这种方式可以确保参数undefined 的值是undefined,因为
undefiend 有可能会被重写为新的值




注意到自调用匿名函数最后的分号(;)了吗?
通常在JavaScript 中,如果语句分别放置在不同的行中,则分号(;)是可选的,但是对
于自调用匿名函数来说,在之前或之后省略分号都可能会引起语法错误。例如,执行下面的
两个例子,就会抛出异常。
例1 在下面的代码中,如果自调用匿名函数的前一行末尾没有加分号,则自调用匿名
函数的第一对括号会被当作是函数调用。
var n = 1
( function(){} )()
// TypeError: number is not a function
例2 在下面的代码中,如果未在第一个自调用匿名函数的末尾加分号,则下一行自调
用匿名函数的第一对括号会被当作是函数调用。
( function(){} )()
( function(){} )()
// TypeError: undefined is not a function
所以,在使用自调用匿名函数时,最好不要省略自调用匿名函数之前和之后的分号。
  • 0
    点赞
  • 0
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值