var 在异步中引发的 bug

问题复现

for (var i = 0; i < 10; i++) {
    $http.get("/uri").then(function(data)){
        mydata[i].data = data;
    }
}

报错:

unable to get property ‘mydata‘ of null

问题原因

第一步,听说 var 和 let 作用域范围不同,所以特定尝试下 let,看是否能解决这个 bug。

for (let i = 0; i < 10; i++) {
    $http.get("/uri").then(function(data)){
        mydata[i] = data;
    }
}

的确没有报错,解决了该 bug。

第二步,在 console 中输出 i 值:发现 var i 时,所有的 i 为 10;let i 时,i 分别为 1 2 3 4 5 6 7 8 9。

后来查阅资料弄清楚该 bug 的原因:

  1. JavaScript 为单线程,异步操作是在所有操作是在主程序结束之后才开始运行。首先是提交所有的 AJAX 操作,其次才是分别执行所有的 AJAX 请求。
  2. var 为全局变量,let 为块级变量。当 AJAX 操作执行时,var i 的 i 由于是全局变量已经变成了 10,自然越界了;let i 的 i 由于是块级变量,还保持块中的值,分别为 1 2 3 4 5 6 7 8 9,所以不会越界。

其实,这也是 let 产生的原因。

时间: 2024-10-10 10:59:31

var 在异步中引发的 bug的相关文章

onbeforeunload与a标签在IE中的冲突bug(转载)

onbeforeunload与a标签在IE中的冲突bug onbeforeunload 是window的一个事件,目前Firefox,IE都支持,主要用来提示用户是否真的要离开该页面,通常在一些比较重要的数据提交之前,防止用户误操作导致数据丢失.典型的应用如gmail中,在写邮件的时候,如果刷新页面或者关闭页面,会出现提示. 但是在IE下点击一些a标签时,也会触发onbeforeunload事件.并且href中写javascript:void(0)也不行,而在Firefox中不会出现类似的情况.

react项目中遇到的BUG

前情提要:最近在学习react,然后就将项目中遇到的bug总结下来,作为借鉴! 项目结构: demo |app |app.js |main.js |center.js |toutiao.js |quanzi.js |shipin.js |dinggou.js |style.css |build |index.html |.babelrc |package.json |node_modules |webpack.config.js html文件: <!DOCTYPE html> <html

JSPatch来更新已上线的App中出现的BUG(超级详细)

JSPatch来更新已上线的App中出现的BUG(超级详细) 字数2858 阅读422 评论15 喜欢29 JSPatch的作用是什么呢? 简单来说:(后面有具体的操作步骤以及在操作过程中会出现的错误) 1.iOS应用程序上架到AppStore需要等待苹果公司的审核,一般审核时间需要1到2周.虽然程序在上架前会经过测试人员的测试,但有时候还是不免会发生新版本上线后出现严重的bug,导致用户刚升级到新版本就出现crash,严重影响用户体验. 2.这时能做的只是赶紧修复bug然后提交等待漫长的App

avascript 运动中Offset的bug解决方案

这篇文章主要介绍了Javascript 运动中Offset的bug解决方案,需要的朋友可以参考下 我们先来看看这个bug 是怎么产生的. 代码如下: 1 <style type="text/css"> 2 #div1 { 3 width: 200px; 4 height: 200px; 5 background: red; 6 7 } 8 </style> 代码如下: 1 <body> 2 <div id="div1">

ASP.NET sync over async(异步中同步,什么鬼?)

转自:http://www.cnblogs.com/xishuai/p/asp-net-sync-over-async.html async/await 是我们在 ASP.NET 应用程序中,写异步代码最常用的两个关键字,使用它俩,我们不需要考虑太多背后的东西,比如异步的原理等等,如果你的 ASP.NET 应用程序是异步到底的,包含数据库访问异步.网络访问异步.服务调用异步等等,那么恭喜你,你的应用程序是没问题的,但有一种情况是,你的应用程序代码比较老,是同步的,但现在你需要调用异步代码,这该怎

安卓微信overflow-x overflow-y引发的bug

今天xgo文章图片页上线用微信扫页面发现一个bug,页面可以双击放大缩小. 找了半天原因,发现是图片描述设置了overflow-y引发的bug. 建议在微信场景里满屏显示不能滚动的页面里慎用overflow-y. xgo文章图片页上线:m.xgo.com.cn/info/1213384.html

关于AFNetworking中header的bug问题

关于AFNetworking中header的bug问题 [摘要:AFNetworking那个正在ios开辟中便未几道了,网上一搜一大推,然则详细用法我便没有道了,偶然间我会整顿一下详细的一些用法.本日首要接头一下我正在应用傍边闭于header上里的一些bug问] AFNetworking这个在ios开发中就不多说了,网上一搜一大推,但是具体用法我就不说了,有时间我会整理一下具体的一些用法.今天主要讨论一下我在使用当中关于header上面的一些bug问题. 首先关于一个登录保持,我和服务器人员通过

R语言学习中的小bug:R中矩阵相乘错误于A %*% B: 需要数值/复数矩阵/矢量参数

遇到了小bug: R中矩阵相乘错误于A %*% B: 需要数值/复数矩阵/矢量参数 看到网上别人的做法,发现了用class(A)和class(B)之后才发现,是因为读入的时候数据的类型不对,A.B的类型并不是matrix,才导致了这个问题. 用as.matrix来变型一下,就OK了. R语言学习中的小bug:R中矩阵相乘错误于A %*% B: 需要数值/复数矩阵/矢量参数,布布扣,bubuko.com

CSS中常见的BUG调试

1.布局--layout 布局是windows提出的概念,用于控制元素的尺寸和定位. 拥有布局的元素负责自身及其子元素的尺寸及定位,而没有布局的元素仅仅能依靠近期的祖先元素进行控制. 通常在IE6中出现的BUG.非常可能是由于布局的缘故而产生的,因而修复IE中BUG的时候,第一件事就是尝试通过规则迫使元素拥有布局来看是否能修复. 默认情况下拥有布局的元素包含:body.html(标准模式下).table.tr.td.img.hr.input.select.textarea.button.ifra