Javascript fillRect（）导致脚本失败

我不熟悉使用画布的HTML5动画，我只是想知道这段代码有什么问题。我正在使用最新版本的谷歌浏览器。提前谢谢

请注意，这是我第一次使用JavaScript和HTML5进行游戏制作，因此任何提示都非常感谢

var canvas=document.createElement（“canvas”）；
var ctx=canvas.getContext（“2d”）；
画布宽度=1000；
帆布高度=600；
document.body.appendChild（画布）；
变量播放器={
速度：256，
x:canvas.width/2，
y:canvas.height/2，
};
var keysDown={}；
var移动；
addEventListener（“keydown”，函数（e）{keydown[e.keyCode]=true；}，false）；
addEventListener（“keyup”，函数（e）{delete keyDown[e.keyDown]；}，false）；
变量更新=函数（修饰符）{
移动=玩家。速度*修改器；
如果（38键向下）player.y-=移动；
如果（40英寸向下键）player.y+=移动；
如果（37键向下）player.x-=移动；
如果（39键向下）player.x+=移动；
};
var render=函数（）{
ctx.fillRect（player.x，player.y，20,20）；
};
var main=函数（）{
var now=Date.now（）；
var delta=现在-那时；
更新（delta/1000）；
然后=现在；
};
var then=Date.now（）；
设置间隔（主，16）；

编辑：
改变

并添加了逗号

编辑：
将

setInterval（main，1）

更改为

setInterval（main，16）

编辑：
找到了错误，但我不确定为什么会出错

在我的另一个画布实验中，我使用了图像而不是

fillRect（）

，我将所有图像的渲染更改为

fillRect

，脚本无法工作

---

有人能解释一下吗？

您基本上是使用1毫秒的间隔来阻止浏览器

var player = {
    speed: 256,
    x: canvas.width/2,
    y: canvas.height/2
};

试着做一些更现实的事情：

setInterval(main, 16);

---

或考虑使用<代码>请求动画框架< /C> >（推荐）。这是最好的javascript图形引擎（imo）。“我只是想知道这段代码有什么问题”，这就是你应该告诉我们的。你期望它做什么？它会做什么？浏览器的javascript错误控制台中是否有任何错误消息？它应该显示一个矩形，每当您按下其中一个箭头键时，该矩形都会移动，相反，它只显示一个空白屏幕。我不确定如何检查错误消息。好的。我更改了，但在浏览器中仍然看不到任何内容。@user2921024请提供一个提琴，以便我们可以更深入地了解这一点，因为有点不清楚到底发生了什么（可能在代码的其他部分）。该代码应该使一个框在按下箭头键时移动。A对于代码的其他部分，这是除了HTML之外的唯一一段代码。

setInterval(main, 16);