Я делаю игру Pong на javascript, чтобы научиться создавать игры, и я хочу сделать ее объектно-ориентированной.

Я не могу получитьclearRect работать. Все, что он делает, это рисует линию, которая растет дольше. Вот соответствующий код:

function Ball(){
    this.radius = 5;
    this.Y = 20;
    this.X = 25;
    this.draw = function() {
        ctx.arc(this.X, this.Y, this.radius, 0, Math.PI*2, true);
        ctx.fillStyle = '#00ff00';
        ctx.fill();
    };
}

var ball = new Ball();

function draw(){
    player.draw();
    ball.draw();
}

function update(){
    ctx.clearRect(0, 0, 800, 400);
    draw();
    ball.X++;
}

Я пытался поставитьctx.clearRect участие вdraw() а такжеball.draw() функции, и это не работает. Я тоже пробовалfillRect с белым, но это дает те же результаты. Как я могу это исправить?