简短几句 通俗解释javascript的闭包


Posted in Javascript onJanuary 17, 2011

何谓没有被释放资源的栈区和预执行的过程,用一个最常见的示例来解释:
比方现在我们有一个ul,下面有很多个li,需要遍历他们为他们绑定单击事件,并在点击后将当前下标传递给另外一个function来进行额外的处理:

for(var i=0; i<agroup.length; i++) { 
agroup[i].onclick = function() { 


handler(i); 

} 
}

执行结果显而易见对吧?在handler中,获取传递过去的参数i,你看到的将全部是最大的下标,这个时候,我们通常用下面的办法解决:
for(var i=0; i<agroup.length; i++) { 
agroup[i].i = i 

agroup[i].onclick = function() { 


handler(this.i); 

} 
}

那么在这里,先讲一下this的指向问题,从通常来说,javascript中的this是指向当前引用他的对象的。上面我们相当为this新增了一个为i的属性,他的值就是当前的下标值。
那么用闭包的方式如何解决这个问题?其实原理相同,我们需要预先的把i值保存起来,或叫作传递:
for(var i=0; i<agroup.length; i++) { 
agroup[i].onclick = function(index) { 


return function() { 



handler(index); 


} 

}(i); 
}

这个时候你会得到正确的下标,这样做与增加i属性有何雷同之处?也就是他们都预先把下标i值传递或是储存起来。在上面的演示中,预执行onclick所引用的函数,而这个
函数当中返回了一个内嵌函数,形成一个没有被释放资源的栈区,并在预执行的时候将i值以参数的形式传入这个作用域(解释能力有问题,这句解释不知道是否准确,欢迎砖拍)。
综上所述,闭包的作用通常是改变作用域或预执行。应该看官很明白了,上面个出的示例很局限,闭包的应用范围是很广的,了解其因果,才能灵活的使用它。
auntion 2011-11-15
mail Auntion@gmail.com
QQ 82874972
原创文章,请尊重打字的辛劳和作者的权益,转载时请不要删除这里的作者信息。
Javascript 相关文章推荐
用javascript实现点击链接弹出&quot;图片另存为&quot;而不是直接打开
Aug 15 Javascript
jquery用ajax方式从后台获取json数据后如何将内容填充到下拉列表
Aug 26 Javascript
jQuery点击其他地方时菜单消失的实现方法
Apr 22 Javascript
怎样判断jQuery当前元素是隐藏还是显示
Nov 23 Javascript
解决Window10系统下Node安装报错的问题分析
Dec 13 Javascript
微信小程序 label 组件详解及简单实例
Jan 10 Javascript
详解AngularJS中$filter过滤器使用(自定义过滤器)
Feb 04 Javascript
使用jquery判断一个元素是否含有一个指定的类(class)实例
Feb 12 Javascript
Angular.js中ng-include用法及多标签页面的实现方式详解
May 07 Javascript
JavaScript实现简单的隐藏式侧边栏功能示例
Aug 31 Javascript
JavaScript/TypeScript 实现并发请求控制的示例代码
Jan 18 Javascript
详解Vue3.0 + TypeScript + Vite初体验
Feb 22 Vue.js
javascript 内存回收机制理解
Jan 17 #Javascript
javascript 延迟加载技术(lazyload)简单实现
Jan 17 #Javascript
关于COOKIE个数与大小的问题
Jan 17 #Javascript
js实现的跟随鼠标移动的时钟效果(中英文日期显示)
Jan 17 #Javascript
Jquery 插件开发笔记整理
Jan 17 #Javascript
JQuery学习笔记 nt-child的使用
Jan 17 #Javascript
Jquery知识点三 jquery表单对象操作
Jan 17 #Javascript
You might like
Windows下的PHP5.0详解
2006/11/18 PHP
php项目打包方法
2008/02/18 PHP
基于Zookeeper的使用详解
2013/05/02 PHP
php文件服务实现虚拟挂载其他目录示例
2014/04/17 PHP
Fedora下安装php Redis扩展笔记
2014/09/03 PHP
php实现无限级分类(递归方法)
2015/08/06 PHP
jQuery新闻滚动插件 jquery.roller.js
2011/06/27 Javascript
JavaScript中的getMilliseconds()方法使用详解
2015/06/10 Javascript
Kindeditor在线文本编辑器如何过滤HTML
2016/04/14 Javascript
js流动式效果显示当前系统时间
2016/05/16 Javascript
jQuery ajax全局函数处理session过期后的ajax跳转问题
2016/06/03 Javascript
js style.display=block显示布局错乱问题的解决方法
2016/09/21 Javascript
有关文件上传 非ajax提交 得到后台数据问题
2016/10/12 Javascript
微信小程序  modal详解及实例代码
2016/11/09 Javascript
Vue.js中的图片引用路径的方式
2017/07/28 Javascript
Layui数据表格 前后端json数据接收的方法
2019/09/19 Javascript
Vue 实现登录界面验证码功能
2020/01/03 Javascript
JavaScript实现tab栏切换效果
2020/03/16 Javascript
[04:32]DOTA2著名解说配音敌法师 现场专访海涛怒切假腿
2013/12/20 DOTA
使用python Django做网页
2013/11/04 Python
python简单程序读取串口信息的方法
2015/03/13 Python
使用python装饰器计算函数运行时间的实例
2018/04/21 Python
python 将print输出的内容保存到txt文件中
2018/07/17 Python
详解Python with/as使用说明
2018/12/13 Python
python hash每次调用结果不同的原因
2019/11/21 Python
Python实现变声器功能(萝莉音御姐音)
2019/12/05 Python
python中re模块知识点总结
2021/01/17 Python
css3 按钮样式简单可扩展创建
2013/03/18 HTML / CSS
中专自我鉴定范文
2013/10/16 职场文书
五一口号
2014/06/19 职场文书
区长工作作风个人整改措施
2014/10/01 职场文书
广告业务员岗位职责
2015/02/13 职场文书
2015年酒店年度工作总结
2015/05/23 职场文书
赵氏孤儿观后感
2015/06/09 职场文书
2016年第二十五次全国助残日活动总结
2016/04/01 职场文书
解决hive中导入text文件遇到的坑
2021/04/07 Python