JS的for循环包裹异步函数的问题
有个循环,循环一个异步回调,为啥回调引用的循环值都是最后一步循环的循环值?然后,又有些时候无论什么循环值都得不到?
var arr = [1,3,5,7,9];
var arrLength = arr.length; for (var i = 0; i < arrLength; i++) {
setTimeout(function() {
console.log(i);
console.log(arr[i]);
}, 2000);
}
结果是:
5
undefined
5
undefined
5
undefined
5
undefined
5
undefined
解决方法:使用自执行函数传参
var arr = [1,3,5,7,9];
var arrLength = arr.length; for (var i = 0; i < arrLength; i++) {
(function(i) {
setTimeout(function() {
console.log('i是' + i);
console.log('value是' + arr[i]);
}, 2000);
})(i);
}
结果是:
i是0
value是1
i是1
value是3
i是2
value是5
i是3
value是7
i是4
value是9
参考链接:
https://www.jianshu.com/p/690f58a3ff7b
JS的for循环包裹异步函数的问题的更多相关文章
- js for 循环中有异步函数时,回调函数总是最后一步的值。
原因:for循环执行时不会等待异步函数执行. 解决方法: 1.改为递归函数(暂时不会). 2.构建一个自执行函数传参(匿名函数) 参考::https://www.cnblogs.com/csuwuji ...
- JS中的循环嵌套 BOM函数
[嵌套循环特点] 外层循环转一次,内层循环转一圈 外层循环控制行数,内层循环控制每行元素个数 [做 ...
- js的for循环中出现异步函数,回调引用的循环值总是最后一步的值?
这几天跟着视频学习node.js,碰到很多的异步函数的问题,现在将for循环中出现的异步函数回调值的问题总结如下: 具体问题是关于遍历文件夹中的子文件夹的,for循环包裹异步函数的代码: for (v ...
- js的for循环中出现异步函数,回调引用的循环值始终是最后的值
一.问题 今天工作中解决bug发现是由“for循环的异步函数,回调引用的循环值始终是最后的值”的现象导致的,如: for (var i = 0; i < files.length; i++) { ...
- 更优雅的方式: JavaScript 中顺序执行异步函数
火于异步 1995年,当时最流行的浏览器--网景中开始运行 JavaScript (最初称为 LiveScript). 1996年,微软发布了 JScript 兼容 JavaScript.随着网景.微 ...
- Node.js用ES6原生Promise对异步函数进行封装
Promise的概念 Promise 对象用于异步(asynchronous)计算..一个Promise对象代表着一个还未完成,但预期将来会完成的操作. Promise的几种状态: pending:初 ...
- JS异步函数 返回值
1. js 异步的几种情况 : 1.1 异步操作由浏览器内核的 webcore 来执行: onclick 由浏览器内核的 DOM Binding 模块来处理,当事件触发的时候,回调函数会立即添加到任 ...
- js中ajax连接服务器open函数的另外两个默认参数get请求和默认异步(open的post方式send函数带参数)(post请求和get请求区别:get:快、简单 post:安全,量大,不缓存)(服务器同步和异步区别:同步:等待服务器响应当中浏览器不能做别的事情)(ajax和jquery一起用的)
js中ajax连接服务器open函数的另外两个默认参数get请求和默认异步(open的post方式send函数带参数)(post请求和get请求区别:get:快.简单 post:安全,量大,不缓存)( ...
- 10-Node.js学习笔记-异步函数
异步函数 异步函数是异步编程语法的终极解决方案,它可以让我们将异步代码写成同步的形式,让代码不再有回调函数嵌套,是代码变得清晰明了 const fn = async()=>{} async fu ...
随机推荐
- FastDfs单机版搭建
详细的最新版fastdfs单机版搭建 前言 目前项目是tomcat单机部署的,图片.视频也是上传到tomcat目录下,关键是此项目的主要内容还就是针对图片.视频的,这让我非常担忧:文件服务器的应用是必 ...
- 【Leetcode】二进制求和
解题思路: 1. 首先在两个字符串前面补‘0’,使它们等长.否则要一直监督操作是否超出两个字符串的索引. 2. 从后向前遍历所有位数,同位相加.字符相加,利用ASCII码,字符在内部都用数字表示,我们 ...
- ZooKeeper设置开机启动
1 在init.d目录下新建脚本文件 进入到/etc/rc.d/init.d目录下,命令是: cd /etc/rc.d/init.d 新建一个名为zookeeper的文件,命令是: touch ...
- [BZOJ4695]最假女选手:segment tree beats!
分析 segment tree beats!模板题. 看了gxz的博客突然发现自己写的mxbt和mnbt两个标记没用诶. 代码 #include <bits/stdc++.h> #defi ...
- 利用 clipboardData 在网页中实现截屏粘贴的功能
<!DOCTYPE HTML> <html lang="en-US"> <head> <meta charset="UTF-8& ...
- (转)C#进阶之WebAPI
转:https://www.cnblogs.com/yuchenghao/p/10598825.html 首先第一点:什么是WebAPI? 首先我们了解一下.net framework 的框架构成, ...
- 【零售App】—— react/ant design mobile项目爬坑
一.H5制作 - 图片文本的动画效果 bug:打开一个模板,添加图片,添加动画效果,若先选定动画效果,再调节动画时间和延迟时间,则动画和延迟时间没有改变:若先调节动画时间和延迟时间在选定动画效果,则动 ...
- 三、Appium-python-UI自动化之元素定位uiautomatorviewer
uiautomatorviewer是android-sdk自带的一个元素定位工具,非常简单好用,使用uiautomatorviewer,可以检查一个应用的UI来查看应用的布局和组件以及相关的属性. 一 ...
- 使用Callable或DeferredResult实现springmvc的异步请求
使用Callable实现springmvc的异步请求 如果一个请求中的某些操作耗时很长,会一直占用线程.这样的请求多了,可能造成线程池被占满,新请求无法执行的情况.这时,可以考虑使用异步请求,即主线程 ...
- Object.freeze与 Object.seal的区别
Object.freeze()冻结一个对象.不能添加新的属性,不能删除已有属性,不能修改该对象已有属性的可枚举性.可配置性.可写性,以及不能修改已有属性的值.冻结一个对象后该对象的原型也不能被修改. ...