Question

我必须使用至少2个setTimeout和1个setInterval。这是否依赖于所使用的浏览器或javascript引擎？

Answer 1

在页面上，您可以根据需要同时运行多个setTimeouts / setIntervals，但是为了单独控制每个，您需要将它们分配给变量。

var interval_1 = setInterval("callFunc1();",2000);
var interval_2 = setInterval("callFunc2();",1000);
clearInterval(interval_1);

上面相同的代码适用于setTimeout，只需替换措辞。

正如凯文所说，JavaScript确实是单线程的，所以虽然你可以让多个计时器同时打勾，但任何时候只有一个计时器可以触发 - 也就是说如果你有一个计时器触发一个'停止'执行的功能，例如，有一个警告框，那么JS必须'恢复'，然后另一个可以触发我相信。

下面给出另一个例子。虽然标记无效，但它会显示超时的工作方式。

<html>
    <body>
        <script type="text/javascript">
            function addThing(){
                var newEle = document.createElement("div");
                newEle.innerHTML = "Timer1 Tick";
                document.body.appendChild(newEle);
            }   
            var t1= setInterval("addThing();",1000);
            var t2 = setInterval("alert('moo');",2000);
        </script>
    </body>
</html>

Answer 2

tl;博士：在你创造100K的计时器之前，不要担心计时器的成本。

我只是通过创建此测试文件（反复创建100K计时器）对计时器性能进行了快速测试：

<script>
var n = 0; // Counter used to verify all timers fire

function makeTimers() {
  var start = Date.now();
  for (var i = 0; i < 100000; i++, n++) {
    setTimeout(hello, 5000);
  }
  console.log('Timers made in', Date.now() - start, 'msecs');
}

function hello() {
  if (--n == 0) {
    console.log('All timers fired');
    makeTimers(); // Do it again!
  }
}

setTimeout(makeTimers, 10000);  // Wait a bit before starting test
</script>

我在大约2014年的Macbook Pro上用谷歌浏览器（v54）打开了这个文件，然后进入开发人员工具中的时间线选项卡，并在加载页面时记录内存配置文件，并运行3-4个测试周期。

<强>观察

定时器创建循环需要200ms。页面堆大小从预测试的3.5MB开始，并且在3.9MB处开始。

<强>结论

每个计时器需要〜.002毫秒来设置，并向JS堆添加大约35个字节。

Answer 3

您可以根据需要使用多个。请记住，JavaScript是单线程的，因此它们都不能并行执行。

Answer 4

var interval_1 = setInterval("callFunc1();",2000);调用eval()这是邪恶的，所以它很糟糕。请改用var interval_1 = setInterval(callFunc1,2000);

对于这个问题，你可以根据需要使用多个但如果两个动作之间的间隔相同，你最好这样做

var interval = setInterval(function() {
  // function1
  fct1(); 
  // function2
  fct2();
 },2000);

可以在一个页面中同时设置多少个javascript setTimeout / setInterval调用？

4 个答案: