[Dúvida] Repetições excessivas | Lógica de programação: mergulhe em programação com JavaScript

Finalizei o curso porém fiquei com uma duvida. Quando recarrego a pagina do projeto e deixo no prompt ("Escolha um número ... ") e mudo de aba no navegador, ao retornar ao prompt e acertar percebo que varias tentativas foram incrementadas:

Insira aqui a descrição dessa imagem para ajudar na acessibilidade

Eu entendo que a estrutura do loop está girando várias vezes, mas fiquei em dúvida do por que o loop funciona mesmo sem a entrada da variável no prompt e por que só acontece isso ao mudar a aba do navegador (se não mudar a tentativa não incrementa independente do tempo).

Meu código está como na aula:

alert('Boas vindas ao jogo do número secreto');
let numeroSecreto = 5//parseInt(Math.random() * 10 + 1);
console.log(numeroSecreto)
let chute;
let tentativas = 1;

// enquanto chute não for igual ao n.s.
while (chute != numeroSecreto) {
    chute = prompt('Escolha um número entre 1 e 10');
    // se chute for igual ao número secreto
    if (chute == numeroSecreto) {
       break;
    } else {
        if (chute > numeroSecreto) {
            alert(`O número secreto é menor que ${chute}`);
        } else {
            alert(`O número secreto é maior que ${chute}`);
        }
        // tentativas = tentativas + 1
        tentativas++;
    }
}
let palavraTentativa = tentativas > 1 ? 'tentativas' : 'tentativa'
alert(`Isso ai! Você descobriu o número secreto ${numeroSecreto} com ${tentativas} ${palavraTentativa}`);

Olá, Caio!

O loop no seu código funciona mesmo sem a entrada da variável no prompt porque a condição do loop é verificar se o valor do chute é diferente do número secreto. Enquanto essa condição for verdadeira, o loop continuará executando. Portanto, mesmo sem a entrada do valor no prompt, o loop continuará rodando até que o chute seja igual ao número secreto.

Em relação a questão das várias tentativas serem incrementadas ao retornar à aba do navegador, isso pode acontecer porque o código está sendo executado novamente quando você volta para a aba. Isso ocorre porque o código é reiniciado quando a página é recarregada. Portanto, cada vez que você retorna à aba, o código é executado novamente e a variável "tentativas" é reiniciada para 1.

Uma solução para evitar que as tentativas sejam incrementadas ao retornar à aba do navegador seria armazenar o valor da variável "tentativas" em algum lugar persistente, como o armazenamento local (localStorage) ou um cookie. Dessa forma, quando você retorna à aba, o valor da variável "tentativas" seria recuperado e não seria reiniciado para 1.

Bons estudos!

Mergulhe em programação