Solução alternativa

Não sei se era o requinte que o exercício esperava... mas funciona hehehe

Fica para avaliação!

Edit: reciclei o código pro próximo exercício também!

<canvas width="600" height="400"></canvas>

<script>

    var tela = document.querySelector('canvas');
    var pincel = tela.getContext('2d');

    pincel.fillStyle = 'lightgray';
    pincel.fillRect(0, 0, 600, 400);

    function desenhaCirculo(x,y,raio) {

        pincel.fillStyle = 'blue';
        pincel.beginPath();
        pincel.arc(x,y,raio,0,2*Math.PI);
        pincel.fill();

    }

    function limpaTela() {
        pincel.clearRect(0,0,600,400);

    }

    var sentido = false;
    var x  = 20;

    function atualizaTela() {

        limpaTela();
        desenhaCirculo(x,20,10);

        if(x == 600) {
            sentido = true;
        }
        if(x == 0) {
            sentido = false;
        }


        while(sentido == false) {
            x++;
            break;
        }

        while(sentido) {
            x = x - 1;
            break;
        }

    }


    setInterval(atualizaTela, 5);


</script>