setInterval不工作（Javascript）

Question

我想在Javascript中使用setInterval来定期重画画布。但是，当我调用setInterval函数时，我传递给它的函数只运行一次。以下是我的代码的简化版本：

<canvas id="myCanvas" width="400" height="400"> 
</canvas> 
<script type="text/javascript"> 

function makeBoard() 
{ 
    this.board=[["O", " ", " "], [" ", " ", " "], [" ", "X", " "]]; 
} 

var canvas = document.getElementById("myCanvas"); 
var ctx = canvas.getContext("2d"); 
var ticTacToeBoard=new makeBoard(); 

var drawCanvas = new Function("printBoard", ""); 

drawCanvas = function(printBoard) 
{ 
    alert("Calling draw function."); 
    // drawing code 
} 

setInterval(drawCanvas(ticTacToeBoard), 10); 
</script> 

我已经在Firefox 54.0.1和Google Chrome版本59.0上对此进行了测试。为什么这不起作用，我怎样才能让我的代码定期重画画布？

Answer 1

您应该将函数定义传递给setInterval方法，而不是函数调用的结果。

setInterval(function() { 
    // Do something 
}, 1000); 

对于你的情况，

setInterval(function() { 
    drawCanvas(ticTacToeBoard); 
}, 10);