deu trabalho mas consegui. para avaliacao e duvida de indentação.

Fiz o código do exercício e pensei em brincar um pouco mais. usando um trecho da aula 07 Gráfico de barras, eu escrevi um placar no canvas. depois usando a lógica que peguei no curso de jogos parte 1. tive uma certeza maior onde mexer pra colocar o marcador de pontos, e o aumento de dificuldade.

Ai entrou um problema tentei de tudo que é jeito na hora de aumentar a velocidade bugava eu desconfiei mas não tive certeza do (setInterval). que tava fazendo o alvo teleportar 2 vezes seguidas ate começar a bugar de vez. No fórum mesmo com a ajuda do (Geovani Granieri) eu descobri o (setTimeout) do modelo que eu tava fazendo foi o único que resolveu. Quis fazer o valor da pontuação independente do aumento de velocidade mas ambos dividindo o mesmo lugar onde ficava o alert().

• Uma pequena duvida sobre a indentação no meu (if, &&) vi escritas diferente queria saber se estar certo do jeito que fiz?

<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);


    raio = 10;
    var xAleatorio;
    var yAleatorio; 

    function desenhaCirculos(x,y,raio,cor){
        pincel.fillStyle = cor;
        pincel.beginPath();
        pincel.arc(x, y, raio, 0, 2 * Math.PI);
        pincel.fill();
    }
    function limpaTela(){
        pincel.clearRect(0, 0, 600, 400);
    }

    function desenhaAlvo(x,y){
        desenhaCirculos(x,y,raio + 20,"red");
        desenhaCirculos(x,y,raio + 10, "white");
        desenhaCirculos(x,y,raio, "red");
    }

    function sorteiaPosicao(maximo){
        return Math.floor(Math.random() * maximo)
    }

    var ponto = 0;
    var velocidade = 3000;

//========== Funções e variáveis adicionais ==============
    function exibePlacar(x,y, contador){
        var tela = document.querySelector("canvas");
        var pincel = tela.getContext("2d");
        pincel.font ="20px Georgia";
        pincel.fillStyle ="black";
        pincel.fillText(x,y, contador);
    }

    function mostraPontuacao(){
        exibePlacar("Pontuação = " + ponto, 5,15)
    }

    function marcaPonto(){
        ponto = ponto +100;
        verificaVelocidade();
    }

    function verificaVelocidade(){
        velocidade = velocidade -100;
        console.log(velocidade);
    }

    function start(){
        atualizaTela();
        setTimeout(start, velocidade);
    }
    //========================================================

    function atualizaTela(){
        limpaTela();
        xAleatorio = sorteiaPosicao(600);
        yAleatorio = sorteiaPosicao(400);
        mostraPontuacao();
        desenhaAlvo(xAleatorio,yAleatorio);
    }

    //setInterval(atualizaTela, velocidade);
    start();

    function disparo(evento){
        var x = evento.pageX - tela.offsetLeft;
        var y = evento.pageY - tela.offsetTop;

        if(x > xAleatorio - raio
            && x < xAleatorio + raio
                && y > yAleatorio - raio
                    && y < yAleatorio + raio){
                    //alert("acertou");
                             marcaPonto();
                   }
    }

    tela.onclick = disparo;

</script>