1
resposta

Tudo que vai Volta

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

<script>

    var tela = document.querySelector('canvas');
    var pincel = tela.getContext('2d');
    pincel.fillStyle = 'gray';
    pincel.fillRect(0,0,600,400);

    function desenhaBolinha(x,y,raio){

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

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

    var x = 20;
    var ida = true;

    function atualizaTela(){
        limpaTela();
        desenhaBolinha(x,20,10);

        if(ida && x < 590){
            x++;
        }
        else if(x > 10) {
            ida = false;
            x--;
        } else{
            ida = true;
        }
}  

       setInterval(atualizaTela,10);

    </script>
1 resposta

Olá, Claudney! Tudo bem por aí?

Excelente, sua solução está correta, parabéns!

Caso tenha alguma dúvida não deixe de compartilhar.

Bons estudos e até mais!