setInterval的这种行为是否暗含Javascript中的多线程行为? [英] Does this behavior of setInterval imply multithreading behavior in Javascript?
问题描述
在使用javascript时，我注意到了这件事.您可以使用
var i=0;
var startingTime=new Date().getTime();
setInterval("foo()",1);
function foo() {
i+=1;
if ($("#foodiv").text()==i) {
//we detected a doubled value (parallel execution)
$("#repdiv").append("[repetition on "+i+"]");
}
$("#foodiv").html(i);
$("#timediv").html(Math.floor((new Date().getTime()-startingTime)/1000));
}
但是当我阅读并尝试自己的时间不是1毫秒，而是至少10毫秒左右.实际上，在10秒钟后，我的i值为2300/2400左右，而不是预期的10000.
这是该过程的最小时间因素???当然没有.如果我尝试这个:
<html><head>
<script language="javascript" type="text/javascript" src="jquery-1.4.min.js"></script>
<script type="text/javascript">
var i=0;
var startingTime=new Date().getTime();
setInterval("foo()",1);setInterval("foo()",1);setInterval("foo()",1);
setInterval("foo()",1);setInterval("foo()",1);setInterval("foo()",1);
setInterval("foo()",1);setInterval("foo()",1);setInterval("foo()",1);
setInterval("foo()",1);setInterval("foo()",1);setInterval("foo()",1);
setInterval("foo()",1);setInterval("foo()",1);setInterval("foo()",1);
setInterval("foo()",1);setInterval("foo()",1);setInterval("foo()",1);
setInterval("foo()",1);setInterval("foo()",1);setInterval("foo()",1);
setInterval("foo()",1);setInterval("foo()",1);setInterval("foo()",1);
function foo() {
i+=1;
if ($("#foodiv").text()==i) {
//we detected a doubled value (parallel execution)
$("#repdiv").append("[repetition on "+i+"]");
}
$("#foodiv").html(i);
$("#timediv").html(Math.floor((new Date().getTime()-startingTime)/1000));
}
</script>
</head>
<body>
<div id="foodiv"></div> (counter)
<br/>
<div id="timediv"></div> (seconds passed)
<br/>
<div id="repdiv"></div>
<br/>
</body>
</html>
计数器将非常快，并且在10秒钟后，我的值为12000 !!!!.对我来说这是无法解释的，因为调用不是并行执行的(或者至少我们可以为repdiv div中的不同调用将i的读取值翻倍).
有人可以向我解释吗?我知道所有这些调用都会给cpu带来很大压力，但至少它会令人惊讶地加快处理速度.
我在论坛上阅读了您的所有回复和其他要求，他们证实了我的想法.但是真正的问题是为什么！为什么当我可以进行多个连续调用而获得更短的时间时，他们将限制设置为15ms?我确信这种多重回调系统不是一个好习惯，但是我可以做到，而且我可能会饱和cpu负载.
否，JavaScript是单线程的.当您运行setInterval或setTimeout时，将生成一个事件，然后将其添加到浏览器的执行队列中.因此，尽管您不能保证代码本身会在想要运行时准确地运行，但您可以确保每次生成该事件时都会生成该事件.因此，在这种情况下，您生成的12个事件彼此之间非常接近.我注意到您已经使用1作为间隔值.但是，大多数浏览器中的最小值在15左右(请参见此处 (有关更多信息.)浏览器将按照事件在执行队列中的顺序运行事件(在setInterval中，事件尝试进行追赶.请查看Marcel链接的答案，以获取更多详细信息). /p>
这意味着在第一种情况下，您每15毫秒左右生成一次一个事件.因此，计数器的增加速度较慢.但是在第二种情况下，您有十二个事件，它们每隔15毫秒左右就彼此非常接近地触发，因此计数器的增加快得多.
In using javascript i noticed this thing. You can use
var i=0;
var startingTime=new Date().getTime();
setInterval("foo()",1);
function foo() {
i+=1;
if ($("#foodiv").text()==i) {
//we detected a doubled value (parallel execution)
$("#repdiv").append("[repetition on "+i+"]");
}
$("#foodiv").html(i);
$("#timediv").html(Math.floor((new Date().getTime()-startingTime)/1000));
}
but as i read and try myself the time is not 1ms , it's at least 10ms or something. In fact after 10 seconds, i have a value of i around 2300/2400 , and not 10000 as expected.
This is the minimum possible time factor for the procedure ??? certainly NO. If i try this :
<html><head>
<script language="javascript" type="text/javascript" src="jquery-1.4.min.js"></script>
<script type="text/javascript">
var i=0;
var startingTime=new Date().getTime();
setInterval("foo()",1);setInterval("foo()",1);setInterval("foo()",1);
setInterval("foo()",1);setInterval("foo()",1);setInterval("foo()",1);
setInterval("foo()",1);setInterval("foo()",1);setInterval("foo()",1);
setInterval("foo()",1);setInterval("foo()",1);setInterval("foo()",1);
setInterval("foo()",1);setInterval("foo()",1);setInterval("foo()",1);
setInterval("foo()",1);setInterval("foo()",1);setInterval("foo()",1);
setInterval("foo()",1);setInterval("foo()",1);setInterval("foo()",1);
setInterval("foo()",1);setInterval("foo()",1);setInterval("foo()",1);
function foo() {
i+=1;
if ($("#foodiv").text()==i) {
//we detected a doubled value (parallel execution)
$("#repdiv").append("[repetition on "+i+"]");
}
$("#foodiv").html(i);
$("#timediv").html(Math.floor((new Date().getTime()-startingTime)/1000));
}
</script>
</head>
<body>
<div id="foodiv"></div> (counter)
<br/>
<div id="timediv"></div> (seconds passed)
<br/>
<div id="repdiv"></div>
<br/>
</body>
</html>
The counter will go very fast, and after 10 seconds, i have a value of 12000 !!!!. That's for me is unexplicable, because the call is not executed in parallel (or at least we could have some doubled readed values of i for different calls, figuring in the repdiv div).
Can someone explain me that ? I know the cpu is very stressed by all those calls, but at least it speed up things surprisingly.
I read all your responses and the other quests in the forum, and they confirmed my thinking. But the real question is Why ! Why they set the limit to 15ms when i can do multiple sequential calls obtaining a time much lower ? I'm sure this multiple callback system is not good practice, but i can do it, and i potentially can saturate cpu load.
No, Javascript is single threaded. When you run setInterval or setTimeout, an event is generated which is then added to the browser's execution queue. So while you cannot guarantee that the code itself will run exactly when you want it to run, you can be sure that the event will be generated each time it is supposed to be generated. So in this case, you have 12 events that are being generated really close to each other. I notice that you've used 1 as the interval value. However, the minimum values in most browsers is around 15 (see here for more information.) The browser will run through the events in the order they are in the execution queue (in setInterval, the events try to play catch up. Look at the answer that Marcel linked to, for more details).
What this means is that in the first scenario you have one event generated every 15 or so milliseconds. So the counter is incremented more slowly. But in the second case, you have twelve events that are fired pretty close to each other every 15 or so milliseconds, and so the counter increments much faster.
这篇关于setInterval的这种行为是否暗含Javascript中的多线程行为?的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！
