浅析javascript闭包 实例分析


Posted in Javascript onDecember 25, 2010

官方解释
“闭包”是一个拥有许多变量和绑定了这些变量的环境表达式(通常是一个函数),因而这些变量也是环境表达式的一部分。
通俗解释
Javascript中所有的函数都是一个闭包。不过一般来说,嵌套的function产生的闭包更为强大,也是大部分时候我们所说的“闭包”。看如下代码:

<script type="text/javascript"> 
<!-- 
//外层函数a 
function a(){ 
//临时变量i 
var i = 0; 
//内层函数b 
function b(){ 
//引用外层临时变量i 
alert(++i); 
} 
//执行结果,返回内层函数b 
return b; 
} 
//执行外层函数a,同时给c一个指向内层函数b的引用 
//若按正常理解,此语句执行完后i将被GC回收,此时的i应为“undefine” 
var c = a(); 
//执行内层函数,由于闭包的缘故,函数b中i仍然引用的是外部的临时变量i 
c(); 
--> 
</script>

这段脚本在执行完var c=a()之后,变量c实际上就指向了函数b,b中用到了变量i,再执行c()后就会弹出一个窗口显示i的值。这段代码其实就是一个闭包,为什么?因为函数a外的变量c引用了函数a内部的函数b。
Javascript的垃圾回收机制
由于javascript特殊的垃圾回收机制,才导致了闭包的产生。Javascript垃圾回收机制的大体规则如下:
在javascript中,如果一个对象不再被引用,那么这个对象就会被GC回收。如果两个对象相互引用,而不再被第3者引用,那么这两个互相引用的对象也会被回收。而在上述的脚本中,函数a被b引用,函数b又被函数a外的c所引用,这就是为什么函数a执行后不被回收的原因。
闭包的应用场景
1. 保护函数内的变量安全。以上面的例子为例,函数a中变量i只有函数b才能访问,而无法通过其他途径访问到,因此保护了i的安全性。
2. 在内存中维持一个变量。依然如上面的例子,由于闭包,函数a中的i一直存在于内存中,因此每次执行c(),i都会加1。
3. 通过保护变量的安全实现JS私有属性和私有方法(不能被外部访问)。如下,私有属性和私有方法在Constructor外是无法访问的:
function Constructor(…){ 
var that = this; 
var membername = value; 
function membername(…){…} 
}
Javascript 相关文章推荐
提高网站信任度的技巧
Oct 17 Javascript
基于jquery实现的一个选择中国大学的弹框 (数据、步骤、代码)
Jul 26 Javascript
javascript jq 弹出层实例
Aug 25 Javascript
extjs 时间范围选择自动判断的实现代码
Jun 24 Javascript
深入理解requestAnimationFrame的动画循环
Sep 20 Javascript
js在ie下打开对话窗口的方法小结
Oct 24 Javascript
js实现产品缩略图效果
Mar 10 Javascript
微信小程序实现倒计时60s获取验证码
Apr 17 Javascript
Vue.directive使用注意(小结)
Aug 31 Javascript
node错误处理与日志记录的实现
Dec 24 Javascript
原生js实现获取form表单数据代码实例
Mar 27 Javascript
解决vue cli4升级sass-loader(v8)后报错问题
Jul 30 Javascript
父子窗体间传递JSON格式的数据的代码
Dec 25 #Javascript
javascript自执行函数之伪命名空间封装法
Dec 25 #Javascript
Ext对基本类型的扩展 ext,extjs,format
Dec 25 #Javascript
JQuery live函数
Dec 24 #Javascript
jquery 单击li防止重复加载的实现代码
Dec 24 #Javascript
基于jquery的关于动态创建DOM元素的问题
Dec 24 #Javascript
在JavaScript中获取请求的URL参数
Dec 22 #Javascript
You might like
很实用的一个完整email发送程序
2006/10/09 PHP
php5.4以下版本json不支持不转义内容中文的解决方法
2015/01/13 PHP
对联广告js flash激活
2006/10/19 Javascript
JavaScript语句可以不以;结尾的烦恼
2007/03/08 Javascript
JS的replace方法详细介绍
2012/11/09 Javascript
JavaScript中的noscript元素属性位置及作用介绍
2013/04/11 Javascript
浅析showModalDialog数据缓存问题(用禁止浏览器缓存解决)
2013/07/09 Javascript
几种设置表单元素中文本输入框不可编辑的方法总结
2013/11/25 Javascript
javascript 终止函数执行操作
2014/02/14 Javascript
jquery取消选择select下拉框示例代码
2014/02/22 Javascript
JavaScript+html5 canvas绘制缤纷多彩的三角形效果完整实例
2016/01/26 Javascript
jquery获取复选框checkbox的值的简单实现方法
2016/05/26 Javascript
jQuery根据name属性进行查找的用法分析
2016/06/23 Javascript
基于zepto.js实现手机相册功能
2017/07/11 Javascript
浅谈angular.js跨域post解决方案
2017/08/30 Javascript
手把手教你vue-cli单页到多页应用的方法
2018/05/31 Javascript
Vue模拟数据,实现路由进入商品详情页面的示例
2018/08/31 Javascript
JavaScript中七种流行的开源机器学习框架
2018/10/11 Javascript
vue中组件的过渡动画及实现代码
2018/11/21 Javascript
vue 框架下自定义滚动条(easyscroll)实现方法
2019/08/29 Javascript
jQuery实现简单日历效果
2020/07/05 jQuery
django1.8使用表单上传文件的实现方法
2016/11/04 Python
详解Python3.6安装psutil模块和功能简介
2018/05/30 Python
对numpy Array [: ,] 的取值方法详解
2018/07/02 Python
python实现简单http服务器功能
2018/09/17 Python
python文件拆分与重组实例
2018/12/10 Python
深入解析Python小白学习【操作列表】
2019/03/23 Python
Python数据类型之String字符串实例详解
2019/05/08 Python
详解使用django-mama-cas快速搭建CAS服务的实现
2019/10/30 Python
python框架flask表单实现详解
2019/11/04 Python
python 已知平行四边形三个点,求第四个点的案例
2020/04/12 Python
使用CSS3创建动态菜单效果
2015/07/10 HTML / CSS
中文系师范生自荐信
2013/10/01 职场文书
注塑工厂厂长岗位职责
2013/12/02 职场文书
运动员代表致辞
2015/07/29 职场文书
Python 使用 Frame tkraise() 方法在 Tkinter 应用程序中的Frame之间切换
2022/04/24 Python