jQuery技术内幕 深入解析jQuery架构设计与实现原理

jquery的外衣

jquery是一个轻量级的JS框架

//以下截取自jquery源码片段
(function( window, undefined ) {
/* 源码内容 */
})( window );

  上面这一小段代码来自于1.9.0当中jquery的源码,它是一个无污染的JS插件的标准写法,专业名词叫闭包。可以把它简单的看做是一个函数,与普通函数不同

的是,这个函数没有名字,而且会立即执行,就像下面这样,会直接弹出字符串。

(function( window, undefined ) {
alert("Hello World!");
})( window );

  可以看出来这样写的直接效果,就相当于我们直接弹出一个字符串。但是不同的是,我们将里面的变量变成了局域变量,这不仅可以提高运行速度,更重要的是

我们在引用jquery的JS文件时,不会因为jquery当中的变量太多,而与其它的JS框架的变量命名产生冲突。对于这一点,我们拿以下这一小段代码来说明。

 var temp = "Hello World!";
(function( window, undefined ) {
var temp = "ByeBye World!";
})( window );
alert(temp);

  这段代码的运行结果是Hello而不是ByeBye,也就是说闭包中的变量声明没有污染到外面的全局变量,倘若我们去掉闭包,则最终的结果会是ByeBye,就像下面这样。

  var temp = "Hello World!";
// (function( window, undefined ) {
var temp = "ByeBye World!";
// })( window );
alert(temp);

  由此就可以看出来,jquery的外衣就是这一层闭包,它是很重要的一个内容,是编写JS框架必须知道的知识,它可以帮助我们隐藏我们的临时变量,降低污染。

Jquery和$

window.jQuery = window.$ = jQuery;

  这一句话将我们在闭包当中定义的jQuery对象导出为全局变量jQuery和$,因此我们才可以在外部直接使用jQuery和$。window是默认的JS上下文环境,因此将对

象绑定到window上面,就相当于变成了传统意义上的全局变量,就像下面这一小段代码的效果一样。

 var temp = "Hello World!";
(function( window, undefined ) {
var temp = "ByeBye World!";
window.temp = temp;
})( window );
alert(temp);

  很明显,它的结果应该是ByeBye,而不是Hello。因为我们在闭包中导出了temp局部变量为全局变量,从而覆盖了第一行声明的全局变量temp。

自调匿名函数

jQuery技术内幕 深入解析jQuery架构设计与实现原理

上一篇:python 标准库 glob ,python glob 学习


下一篇:Math对象