javascript - 如何同时处理多个事件？

Question

我正在用 JS 创建一个小游戏，其中有很多事件经常同时发生(比如修改 html 元素或全局 js 变量..)

为了处理这个问题，我使用“setInterval”每 1 毫秒循环一次，以查看是否有事情要做(“请求”)

每次我需要更改页面上的某些内容时，我都会填充表格，但有时我需要同时更改多个不同的内容。

问题是它不会同时更新，当同时有 2,3 个或更多请求时它会延迟。我希望这是即时的，如果同时有 2 个或更多请求要执行，它应该同时执行而不是延迟每个请求(请求示例:在 jquery 中更新 div 的宽度) .

谢谢你的帮助..

var queue = {};

var fixedUpdate = setInterval(function() { //do all the requests in queue 

    $.each(queue, function(key, val) { //for each request present in the queue

        //do something (requests are about updating display or some global variables)

        /*...*/

        //after completing the request we delete it from the queue
        delete queue[key];
    });

}, 1);

Answer 1

轮询队列不是编写 Javascript 的合适方法。由于浏览器中 Javascript 的单线程特性，如果您在短时间内连续轮询队列，您几乎不会在任何应用中获得良好的响应。

Javascript 是从头开始构建的，是一种事件驱动的语言，当它以事件驱动的方式使用时，它可以有效地工作。

您必须有将事物放入队列的事件。您应该在将某些内容添加到队列时触发队列处理，而不是有一些单独的计时器来轮询队列。当事物被添加到队列时触发队列的处理也会给你立即响应而不是有一个定时器延迟。

此外，无论何时处理完队列中的事件，您的代码都应检查队列中是否还有其他事件并进行处理。通过这种方式，您可以在单线程环境中尽可能接近于将它们添加到队列时处理所有排队的项目。

此外，主浏览器 Javascript 是单线程的，因此您一次只能处理一个排队的项目。您不能同时处理多个请求。浏览器确实有带有 webWorkers 的真实线程，但是那些不能访问 DOM，所以这里可能不相关。

此外，根据 HTML5 规范，setInterval() 的最短时间为 5 毫秒，并且只有在当时没有其他代码在运行的情况下才会如此。