I am writing a game and for example I took the HTML5 Games Guide without tears

I try to keep the structure as it is, and for this I rewrote part of my old code. After that, it stopped working and gives an error

SyntaxError: expected expression, got ';' [Learn More] snake.html: 24: 22a

How to fix ?

<!doctype html> <html> <head> <title> Snake </title> <meta charset='utf-8' /> </head> <body> <canvas id='canvas' width="800" height="600" style="border: 1px solid #000000;"></canvas> <style>#canvas { background-color: rgba(158, 167, 184, 0.2); }</style> <script type = "text/javascript"> var canvas = document.getElementById("canvas"); ctx = canvas.getContext('2d'); var dx = 0; var dy = 0; var FPS = 30; setInterval(function () { function update(); function draw(); } 1000/FPS); function update(){ dx++; window.requestAnimationFrame(draw); } function draw(){ ctx.clearRect(0, 0, 800, 600); ctx.fillStyle = "green"; ctx.fillRect(dx, dy, 25, 25); } </script> </body> </html>

1 answer 1

Put comments in places with errors

 var canvas = document.getElementById("canvas"); // стояла ; должна быть запятая, либо на следующей var, если это не глобальная переменная var ctx = canvas.getContext('2d'); var dx = 0; var dy = 0; var FPS = 30; setInterval(function() { update(); // лишнее слово function draw(); // лишнее слово function }, 1000 / FPS); // пропущена , перед значением интервала function update() { dx++; window.requestAnimationFrame(draw); } function draw() { ctx.clearRect(0, 0, 800, 600); ctx.fillStyle = "green"; ctx.fillRect(dx, dy, 25, 25); }

Good codding, and fewer mistakes!