javascript - 为定时器设置回调函数

Question

我即将完成这个程序，但我无法弄清楚最后一部分。我的网页连接到服务器以获取随机生成的数字，然后将其绘制在图表上。我需要对其进行设置，以便它每 2 秒绘制一次数据点，但我不知道如何设置我的 setInterval 命令。我可以让它与 for 循环一起工作，但这显然没有定时。当我将限制设置为超过某个阈值时，它也会崩溃，这可能表明尝试使用计时器时出现问题。我将发布我的代码以及我尝试过的一些事情。

首先是代码:

function plotData(dataSet) 
{
var x = xScale+20; // 20 = margin length
var y = 260;    //origin of graph

context.strokeStyle="#0000FF";
context.beginPath();

for (i = 1; i <= 10; i++)
{
  getRequest(function(random)
  { 
    var diff = (dataSet[0]*100) - (dataSet[1] * 100);
    diff = diff/5;                                                          
    y = y+(diff*23);

    context.lineTo(x, y);
    context.moveTo(x, y);
    context.stroke();   

    x=x+xScale;
    console.log("dataSet = "+dataSet[0]+", "+dataSet[1]);
    dataSet[0] = dataSet[1];
  });   
}
}

我现在将其设置为循环以进行调试。

回调函数到达 XMLHttpRequest 来获取随机数(如果需要，我也可以发布此代码)。

我试图做的是实现 setInterval 以及一些 bool 值，以便在第二次函数调用时停止该函数。

类似这样的事情:

var isRunning = false;

function plotData(dataSet) 
{
 if (isRunning == false)
 {
  isRunning = true;
 }

 if (isRunning == true)
 {
  isRunning = false;
  myTimer = clearInterval();
 }
var myTimer;
var x = xScale+20; // 20 = margin length
var y = 260;    //origin of graph

context.strokeStyle="#0000FF";
context.beginPath();

 while (isRunning == true)
 {
  myTimer = setInterval(function()
  { 
   getRequest(function(random)
   {    
    var diff = (dataSet[0]*100) - (dataSet[1] * 100);
    diff = diff/5;                                                          
    y = y+(diff*23);

    context.lineTo(x, y);
    context.moveTo(x, y);
    context.stroke();   

    x=x+xScale;
    console.log("dataSet = "+dataSet[0]+", "+dataSet[1]);
    dataSet[0] = dataSet[1];
   });
  }, 2000);

 }
}

我添加了一个全局 bool 值isRunning用于处理目的。

如果 isRunning 之前为 false(表明它现在正在进行中)，我将其设置为 true。

如果 isRunning 之前为 true，我将其设置为 false，然后继续执行 clearInterval 来停止它。

最后设置一个 while 循环，让回调函数执行 while isRunning == true

这一切导致我的程序崩溃。在这种情况下如何正确使用 setInterval 函数？

Answer 1

在传递给 setInterval() 的回调中执行检查 isRunning == true。尝试这样的事情，

myTimer = setInterval(function(){
  if(isRunning == true) {
    /* clear the timer */
  }
  /* Else perform the request */
}, 2000)

当 isRunning 计算结果为 true 时，计时器将被清除，停止后续的 setInterval。