javascript - 避免在 foreach 循环中出现 "Unresponsive Script"消息

Question

我正在编写一个 javascript 程序，其中包含一个运行时间非常长的 foreach 循环，如下所示:

for (property in object) {
    difficultTask();
}

我看到您可以使用 setTimeout 做一些事情，这可以让您定期将控制权返回给浏览器；但是，我还没有看到任何能够使用 foreach 循环执行此操作的，只有带有索引的 for 循环。此外，这些任务不能异步完成，因为每次迭代都取决于前一次迭代的结果。

我能想到的一个解决方案是将我的对象拆分成许多较小的对象并遍历每个对象，在每个对象之间设置一个超时，但我想看看这是否可行而不求助于那个。

有没有办法在不彻底改变我拥有对象的方式的情况下做到这一点？

Answer 1

将所有属性放入一个数组中，然后您可以使用索引变量和 setTimeout() 循环遍历该数组:

var props = [];
for (property in object) {
    props.push(property);
}

var index = 0;
function nextChunk() {
    if (index < props.length) {
        difficultTask(object[props[index++]]));

        // schedule the next chunk of work after we let the browser process events
        setTimeout(nextChunk, 1);
    }

}
nextChunk();

如果不需要 IE7 或 IE8 兼容性，您还可以将所有 Prop 放入一个数组中:

var props = Object.keys(object);

---

根据长时间运行的任务的作用，网络 worker 也可能是一个有趣的选择，但在 IE 10 之前不支持 IE。