1
resposta

Jogo de Adivinha com 3 tentativas + INPUT e BUTTON

O código abaixo se propõe a unir as aulas 7 e 8. Quero que o usuário insira um número em um Prompt e outro usuário tenha 3 chances de acertar.Tudo dá certo, exceto que, quando o usuário erra, o programa emite os três alertas de erro na sequencia e encerra. O que eu estou fazendo errado?

<meta charset="UTF-8">

<center>
<h1>Programa de Adinhação<h1>
<h2>Para jogar em dupla</h2>
</center>
<br>
<b>Instruções:</b>
<br>
1 - O priemiro da dulpa insere um número no <i>pop-up</i> sem o segundo olhar.<br>
2 - A seguir, o segundo pode inserir 3 palpites.<br>
<br>
<input/>
<button>Palpite</button>
<br>

<script>

    //função de quebra de linha
    function pulaLinha() {
        document.write ("<br>");
        document.write ("<br>");
    }

    //função de imprimir na tela
    function exibeTela(sentenca){

        document.write(sentenca);
        pulaLinha();
    }

    //função de verificação dos palpites
    function verificaNumero() {

        var tentativa = 1;
        while (tentativa <=3) {

            if (palpite.value == numero) {

                    alert ("Você ACERTOU!!!!");
                    exibeTela("FIM DO PROGRAMA")
                    break;
                } else {


                    alert ("Você ainda não acertou. Tente novemante.");
            }
            tentativa++;
            palpite = document.querySelector("input");
            palpite.value = "";
            palpite.focus ();
        }
        exibeTela("Você não tema mais tentativas. O numero inserido foi " + numero + ".");
        exibeTela("FIM DO PROGRAMA");
    }    

    //jogar
    var palpite = document.querySelector("input");
    palpite.value = "";
    palpite.focus ();
    var numero = parseInt(prompt ("Insira um número entre 1 e 10."));
    var botaoPalpite = document.querySelector("button");
    botaoPalpite.onclick = verificaNumero;

</script>
1 resposta

Oi Cristiano, tudo bem?

No caso, acredito que o problema esteja no laço dentro da função. Toda vez que clicarmos no botão, ele rodará o while e ficará preso no loop por conta do else não possuir nada que impeça o laço de continuar rodando após executar esse trecho do código.

    else {
        alert ("Você ainda não acertou. Tente novemante.");
    }
    tentativa++;
    palpite = document.querySelector("input");
    palpite.value = "";
    palpite.focus ();
}

Para resolver isso, podemos retirar o laço de dentro da função, dessa forma o número é verificado apenas uma vez quando você clicar no botão e não entra em um loop.

    //função de verificação dos palpites
    function verificaNumero() {
        if (palpite.value == numero) {
            alert("Você ACERTOU!!!!");
            exibeTela("FIM DO PROGRAMA");
        } else {
            alert("Você ainda não acertou. Tente novemante.");
        }
        tentativa++
        palpite = document.querySelector("input");
        palpite.value = "";
        palpite.focus();

        if (tentativa == 3) {
            exibeTela("Você não tema mais tentativas. O numero inserido foi " + numero + ".");
            exibeTela("FIM DO PROGRAMA");
        }
    }

Foram feitas algumas alterações na função verificaNumero():

  1. Retirada do while na função para evitar que o código entre em loop toda vez que o botão for pressionado;
  2. Retirada do break, pois como retiramos o laço, não há mais a necessidade de um break para interromper sua execução;
  3. Por fim, para substituir a condição imposta no while que retiramos, adicionamos um if que só é acionado caso o número de tentativas seja 3. Nesse caso, também teremos que retirar o var tentativa de dentro da função, já que se declararmos ela lá dentro, toda vez que você clicar no botão, ela será redeclarada e perderemos o valor armazenado lá dentro. Portanto declaramos a var tentativa no corpo do código e dentro da função nós continuamos apenas incrementamos com tentativa++.
    //jogar
    var tentativa = 0;
    var palpite = document.querySelector("input");
    palpite.value = "";
    palpite.focus();
    var numero = parseInt(prompt("Insira um número entre 1 e 10."));
    var botaoPalpite = document.querySelector("button");
    botaoPalpite.onclick = verificaNumero;
</script>

Espero ter ajudado, se ficou qualquer dúvida é só avisar!

Bons estudos!!