js实现异步循环实现代码


Posted in Javascript onFebruary 16, 2016

问题
实现异步循环时,你可能会遇到问题。

让我们试着写一个异步方法,一次循环打印一次循环的索引值。

<script>
for(var i = 0; i < 5; i++){
setTimeout(function(){
document.writeln(i);document.writeln("<br />");
},1000);
}
</script>

如上程序的输出为:

5
5
5
5
5

原因

每次时间结束(timeout)都指向原始的i,而并非它的拷贝。所以,for循环使i增长到5,之后timeout运行并调用了当前i的值(也就是5)。

解决方法

有几个不同的方式可以拷贝i。最普通且常用方法是通过声明函数来建立一个闭包,并将i传给此函数。我们这里使用了自调用函数。

运行代码

<script>
for(var i = 0; i < 5; i++){
(function(num){
setTimeout(function(){
document.writeln(num);document.writeln("<br />");
},1000);
})(i);
}
</script>

输出

0
1
2
3
4

Javascript 相关文章推荐
jQuery下通过replace字符串替换实现大小图片切换
May 22 Javascript
表单验证的完整应用案例探讨
Mar 29 Javascript
使用GruntJS链接与压缩多个JavaScript文件过程详解
Aug 02 Javascript
js隐式全局变量造成的bug示例代码
Apr 22 Javascript
Javascript快速排序算法详解
Dec 03 Javascript
jQuery对象初始化的传参方式
Feb 26 Javascript
JS解决position:sticky的兼容性问题的方法
Oct 17 Javascript
详解基于Node.js的HTTP/2 Server实践
May 31 Javascript
jquery拖拽自动排序插件使用方法详解
Jul 20 jQuery
vue中$nextTick的用法讲解
Jan 17 Javascript
详解JavaScript实现动态的轮播图效果
Apr 29 Javascript
js实现秒表计时器
Dec 16 Javascript
JavaScript实现跑马灯抽奖活动实例代码解析与优化(二)
Feb 16 #Javascript
JavaScript实现跑马灯抽奖活动实例代码解析与优化(一)
Feb 16 #Javascript
javascript HTML+CSS实现经典橙色导航菜单
Feb 16 #Javascript
JavaScript中使用数组方法汇总
Feb 16 #Javascript
jquery拖拽排序简单实现方法(效果增强版)
Feb 16 #Javascript
jquery实现具有收缩功能的垂直导航菜单
Feb 16 #Javascript
学习使用AngularJS文件上传控件
Feb 16 #Javascript
You might like
用php+mysql一个名片库程序
2006/10/09 PHP
php 文件夹删除、php清除缓存程序
2009/08/25 PHP
PHP基础学习之流程控制的实现分析
2013/04/28 PHP
用js实现计算加载页面所用的时间
2010/04/02 Javascript
JQquery的一些使用心得分享
2012/08/01 Javascript
使用jquery解析XML示例代码
2014/09/05 Javascript
被遗忘的javascript的slice() 方法
2015/04/20 Javascript
全面解析JavaScript中的valueOf与toString方法(推荐)
2016/06/14 Javascript
JS实战篇之收缩菜单表单布局
2016/12/10 Javascript
Vue.js分页组件实现:diVuePagination的使用详解
2018/01/10 Javascript
Vuejs2 + Webpack框架里,模拟下载的实例讲解
2018/09/05 Javascript
JavaScript怎样在删除前添加确认弹出框?
2019/05/27 Javascript
JS 数组和对象的深拷贝操作示例
2020/06/06 Javascript
python中关于时间和日期函数的常用计算总结(time和datatime)
2013/03/08 Python
python获取当前计算机cpu数量的方法
2015/04/18 Python
Python安装官方whl包和tar.gz包的方法(推荐)
2017/06/04 Python
python定时关机小脚本
2018/06/20 Python
python使用正则筛选信用卡
2019/01/27 Python
python中time库的实例使用方法
2019/10/31 Python
python中的RSA加密与解密实例解析
2019/11/18 Python
python pip安装包出现:Failed building wheel for xxx错误的解决
2019/12/25 Python
Pycharm安装Qt Design快捷工具的详细教程
2020/11/18 Python
python实现图片,视频人脸识别(dlib版)
2020/11/18 Python
如何通过Python实现RabbitMQ延迟队列
2020/11/28 Python
python 窃取摄像头照片的实现示例
2021/01/08 Python
英格兰橄榄球商店:England Rugby Store
2016/12/17 全球购物
网上开店必备创业计划书
2014/01/26 职场文书
出纳员的岗位职责
2014/02/22 职场文书
学校搬迁方案
2014/06/15 职场文书
违反单位工作制度检讨书
2014/10/25 职场文书
优秀班集体申报材料
2014/12/25 职场文书
暑假安全保证书
2015/02/28 职场文书
会计试用期自我评价
2015/03/10 职场文书
2019广播稿怎么写
2019/04/17 职场文书
餐厅开业活动方案
2019/07/08 职场文书
mysql 乱码 字符集latin1转UTF8
2022/04/19 MySQL