JavaScript的浏览器:异步任务执行模型 [英] javascript in browser: asynchronous tasks execution model

查看:102
本文介绍了JavaScript的浏览器:异步任务执行模型的处理方法,对大家解决问题具有一定的参考价值,需要的朋友们下面随着小编来一起学习吧!

问题描述

我试图绕到我的头和理解单线程的浏览器环境中如何异步JavaScript的作品。

I'm trying to wrap my head around and understand how javascript async works in single threaded browser environment.

由于异步,我们可以把两个定时器和XHR请求。
现在假设我有类似下面

As asynchronous we can treat both timers and xhr requests. Now suppose I have something like below

function doStuff() {
    for(var i=0; i<100000000; i++) {
        // do something to make proc busy
        if(i%1000 === 0) {
            console.log('in for loop');
        }
    }
}


setTimeout(function() {
    console.log('timed out')
}, 2);
doStuff();
doStuff();
doStuff();

定时器设置为非常小的值(2ms的),所以我想它应该工作如下:

Timer is set to really small value (2ms), so I suppose it should work as follows:

1)计时器回调排队

2) doStuff()执行(作为一个整体),需要一定的时间(超过2者毫秒)

2) doStuff() is executed (as a whole?), it takes some time (more than those 2 ms)

3)计时器回调运行是有片刻betweet有一个 doStuff()执行和其他

3) timer callback is run as there is a moment betweet one doStuff() execution and another

4)接下来的 doStuff()被称为

4)最后 doStuff()被称为

我看到的却是,所有这三个 doStuff()事情之前计时器回调火灾完成。它是比那些2ms的长得多的时间。是的,我知道在的setTimeout 设置这个时间值无法保证。

What I see instead is that all three doStuff() things are done before timer callback fires. And it is much longer time than those 2ms. Yes, I know this time value set in setTimeout is not guaranteed.

我的问题是如何执行JavaScript的code?这将立即从异步队列的东西被调用之前执行的最小,原子块是什么?

My question is how does javascript executes code? What is the smallest, atomic block that will be executed at once before something from async queue gets invoked?

推荐答案

您就错了位置:

3)计时器回调运行是有片刻betweet 1 doStuff()执行和其他

3) timer callback is run as there is a moment betweet one doStuff() execution and another

的原因是在回答以下问题:

The why is in the answer to the following question:

什么是将立即从异步队列的东西被调用?

What is the smallest, atomic block that will be executed at once before something from async queue gets invoked?

JavaScript使用一种叫做事件循环。每个事件循环周期可以被称为一个滴答。在每一个刻度,跨preTER检查是否有被执行异步回调(例如,的setTimeout 回调,其中超时已过期)。

JavaScript uses something called an event loop. Each event loop cycle can be called a "tick". On every tick, the interpreter checks if there are asynchronous callbacks to be executed (e.g., a setTimeout callback where the timeout has already expired).

所有其它的,同步的操作采取同样的刻度内进行。因此,在你的榜样,计时器会在下次的勾选,但所有三个调用 doStuff 在执行目前的勾选。这就是为什么传递给的setTimeout 的时间价值不保证:有没有办法知道它需要多长时间,直到下一个刻度,所以我们平时说的回调将运行为尽快。在的setInterval 的情况下,部分电话可能甚至被丢弃;例如,当下次蜱两次定义的时间间隔后发生,回调仅运行一次。

All other, synchronous, operations take place within the same tick. So, on your example, the timer will be checked for expiration in the next tick, but all three calls to doStuff are executed in the current tick. That's why the time value passed to setTimeout is not guaranteed: there's no way to know how long it will take until the next tick, so we usually say the callbacks will run "as soon as possible". In the case of setInterval, some calls may even be dropped; for example, when the next tick takes place after twice the defined interval, the callback only runs once.

这篇关于JavaScript的浏览器:异步任务执行模型的文章就介绍到这了,希望我们推荐的答案对大家有所帮助,也希望大家多多支持IT屋!

查看全文
登录 关闭
扫码关注1秒登录
发送“验证码”获取 | 15天全站免登陆