学习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
随机推荐
- ESP8266刷AT固件与nodemcu固件
这回是使用的这一款 因为这款默认的是支持AT指令的固件,,所以我们就刷nodemcu的 先看接线 GPIO0 默认是工作模式(不接线).如果接了低电平就是下载模式(给模块刷固件!!)所以接低电平.CH ...
- 3D旋转菜单
今天来个3D旋转菜单,是纯css3实现的,主要用到transform,transition,backface-visibility. 主要是transform这个变换,它是今天猪脚. transfor ...
- 每天多一点(2016.12.04)》Javascript隐式转换
乱想 javascript为什么需要隐式转换?如果没有会出现什么情况? 找了一圈没有看到关于这个的讨论,只好自己研究了,可能不一定正确,自行辨知. 郁闷就是郁闷在好好的,为什么要搞个隐式转换,一般来讲 ...
- NotSupportedException-无法将类型“System.DateTime”强制转换为类型“System.Object”
几张图就可以说明一切 2015-03-29 21:54:09,206 [77] ERROR log - System.NotSupportedException: 无法将类型“System.DateT ...
- 实战MEF(2):导出&导入
上一文中,我们大致明白了,利用MEF框架实现自动扫描并组装扩展组件的思路.本文我们继续前进,从最初的定义公共接口开始,一步步学会如何使用MEF. 在上一文中我们知道,对于每一个实现了公共规范的扩展组件 ...
- 【前端性能】必须要掌握的原生JS实现JQuery
很多时候,我们经常听见有人说jquery有多快多快.在这个各种类库满天飞的时候,不得不说的是,能有原生JS快吗? 是的,明显原生JS要更快,因为诸如JQuery这样的库必须要兼容各种浏览器和低版本和许 ...
- 本地maven仓库使用及配置
本地仓库的创建 下载 nexus-2.11.4-01-bundle.zip 解压并运行C:\nexus-2.11.4-01-bundle\nexus-2.11.4-01\bin\jsw\windows ...
- vmware安装win7提示No CD-ROM drive to use:GCDROM not loaded
今天安装win7 64位的操作系统到vmware虚拟机,以为一切事如此的简单,因为自己以前经常拿vmware来装系统,结果确出现下面莫名其妙的错误: 提示说没有CD-ROM,可是我明明在vmware的 ...
- 【NET MVC】View
通过阅读一些书籍,结合源代码,稍微深入的学习了Asp.Net MVC中的视图View 任何类型的响应都可以利用当前HttpResponse来响应,MVC可以通过Controller的Response属 ...
- CSS3实现图形曲线阴形和翘边阴影
首先,来看看完成之后的效果图: 实现原理 ①曲线阴影实现: 多个阴影重叠,就是正常阴影+曲线阴影 正常情况下,有个矩形有正常的阴影,作为主投影,这时候再定义一个有一定弧度圆角的圆角矩形,然后放在正常矩 ...