一个简单的例子,如果想循环输出数组中的每一个数值我们可以利用for循环来输出例如:

<script type="text/javascript">
var arr=["a","b","c","d","e"];
for (var i=0;i<arr.length;i++){
document.write(arr[i]);
}
</script>

这是最常见不过的一种了,i从0循环到5把数组中的5个值都输出出来,这里的i正好是arr数组的下标,所以循环出来了~但是看下面的例子又会跟我们想的不一样

<a href="#">text</a>
<br>
<a href="#">link</a>
<script type="text/javascript">
var as = document.getElementsByTagName('a');
for ( var i = as.length; i--; ) {
  as[i].onclick = function() {
    alert(i);
    return false;
  }
}
</script>

这个时候的会始终弹出-1来,因为里面的函数(onclick=function(){})根本没有i这个变量,换句话说i是无法在这个函数中调用的,因为没有传进值来,所以js会去回溯到父级去找这个i变量,当找到i的时候这个for循环其实已经循环完了,这样i就边城了-1所以每次弹出的就都是-1了,想解决这个问题也简单,用闭包传参的形式就可以了代码如下:

<a href="#">text</a>
<br>
<a href="#">link</a>
<script type="text/javascript">
var as=document.getElementsByTagName('a');
for(var i=as.length;i--){
  as[i].onclick=(function(i){
    return function(){
      alert(i);
    }
  })(i);
}
</script>

这样就可以把i作为参数传给里面的函数使用了。

js的for循环闭包问题的更多相关文章

  1. 你不知道的JS之作用域和闭包(五)作用域闭包

    原文:你不知道的js系列 一个简单粗暴的定义 闭包就是即使一个函数在它所在的词法作用域外部被执行,这个函数依然可以访问这个作用域. 比如: function foo() { var a = 2; fu ...

  2. js的closures(闭包)

    JS中的闭包(closure) 闭包(closure)是Javascript语言的一个难点,也是它的特色,很多高级应用都要依靠闭包实现.下面就是我的学习笔记,对于Javascript初学者应该是很有用 ...

  3. js匿名函数和闭包总结

    js匿名函数和闭包总结 一.总结 一句话总结:匿名函数的最主要作用是创建闭包,闭包就是将函数内部和函数外部连接起来的一座桥梁.内层的函数可以使用外层函数的所有变量,即使外层函数已经执行完毕.闭包可以用 ...

  4. js 控制Div循环显示 非插件版

    <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/ ...

  5. js种的循环语句

    //js种的循环语句 //while与do while的区别是while是满足条件后才执行 //do while是不管满不满足条件都会执行一次 //for 循环与while,do while相比循环结 ...

  6. js中的循环语句

    js中的循环语句可分为三种:1.while:2.do……while:3.for. while的语法为 while (exp) {    //statements;} var a=1,b=0; whil ...

  7. js的事件循环绑定和jQuery的隐式迭代

    js的事件循环绑定和jQuery的隐式迭代 js事件循环绑定 jQuery隐式迭代 先举一个例子:给定一个ul,点击列表内的每一个li元素,使它的背景色变红,下边分别用js代码和jQuery实现. & ...

  8. 原生JS—实现图片循环切换的两种方法

    今天我们主要讲讲如何使用原生JS实现图片的循环切换的方法.多余的话我们就不多说了,我们一个一个开始讲吧. 1  原生JS实现图片循环切换 -- 方法一 在上栗子之前我们先简单介绍一下所用的一些知识点. ...

  9. 原生JS—实现图片循环切换及监测鼠标滚动切换图片

    今天我们主要讲讲如何使用原生JS实现图片的循环切换的方法以及如何检测鼠标滚动循环切换图片.多余的话我们就不多说了,我们一个一个开始讲吧. 1  原生JS实现图片循环切换 -- 方法一 在上栗子之前我们 ...

随机推荐

  1. 树莓派的GPIO编程

    作者:Vamei 出处:http://www.cnblogs.com/vamei 严禁转载. 树莓派除了提供常见的网口和USB接口 ,还提供了一组GPIO(General Purpose Input/ ...

  2. 是什么让spring 5放弃了使用Guava Cache?

    一路走来,Spring社区从刚开始的核心模块一直发展到现在,最近Sping5也完成了M5的发布, 相信不久之后第一个RELEASE版本也会发布.里面有很多特性是和即将要发布的JAVA 9息息相关的.今 ...

  3. API 管理工具

    API 管理工具 你还苦于无法有效的管理大量的API吗?今天给大家介绍一款API的管理工具.这款工具可以免费使用,虽然中途可能会提示你购买,但并不影响我们的使用. 下载地址: Windows:http ...

  4. javascript的null 和undifined

    null表示一个对象,或者变量的值为空,undifined 表示声明了一个对象(变量),没有给他初始化或者压根儿就没有声明这个对象(变量). 1.null 是JavaScript关键字 undifin ...

  5. Play学习 - 体验网页模板

    在经过无数个尝试后,最终用sbt把play所依赖的所有包都下载下来了,现在可以非常快速编译运行了.今天体验了下网页模板,觉得非常不错,在这里做个简单的介绍. 原文说明: A Play Scala te ...

  6. OC—可变数组NSMutableArray

  7. Centos7.3 安装Mysql5.7并修改初始密码

    1.官方安装文档 http://dev.mysql.com/doc/mysql-yum-repo-quick-guide/en/ 2.下载 Mysql yum包 http://dev.mysql.co ...

  8. Memcached for windows x64 x32 安装

    Memcached for windows 一.安装Memcached 1.下载 Memcached32位:http://s3.amazonaws.com/downloads.northscale.c ...

  9. 安装mongodb后启动报错libstdc++

    安装mongo后启动报错如下图 显然说是libstdc++.so文件版本的问题,这种一般都是gcc版本太低了 接着查询gcc的版本    strings /usr/lib/libstdc++.so.6 ...

  10. freemarker---详细使用教程

    FreeMarker的模板文件并不比HTML页面复杂多少,FreeMarker模板文件主要由如下4个部分组成: 1,文本:直接输出的部分2,注释:<#-- ... -->格式部分,不会输出 ...