学习Javascript闭包(Closure)
闭包作用
1.让变量驻留在内存中
2.函数外部可以读取函数内部的私有变量
<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <title>匿名函数+Closure</title> <script type="text/javascript"> window.onload = function(){ var elems=document.getElementsByTagName('a'); for (var i = 0; i < elems.length; i++) { (function(lockIndex){ elems[lockIndex].addEventListener('click', function(event) { // body... console.info(lockIndex); // }, false); })(i); }; } </script> </head> <body> <a href="#none">用闭包保存状态</a><br/> <a href="#none">和普通function执行的时候传参数一样,自执行的函数表达式也可以这么传参,因为闭包直接可以引用传入的这些参数,利用这些被lock住的传入参数,自执行函数表达式可以有效地保存状态。</a><br/> <a href="#none">这个代码是错误的,因为变量i从来就没背locked住</a><br/> <a href="#none">这个是可以用的,因为他在自执行函数表达式闭包内部</a> </body> </html>
模拟私有变量
function Counter( start ){ var count = start; return { increment : function(){ ++count; }, getCount : function(){ return count; } } } var obj = Counter(10); obj.increment(); //count 自加 var count = obj.getCount(); //11 obj.increment(); //count 自加 var count2 = obj.getCount(); //12
这里,Counter
函数返回两个闭包,函数 increment
和函数 get
。 这两个函数都维持着 对外部作用域 Counter
的引用,因此总可以访问此作用域内定义的变量 count
.
for(var i = 0, len = 3; i < len; i++){ 2 (function(lockIndex){ 3 var count = lockIndex ; //匿名函数 init 初始化 时 -- 将循环变量i的copy 赋值给 变量 count 4 setTimeout(function(){ 5 console.log('count'+count); 6 }, 1500) 7 })(i) 8 } 9 10 11 for(var i = 0, len = 3; i < len; i++){ 12 setTimeout((function(lockIndex){ 13 var count = lockIndex ; //循环变量i的copy 14 console.log('count'+count); 15 })(i), 1500) 16 }
学习Javascript闭包(Closure)的更多相关文章
- [转载]学习Javascript闭包(Closure)
学习Javascript闭包(Closure) 源地址: http://www.ruanyifeng.com/blog/2009/08/learning_javascript_closures ...
- JavaScript闭包(Closure)
JavaScript闭包(Closure) 本文收集了多本书里对JavaScript闭包(Closure)的解释,或许会对理解闭包有一定帮助. <你不知道的JavsScript> Java ...
- 深入理解JavaScript闭包(closure)
最近在网上查阅了不少javascript闭包(closure)相关的资料,写的大多是非常的学术和专业.对于初学者来说别说理解闭包了,就连文字叙述都很难看懂.撰写此文的目的就是用最通俗的文字揭开Java ...
- javascript 闭包(closure)
<script type="text/javascript"> //闭包(closure):内层函数可以引用存在于包围它的函数内的变量,即使外层函数的执行已经结束 ...
- 通过示例学习JavaScript闭包
译者按: 在上一篇博客,我们通过实现一个计数器,了解了如何使用闭包(Closure),这篇博客将提供一些代码示例,帮助大家理解闭包. 原文: JavaScript Closures for Dummi ...
- [JS]学习Javascript闭包(Closure)
转自:阮一峰 闭包(closure)是Javascript语言的一个难点,也是它的特色,很多高级应用都要依靠闭包实现. 下面就是我的学习笔记,对于Javascript初学者应该是很有用的. 一.变量的 ...
- 学习Javascript闭包(Closure)及几个经典面试题理解
今天遇到一个面试题,结果让我百思不得其解.后来在查阅了各种文档后,理清了来龙去脉.让我们先来看看这道题: function Foo( ){ var i = 0; return function( ){ ...
- 学习Javascript闭包(Closure) by 阮一峰
闭包(closure)是Javascript语言的一个难点,也是它的特色,很多高级应用都要依靠闭包实现. 一.变量的作用域 要理解闭包,首先必须理解Javascript特殊的变量作用域. 变量的作用域 ...
- 转: 学习Javascript闭包(Closure) (阮一峰)
from: http://www.ruanyifeng.com/blog/2009/08/learning_javascript_closures.html
随机推荐
- 如果用css的border属性画一个三角形
假设页面中有个div,如何通过css做一个三角形.这是我们项目中用到的今天就稍微总结下.顺便说一句偷偷写博客的感觉还挺爽 div { width: 0; height: 0; border-top: ...
- ThinkPHP3.2设置404跳转页面
在ThinkPHP3.2版本中当我们访问不存在的页面时会出现非常不友好错误提示页面,类如下图: 解决办法: 1.在ThinkPHP3.2详细的介绍了该框架下的ThinkPHP惯例配置文件convent ...
- VS-默认端口导致项目不能加载的解决方案
- 远程管理 KVM 虚机 - 每天5分钟玩转 OpenStack(5)
上一节我们通过 virt-manager 在本地主机上创建并管理 KVM 虚机.其实 virt-manager 也可以管理其他宿主机上的虚机.只需要简单的将宿主机添加进来 填入宿主机的相关信息,确定即 ...
- 哪些HTML5特性值得期待
首先大家可以看一下<HTML5程序设计(第二版)>最后一章关于HTML5未来展望.地址:http://www.ituring.com.cn/article/1690?q=html5%E6% ...
- Ubuntu杂记——Apache+PHP+MySQL的安装
昨天晚上,参考博客园的另一篇文章,在自己的Ubuntu上搭建了一个Apache+PHP+MySQL的服务器,在此谨记,以备不时之需. 一.安装Apache sudo apt-get install a ...
- hdu4831 Scenic Popularity(线段树)
题目地址:http://acm.hdu.edu.cn/showproblem.php?pid=4831 题目大概意思就是有多个风景区和休息区,每个风景区有热度,休息区的热度与最接近的分景区的热度相同, ...
- T-Sql(八)字段索引和数据加密
t-sql的基本用法讲到第八章也差不多了,最后就讲下字段索引和数据加密,这两个内容对编程人员可能用的地方不是太多,还是那句老话“防患于未然”. 下面我就简单的说下字段索引和数据加密的内容,只是简单概述 ...
- Apache Sqoop - Overview——Sqoop 概述
Apache Sqoop - Overview Apache Sqoop 概述 使用Hadoop来分析和处理数据需要将数据加载到集群中并且将它和企业生产数据库中的其他数据进行结合处理.从生产系统加载大 ...
- C/C++,彩色图像小游戏。
这里声明,这个游戏是由本人,在大一暑假自作的第二个小游戏,转载请注明原帖地址,谢谢! 所有图片都是我一个人用ps搞出来的,比较简单.........毕竟不是学图像制作的,请体谅!另外,图片 不放出来了 ...