浅析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 相关文章推荐
javascript读取RSS数据
Jan 20 Javascript
javascript 简单抽屉效果的实现代码
Mar 09 Javascript
js前台判断开始时间是否小于结束时间
Feb 23 Javascript
弹出窗口并且此窗口带有半透明的遮罩层效果
Mar 13 Javascript
原生的html元素选择器类似jquery选择器
Oct 15 Javascript
JS解析XML文件和XML字符串详解
Apr 17 Javascript
JS实现自动定时切换的简洁网页选项卡效果
Oct 13 Javascript
轻松掌握JavaScript状态模式
Sep 07 Javascript
关于js陀螺仪的理解分析
Apr 11 Javascript
浅谈vue.use()方法从源码到使用
May 12 Javascript
详解微信小程序支付流程与梳理
Jul 16 Javascript
vue父子组件间引用之$parent、$children
May 20 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
解析php中memcache的应用
2013/06/18 PHP
php实现猴子选大王问题算法实例
2015/04/20 PHP
PHP中JSON的应用技巧
2015/10/10 PHP
PHP Try-catch 语句使用技巧
2016/02/28 PHP
CI框架文件上传类及图像处理类用法分析
2016/05/18 PHP
PHP基于mcript扩展实现对称加密功能示例
2019/02/21 PHP
PHP使用DOM对XML解析处理操作示例
2019/07/04 PHP
php如何把表单内容提交到数据库
2019/07/08 PHP
laravel 5.3 单用户登录简单实现方法
2019/10/14 PHP
clientX,pageX,offsetX,x,layerX,screenX,offsetLeft区别分析
2010/03/12 Javascript
基于jquery的网站幻灯片切换效果焦点图代码
2013/09/15 Javascript
javacript使用break内层跳出外层循环分析
2015/01/12 Javascript
简单学习JavaScript中的for语句循环结构
2015/11/10 Javascript
jquery实现定时自动轮播特效
2015/12/10 Javascript
全面了解addEventListener和on的区别
2016/07/14 Javascript
深入学习Bootstrap表单
2016/12/13 Javascript
Vue用v-for给src属性赋值的方法
2018/03/03 Javascript
解决VUE中document.body.scrollTop为0的问题
2018/09/15 Javascript
JavaScript刷新页面的几种方法总结
2019/03/28 Javascript
微信小程序实现一张或多张图片上传(云开发)
2019/09/25 Javascript
vue绑定数字类型 value为数字的实例
2020/08/31 Javascript
vue v-on:click传递动态参数的步骤
2020/09/11 Javascript
uniapp电商小程序实现订单30分钟倒计时
2020/11/01 Javascript
Python 第一步 hello world
2009/09/25 Python
浅谈Django REST Framework限速
2017/12/12 Python
Django自定义过滤器定义与用法示例
2018/03/22 Python
python 3.7.0 安装配置方法图文教程
2018/08/27 Python
python3学生名片管理v2.0版
2018/11/29 Python
python实现一个简单的ping工具方法
2019/01/31 Python
如何通过50行Python代码获取公众号全部文章
2019/07/12 Python
Pycharm无法打开双击没反应的问题及解决方案
2020/08/17 Python
科学发展观演讲稿
2014/09/11 职场文书
计算机实训报告范文
2014/11/05 职场文书
2014年林业工作总结
2014/12/05 职场文书
CSS精灵图的原理与使用方法介绍
2022/03/17 HTML / CSS