js的for循环闭包问题
一个简单的例子,如果想循环输出数组中的每一个数值我们可以利用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循环闭包问题的更多相关文章
- 你不知道的JS之作用域和闭包(五)作用域闭包
原文:你不知道的js系列 一个简单粗暴的定义 闭包就是即使一个函数在它所在的词法作用域外部被执行,这个函数依然可以访问这个作用域. 比如: function foo() { var a = 2; fu ...
- js的closures(闭包)
JS中的闭包(closure) 闭包(closure)是Javascript语言的一个难点,也是它的特色,很多高级应用都要依靠闭包实现.下面就是我的学习笔记,对于Javascript初学者应该是很有用 ...
- js匿名函数和闭包总结
js匿名函数和闭包总结 一.总结 一句话总结:匿名函数的最主要作用是创建闭包,闭包就是将函数内部和函数外部连接起来的一座桥梁.内层的函数可以使用外层函数的所有变量,即使外层函数已经执行完毕.闭包可以用 ...
- js 控制Div循环显示 非插件版
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/ ...
- js种的循环语句
//js种的循环语句 //while与do while的区别是while是满足条件后才执行 //do while是不管满不满足条件都会执行一次 //for 循环与while,do while相比循环结 ...
- js中的循环语句
js中的循环语句可分为三种:1.while:2.do……while:3.for. while的语法为 while (exp) { //statements;} var a=1,b=0; whil ...
- js的事件循环绑定和jQuery的隐式迭代
js的事件循环绑定和jQuery的隐式迭代 js事件循环绑定 jQuery隐式迭代 先举一个例子:给定一个ul,点击列表内的每一个li元素,使它的背景色变红,下边分别用js代码和jQuery实现. & ...
- 原生JS—实现图片循环切换的两种方法
今天我们主要讲讲如何使用原生JS实现图片的循环切换的方法.多余的话我们就不多说了,我们一个一个开始讲吧. 1 原生JS实现图片循环切换 -- 方法一 在上栗子之前我们先简单介绍一下所用的一些知识点. ...
- 原生JS—实现图片循环切换及监测鼠标滚动切换图片
今天我们主要讲讲如何使用原生JS实现图片的循环切换的方法以及如何检测鼠标滚动循环切换图片.多余的话我们就不多说了,我们一个一个开始讲吧. 1 原生JS实现图片循环切换 -- 方法一 在上栗子之前我们 ...
随机推荐
- java复习(6)---异常处理
JAVA异常处理知识点及可运行实例 接着复习java知识点,异常处理是工程中非常重要的. 1.处理异常语句: try{ .... }catch(Exception e){ ..... } finall ...
- Servlet3.0新特性(从注解配置到websocket编程)
Servlet3.0的出现是servlet史上最大的变革,其中的许多新特性大大的简化了web应用的开发,为广大劳苦的程序员减轻了压力,提高了web开发的效率.主要新特性有以下几个: 引入注解配置 支持 ...
- git的使用及常用命令
一,GIT是什么? git是目前世界上最先进的分布式版本控制系统 Git是分布式版本控制系统,那么它就没有中央服务器的,每个人的电脑就是一个完整的版本库,这样,工作的时候就不需要联网了,因为版本都是在 ...
- .net core CLI(创建VueJS||Angular结合的项目)
net core cli 是快速创建模板项目 安装CLI 参考: https://www.hanselman.com/blog/dotnetNewAngularAndDotnetNewReact.as ...
- selenium IDE的3种下载安装方式
第一种方式: 打开firefox浏览器-----点击右上角-----附加组件----插件----搜索框输入“selenium”-----搜索的结果中下拉到页面尾部,点击“查看全部的37项结果”---进 ...
- NSString类
创建一个字符串 ) NSString *s = @"aaaa"; ) NSString *s1=[NSString new]; s1=@"bbb"; )格式化创 ...
- 【iOS开发】3.UIViewController
1.概述 iOS和相关库的开发大量使用了模型-视图-控制器(MVC)模式.一般而言,MVC是一种策略,用于分离展现(视图).数据(模型)和业务逻辑(控制器).确切地讲,模型是简单数据,如Person或 ...
- ThinkPHP3.2——基础
1.1.获取ThinkPHP 3.2 获取ThinkPHP的方式很多,官方网站(http://thinkphp.cn)是最好的下载和文档获取来源. 官网提供了稳定版本的下载:http://thinkp ...
- centos下搭建redis集群
必备的工具: redis-3.0.0.tar redis-3.0.0.gem (ruby和redis接口) 分析: 首先,集群数需要基数,这里搭建一个简单的redis集群(6个redis实 ...
- .net Ajax与后台一般处理程序(ashx) 交互
本文主要实现无动态刷新查询后台数据功能,主要用到ajax+ashx+sqlserver进行交互. 首先需要引用Jquery: <script language="javascript& ...