您的位置：首页 > Web前端 > JavaScript

理解JavaScript中的闭包

2015-11-29 22:23 363 查看

闭包的定义最初是来自一些学习资料上的说明，比如说闭包的意思是封闭包围，用于模拟一个私有变量的访问，通过成员函数的返回，才能访问成员变量//我可能说的跟C#一样了囧

先来看几个例子吧

var func = function(n,c){//这个函数创建一个对象
var name =n;//成员变量
var classnum = c;
return {//Json的写法， 返回一个对象 访问这个对象外部的变量
_getName:function(){
return name;
},
_setName:function(v){
name=v;
},
_getClassNum :function(){
return classnum;
},
_setClassNum : function(v){
classnum=v;
}

};

}

var liuzhe =  func("liuzhe",452);//创建对象

//alert(liuzhe._getClassNum());
//alert(liuzhe._getName());
//liuzhe._setName("光恒");
//alert(liuzhe._getName());
//alert(liuzhe._getName());

这里就可以看出闭包的一个应用场景：返回的对象可以访问函数的name和classnum，也只能通过这个返回函数来访问，这就封闭包围了name与classnum这两个变量，类似C#中的属性，保证了数据安全。而且由于返回对象引用了它外部函数中的name与classnum变量，所以执行func("liuzhe",452)，之后这个外部函数并不会被GC，这就一直维持着这两个变量。使得这两个变量的值一直保存在内存中。

再看下一段代码

<!DOCTYPE html>
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8"/>
<title>闭包练习</title>
<script type="text/javascript">
var outer = function () {
var variantouter = 1;

var inner =function(){
alert(variantouter);

}
variantouter=5;
return inner;

}
var test = outer();
test();
test();

</script>
</head>
<body>

</body>
</html>

执行之后弹窗跳出的是5，并不是1，因为inner是outer的一个闭包，这个闭包引用了outer的variantouter，所以当执行outer()后，内存中是有一个outer函数的存在的，而且它的variantouter是5，也就是下一步修改的数字，所以inner查找到这个variantouter是5。那么如果类似是onclick事件，要处理解释到inner时的变量这么办？答案是用一个立即执行的函数再创建一个闭包，把解释到inner时的variantouter当作函数的参数执行一次。代码如下：

var inner =(function(arg){ return function() {
alert(arg);
};})(variantouter);

写一个立即自动执行的函数，将variantouter传进去，这样立即执行的函数创建的闭包就能够保存浏览器解释到这一步时的variantouter，而不是当查找ariantouter时，要到内存中找变化到最后的那个值。

理解可能有误，而且理论解释也很生涩，可能我举的例子也很无聊，所以没人会觉得有用。。。囧

内容来自用户分享和网络整理，不保证内容的准确性，如有侵权内容，可联系管理员处理

标签：

相关文章推荐

新的分享

章节导航