简短几句 通俗解释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 相关文章推荐
JQuyer $.post 与 $.ajax 访问WCF ajax service 时的问题需要注意的地方
Sep 20 Javascript
js用正则表达式来验证表单(比较齐全的资源)
Nov 17 Javascript
浅析hasOwnProperty方法的应用
Nov 20 Javascript
Jqgrid表格随窗口大小改变而改变的简单实例
Dec 28 Javascript
网页实时显示服务器时间和javscript自运行时钟
Jun 09 Javascript
JS控制FileUpload的上传文件类型实例代码
Oct 07 Javascript
JS中去掉array中重复元素的方法
May 26 Javascript
vue init失败简单解决方法(终极版)
Dec 22 Javascript
手写Node静态资源服务器的实现方法
Mar 20 Javascript
微信小程序发送短信验证码完整实例
Jan 07 Javascript
Element的el-tree控件后台数据结构的生成以及方法的抽取
Mar 05 Javascript
JS实现碰撞检测效果
Mar 12 Javascript
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
php学习笔记 数组的常用函数
2011/06/13 PHP
php实现mysql备份恢复分卷处理的方法
2014/12/26 PHP
CI分页类首页、尾页不显示的解决方法
2016/03/28 PHP
PHP微信PC二维码登陆的实现思路
2017/07/13 PHP
PHP给源代码加密的几种方法汇总(推荐)
2018/02/06 PHP
php多进程模拟并发事务产生的问题小结
2018/12/07 PHP
一个关于jqGrid使用的小例子(行按钮)
2011/11/04 Javascript
NodeJS Web应用监听sock文件实例
2015/02/18 NodeJs
js实现同一个页面多个渐变效果的方法
2015/04/10 Javascript
JS+CSS相对定位实现的下拉菜单
2015/10/06 Javascript
详解使用vue实现tab 切换操作
2017/07/03 Javascript
backbone简介_动力节点Java学院整理
2017/07/14 Javascript
js使用generator函数同步执行ajax任务
2017/09/05 Javascript
JavaScript实现省市联动过程中bug的解决方法
2017/12/04 Javascript
ant design中upload组件上传大文件,显示进度条进度的实例
2020/10/29 Javascript
[07:09]2014DOTA2国际邀请赛-Newbee再次发威成功晋级决赛
2014/07/19 DOTA
django rest framework之请求与响应(详解)
2017/11/06 Python
浅谈Django自定义模板标签template_tags的用处
2017/12/20 Python
python 利用浏览器 Cookie 模拟登录的用户访问知乎的方法
2019/07/11 Python
Django使用unittest模块进行单元测试过程解析
2019/08/02 Python
如何基于Django实现上下文章跳转
2020/09/16 Python
Python Http请求json解析库用法解析
2020/11/28 Python
python pyg2plot的原理知识点总结
2021/02/28 Python
美国知名日用品连锁超市:Dollar General(多来店)
2017/01/14 全球购物
加拿大女包品牌:Matt & Nat
2017/05/12 全球购物
介绍一下write命令
2014/08/10 面试题
2014两会学习心得:榜样精神伴我行
2014/03/17 职场文书
企业宗旨标语
2014/06/10 职场文书
乡镇党委书记个人整改措施
2014/09/15 职场文书
汽车机电维修工求职信
2014/09/30 职场文书
泸县召开党的群众路线教育实践活动总结大会新闻稿
2014/10/21 职场文书
2015年社区矫正工作总结
2015/04/21 职场文书
2015初一年级组工作总结
2015/07/24 职场文书
Python中tkinter的用户登录管理的实现
2021/04/22 Python
Java工作中实用的代码优化技巧分享
2022/04/21 Java/Android
美国运营商 T-Mobile 以 117.83Mb/s 的速度排第一位
2022/04/21 数码科技