setTimeout异步执行

下面这段代码想要循环昝输出结果01234，请问输出结果是否正确，如果不正确，请说明为什么，并修改循环内的代码使其输出正确结果

for(var i=0;i<5;++i){setTimeout(function(){console.log(i);},1000);
}

查到的资料是

JavaScript是单线程执行的，无法同时执行多段代码。当某一段代码正在执行的时候，所有后续的任务都必须等待，形成一个队列。一旦当前任务执行完毕，再从队列中取出下一个任务，这也常被称为 “阻塞式执行”。所以一次鼠标点击，或是计时器到达时间点，或是Ajax请求完成触发了回调函数，这些事件处理程序或回调函数都不会立即运行，而是立即排队，一旦线程有空闲就执行。假如当前 JavaScript线程正在执行一段很耗时的代码，此时发生了一次鼠标点击，那么事件处理程序就被阻塞，用户也无法立即看到反馈，事件处理程序会被放入任务队列，直到前面的代码结束以后才会开始执行。如果代码中设定了一个 setTimeout，那么浏览器便会在合适的时间，将代码插入任务队列，如果这个时间设为 0，就代表立即插入队列，但不是立即执行，仍然要等待前面代码执行完毕。所以 setTimeout 并不能保证执行的时间，是否及时执行取决于 JavaScript 线程是拥挤还是空闲。

该题目考察的就是JavaScript的单线程以及setTimeout的异步特性。

【注】：JavaScript引擎是单线程运行的，浏览器运行期间只有一个线程在运行js程序。浏览器的内核是多线程的，他们在内核控制下相互配合，以保持同步，一个浏览器至少实现三个常驻线程：JavaScript引擎线程，GUI渲染线程，浏览器事件触发线程。

JavaScript引擎是基于事件驱动单线程执行的，js引擎一直等待着任务队列中任务的到来，然后加以处理，浏览器无论什么时候都只有一个js线程在运行js程序。
GUI渲染线程负责浏览器界面的渲染，当界面需要重绘的时候或者由于某种操作引发回流时，该线程就会执行，需要注意GUI渲染线程与js引擎是互斥的，当js引擎执行的时候GUI线程会被挂起，GUI更新会被保存在一个队列中，等到js引擎空闲时立即被执行
事件触发线程，当一个事件被触发时该线程会把事件添加到待处理的队列末尾，等待js引擎的处理。这些事件可来自js引擎当前执行代码块，如setTimeout，也可来自浏览器内核的其他线程如鼠标点击、ajax异步请求等，但由于js的单线程关系所有这些事件都得排队等待js引擎处理。
当线程中没有任何同步代码的前提下才会执行异步代码。

--以上信息来源于https://www.zhihu.com/people/fredshare。

所以正确的写法是

for(var i =0; i <10; i++){(function(e){setTimeout(function(){console.log(e); },1000);})(i);
}

setTimeout异步执行相关推荐

昼猫笔记 JavaScript -- 异步执行 | 定时器真的定时执行？
本篇主要内容:异步.定时器引发的思考预计阅读时间:8分钟了解我们都知道在js中定时器有两种 setInterval() . setTimeout() setInterval() :按 ...
JavaScript 异步执行的学习笔记 - 什么是事件循环 Event loop？
原文使用像 JavaScript 这样的语言进行编程时,最重要但也经常被误解的部分之一是如何表达和操作一段需要某段时间才能完成执行的程序行为. 这不仅仅是从 for 循环开始到 for 循环结束发生 ...
php 内部异步执行顺序,event_loop中不同异步操作的执行顺序
关于js的单线程.怎么创建一个异步任务都是老生常谈的话题了,我们今天就总结一下js不同的异步操作到底执行顺序如何. 首先我们要明白js两种任务类型,一个是macrotask(宏任务),一个是 micr ...
js 循环等待异步执行完再执行_JS异步执行机制——事件循环（Event Loop）
JS异步执行机制--事件循环(Event Loop) 本文首发地址: 前端基础 | JS异步执行机制--事件循环(Event Loop)www.brandhuang.com 先祭出一段代码,你清楚它 ...
js 异步执行_js执行过程你了解多少？
来公众号:「九零后重庆崽儿」找我,一起学前端. 本文首发在: js执行过程你了解多少? - 重庆崽儿brand的个人主页www.brandhuang.com 文章自己整理自网络,如有问题欢迎在知乎或 ...
typescript 判断异步执行已经结束_vue进阶系列——用typescript玩转vue和vuex
用过vue的朋友大概对vuex也不陌生,vuex的官方解释是专为 Vue.js 应用程序开发的状态管理模式.它采用集中式存储管理应用的所有组件的状态,并以相应的规则保证状态以一种可预测的方式发生变化. ...
js 异步执行_JS异步执行机制——事件循环（Event Loop）
JS异步执行机制--事件循环(Event Loop) 本文首发地址: 前端基础 | JS异步执行机制--事件循环(Event Loop)www.brandhuang.com 先祭出一段代码,你清楚它 ...
JavaScript：异步执行机制
使用JavaScript的开发者都知道,JS的异步执行机制在JS中占据着重要的地位,主要就是体现在回调函数以及事件方面,最近看了很多文章,将自己的一些感受和理解跟各位分享一下. 前面的博客中也有提到, ...
python等待执行完毕再继续执行_如何等待一个函数内部异步执行完毕再执行另外一个函数？...
问题描述有两个函数f1和f2,其中f1中有异步操作,执行完f1接着执行f2,因为f1内部有异步操作,所以会先执行完f2,再执行f1里的异步,如何等待f1异步执行完再执行f2. 备注:执行方式为f1( ...

setTimeout异步执行

setTimeout异步执行相关推荐

最新文章

热门文章