Mensagem de Alert aparece para cada item do array, mesmo com acerto. | JavaScript e HTML: desenvolva um jogo e pratique lógica de programação

No meu programa, utilizando o array var segredos = [5,7,10,2,3] e chutando o número 10 por exemplo, o sistema dá 'Você errou!' duas vezes, depois 'Você acertou!' uma vez e 'Você errou!' duas vezes. O que pode estar errado?

<meta charset="UTF-8">

<input/>
<button>Compare com o meu segredo</button>

<script>

    var segredos = [5,7,10,2,3];

    var input = document.querySelector("input");
    input.focus();

    function verifica () {

        var achou = false;

        for(var posicao = 0; posicao < segredos.length; posicao++){

            if(input.value == segredos[posicao]) {

                alert ("Você acertou!");
                achou = true;
                break;

            } 

            if(achou == false){

                alert("Você errou!")
            }


        }
            input.value = "";
            input.focus();

    }

    var button = document.querySelector("button");

    button.onclick = verifica;


</script>

Oi, Mauro! Tudo bom contigo?

Para que o alert apareça em tela uma única vez, precisamos deslocar a estrutura condicional if que verifica se a variável achou é igual a false dentro da função verifica(), da seguinte forma:

function verifica () {

        var achou = false;

        for (var posicao = 0; posicao < segredos.length; posicao++){

            if(input.value == segredos[posicao]) {
                alert ("Você acertou!");
                achou = true;
                break;
            } 
        }

        if(achou == false){
            alert("Você errou!")
        }

        input.value = "";
        input.focus();

}

Uma vez que essa condição estava inicialmente dentro da estrutura de repetição for, toda vez que a variável posição fosse incrementada, uma nova verificação seria feita, gerando mais de um alerta caso o número escolhido não estivesse na lista segredos (apresentando uma sequência de “Você errou!”) ou estivesse em uma posição específica (apresentando “Você errou!” e “Você acertou!” seguidamente).

Depois da alteração que fizemos, se o usuário acertar o número, a variável achou recebe o valor true e assim estrutura de repetição é finalizada. Caso contrário, isto é, se nenhum dos números corresponder àquele escolhido pelo usuário, a variável achou continua com o valor false, como estabelecido no início da função verifica(). Portanto, se achou permanecer igual a false depois de toda a lista ter sido percorrida, a repetição acaba e, logo em seguida, é analisado se achou == false uma única vez!

Mauro, espero que tenha compreendido minha explicação. Quaisquer dúvidas, fico à disposição para te ajudar!

Até mais e ótimos estudos!

Caso este post tenha lhe ajudado, por favor, marcar como solucionado ✓.

Mergulhe em programação