浅析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 相关文章推荐
jquery select操作的日期联动实现代码
Dec 06 Javascript
javascript实现yield的方法
Nov 06 Javascript
实现无刷新联动例子汇总
May 20 Javascript
JavaScript实现Iterator模式实例分析
Jun 09 Javascript
JavaScript高级程序设计(第三版)学习笔记1~5章
Mar 11 Javascript
angular.js分页代码的实例
Jul 27 Javascript
Three.js学习之正交投影照相机
Aug 01 Javascript
JS判断输入字符串长度实例代码(汉字算两个字符,字母数字算一个)
Aug 02 Javascript
详解Vue 普通对象数据更新与 file 对象数据更新
Apr 26 Javascript
jQuery 禁止表单用户名、密码自动填充功能
Oct 30 jQuery
React Hooks的深入理解与使用
Nov 12 Javascript
JS常用跨域方法实现原理解析
Dec 09 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
萌王史莱姆”萌王性别尴尬!那“萌战”归女组还是男?
2018/12/17 日漫
咖啡的化学
2021/03/03 咖啡文化
php根据分类合并数组的方法实例详解
2013/11/06 PHP
PHPAnalysis中文分词类详解
2014/06/13 PHP
PHP随机获取未被微信屏蔽的域名(微信域名检测)
2017/03/19 PHP
php微信公众号开发之现金红包
2018/04/16 PHP
WebGame《逆转裁判》完整版 代码下载(1月24日更新)
2007/01/29 Javascript
jquery 弹出层实现代码
2009/10/30 Javascript
JavaScript Event学习补遗 addEventSimple
2010/02/11 Javascript
javascript之通用简单的table选项卡实现(二)
2010/05/09 Javascript
js change,propertychange,input事件小议
2011/12/20 Javascript
jQuery文本框(input textare)事件绑定方法教程
2013/04/24 Javascript
容易造成JavaScript内存泄露几个方面
2014/09/04 Javascript
小议JavaScript中Generator和Iterator的使用
2015/07/29 Javascript
基于HTML5上使用iScroll实现下拉刷新,上拉加载更多
2016/05/21 Javascript
node.js中的事件处理机制详解
2016/11/26 Javascript
详解Angular 开发环境搭建
2017/06/22 Javascript
VueAwesomeSwiper在VUE中的使用以及遇到的一些问题
2018/01/11 Javascript
React Router v4 入坑指南(小结)
2018/04/08 Javascript
3分钟读懂移动端rem使用方法(推荐)
2019/05/06 Javascript
vue elementUI 表单校验的实现代码(多层嵌套)
2019/11/06 Javascript
vue中上传视频或图片或图片和文字一起到后端的解决方法
2019/12/01 Javascript
Vue.js 实现地址管理页面思路详解(地址添加、编辑、删除和设置默认地址)
2019/12/11 Javascript
vue自动添加浏览器兼容前后缀操作
2020/08/13 Javascript
python中尾递归用法实例详解
2015/04/28 Python
python使用json序列化datetime类型实例解析
2018/02/11 Python
python opencv设置摄像头分辨率以及各个参数的方法
2018/04/02 Python
Python中的上下文管理器和with语句的使用
2018/04/17 Python
Python列表对象实现原理详解
2019/07/01 Python
python中count函数知识点浅析
2020/12/17 Python
CSS3动画和HTML5新特性详解
2020/08/31 HTML / CSS
几个SQL的面试题
2014/03/08 面试题
汽车电子与维修专业大学生求职信
2013/09/28 职场文书
地球一小时活动总结
2015/02/27 职场文书
CSS3实现的侧滑菜单
2021/04/27 HTML / CSS
python3实现常见的排序算法(示例代码)
2021/07/04 Python