Question

我想在循环中放慢console.log的速度

    // function update to actualize value
function update() {
    requestAnimationFrame(update);
    analyser.getByteFrequencyData(data);

    var count=0;
    for (var i=data.length; i--;) {
    count+=data[i];
        if(count >= 1) {
            console.log(data);
        }
    };
}

例如，立即显示一个console.log，然后显示每个.5s 我们怎么做？（也许使用setTimeout（）但我不想启动延迟）

Answer 1

最简单的方法是在每次运行更新之前引入超时......

// function update to actualize value
function update() {
    analyser.getByteFrequencyData(data);

    var count=0;

    for (var i=data.length; i--;) {
        count+=data[i];
        if(count >= 1) {
            console.log(data);
        }
    };

    requestAnimationFrame(function() {
        setTimeout(update, 5000);
    });
}

我优先使用setTimeout()而不是setInterval()这样做（以及将调用移到函数末尾）将确保一切都已完成，然后再开始5秒暂停。如果前面的代码花费的时间超过5秒，它确保没有重叠。

Answer 2

首先创建一个变量来存储最后一个console.log的时间。接下来，每次console.log一个值时更新该变量。最后，添加一个检查阈值。

var lastOutput = 0; // Setting this to 0 initially will ensure it runs immediately
var outputThreshold = 500; // in milliseconds

function update() {
   requestAnimationFrame(update);
   analyser.getByteFrequencyData(data);

   if (new Date().valueOf() - lastOutput > outputThreshold) {
      // threshold met, output and update
      var count=0;
      for (var i=data.length; i--;) {
         count+=data[i];
         if(count >= 1) {
            console.log(data);
         }
      };
      lastOutput = new Date().valueOf();
   }
}

update(); // fire first call to update, after that requestAnimationFrame() will handle future calls

Answer 3

如果你想在for循环内时间延迟，你可以这样做：

function update() {
    requestAnimationFrame(update);
    analyser.getByteFrequencyData(data);

    var i = data.length - 1, count = 0;
    function logger() {
      count += data[i];
      if (count >= 1)
        console.log(data);
      if (i-- >= 0)
        setTimeout(logger, 500);
    }
    logger();
}

现在，事情会变得相当混乱，因为你还使用requestAnimationFrame()来安排整个事情的另一次迭代;那真的不再有意义了。您可能希望等待日志记录过程完成：

function update() {
    analyser.getByteFrequencyData(data);

    var i = data.length - 1, count = 0;
    function logger() {
      count += data[i];
      if (count >= 1)
        console.log(data);
      if (i-- >= 0)
        setTimeout(logger, 500);
      else
        requestAnimationFrame(update);
    }
    logger();
}

在循环中改变console.log的速度

3 个答案: