明凯博客

关注网站技术,一个特立独行的程序员

Javascript和Jquery的闭包概念分析详解

其实javascript里的闭包概念很简单,就是函数用到外部变量,不需要传参就可以获取。

举个例子:

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
<script> 
var sMessage = "Hello world"; 
function sayHello(){ 
alert(sMessage); 
} 
sayHello(); 
addNumber(1,2); 
 
var iBaseNum = 10; 
function addNumber(iNum1, iNum2) { 
function doAddition() { 
alert(iNum1 + iNum2 + iBaseNum); 
} 
return doAddition(); 
} 
function a(){ 
var i=0; 
function b(){ 
alert(++i); 
} 
return b; 
} 
var c = a(); 
c(); 
c(); 
</script>

第一个函数sayHello没有传参数,直接利用了sMessage变量,这个就叫做闭包。
第二个函数复杂点,里面有个doAddition也是闭包函数,他不需要参数,直接在执行环境中获取iNum1,iNum2,还有外部变量 iBaseNum。
第三个函数 是能保护 i变量的访问,并且一直保存i在内存中,可以一直增加。(闭包的一个经典用法)

jquery中闭包也差不多,先给个例子

你也许会问

1
2
3
(function($){ 
$("div p").click(function(){alert("aimks!")}); 
})(jQuery); //一个闭包

这是什么写法啊?

这里面的$只是形参,但jquery是全局变量,所以不需要调用该函数就会自动执行,或者分两步
就是转化成正常的函数,先写函数,后调用。

其实:

1
2
3
(function($){ 
$("div p").click(。。。); 
})(jQuery);

就是等于:

1
2
3
4
function tempFunction($){ //创建一个以$为形参的函数 
$("div p").click(....); 
} 
TempFunction(jQuery); //传入实参jQuery执行函数.

干脆直接这么写:

1
2
3
(function(cssrain){ 
cssrain("div p").click(.... ); 
})(jQuery); //一个闭包

闭包的基本写法:

1
(function(){do someting})();

//这个你就理解为定义一个匿名函数并立即执行
带参数的话就这样:

1
(function(形参){do someting})(实参);

另外

1
2
(function(){var upc="i am upc"})(); 
alert(upc);

会提示undefined。
因为闭包后,里面的变量就相当于局部了。
闭包的好处:
不增加额外的全局变量,
执行过程中所有变量都是在匿名函数内部。
上面的例子不是很好,跟javascript的闭包有点混淆,但这确实也是jquery中的一种闭包。只不过经过jquery的加工罢了。

, , ,

相关文章

8 条评论 “Javascript和Jquery的闭包概念分析详解

发表评论

电子邮件地址不会被公开。 必填项已用*标注