javascript - 如何监控for循环？

Question

我想每 X 毫秒监控一次 for 循环的内容:

这是一个示例，我希望每 0.1 秒看到一次进度百分比:

for (i = 0, max = 9007199254740992, timer = setInterval(function() {console.log(100*i/max);}, 100); i < max; i++) {
  // something
}
clearInterval(timer);

但它没有输出任何内容。

我不想在循环中添加测试以避免使用无用的计算时间。

Answer 1

由于 Javascript 的单线程特性，您的 setInterval() 回调不可能在 for 循环结束之前调用，无论多长时间需要执行。

我建议以相反的方式进行:每 N 次迭代记录耗时。

var res = [],
    ts = performance.now();

for(var i = 0, max = 1E6; i < max; i++) {
  if(!(i % 10000)) {
    res.push(performance.now() - ts);
  }
  // do something
}

console.log(res);

或者:

var res = [],
    ts = performance.now();

for(var i = 0, iMax = 1E6; i < iMax; i += 10000) {
  for(var j = i, jMax = Math.min(i + 10000, iMax); j < jMax; j++) {
    // do something
  }
  res.push(performance.now() - ts);
}

console.log(res);

如果您确实想要实时登录，则必须在每批 N 次迭代后将控制权交给浏览器。不过，就性能而言，这可能会产生重大影响。

var res = [],
    ts = performance.now();

function processBatch(i, iMax, sz) {
  for(var j = i, jMax = Math.min(i + sz, iMax); j < jMax; j++) {
    // do something
  }
  console.log((j * 100 / iMax) + '%', (performance.now() - ts).toFixed(2) + 'ms');

  if(j < iMax) {
    setTimeout(function() { processBatch(j, iMax, sz); }, 0);
  }
}

processBatch(0, 1E6, 10000);

编辑:第三种方法进行了重大更新。之前的版本有错误。