Solucionado (ver solução)
Solucionado
(ver solução)
2
respostas

[Dúvida] Meu console não é mostrado da forma desejada

Referente a aula: "implementando listas".
Olá queridos, vou mandar meu codigo abaixo:

let listaDeNumerosAleatorios = [];
let numeroSecreto = gerarNumeroAleatorio();

function exibirTextoNaTela(tag, texto) {
    let campo = document.querySelector(tag);
    campo.innerHTML = texto;
}

exibirTextoNaTela('h1', 'Jogo do número secreto');
exibirTextoNaTela('p', 'Escolha um número entre 1 e 10');
let tentativa=1;

function verificarChute() {
    let chute = document.querySelector('input').value;
    chute = parseInt(chute);
    
    if(chute == numeroSecreto){
      exibirTextoNaTela('h1', 'Acertou!');
      let palavraTentativa = tentativa > 1 ? 'tentativas' : 'tentativa';
      let mensagemTentativas = `Parabéns você acertou com ${tentativa} ${palavraTentativa}`
      document.getElementById('reiniciar').removeAttribute('disabled');
      exibirTextoNaTela('p', mensagemTentativas)
    }else{ tentativa++;
      if (chute > numeroSecreto){
        exibirTextoNaTela('p', 'o número secreto é menor que '+chute);
      }else{
        exibirTextoNaTela('p', 'o número secreto é maior que '+chute);
      }
      limparCampo();
    }
}

function gerarNumeroAleatorio() {
    let numeroEscolhido = parseInt(Math.random() * 10 + 1);
    if (listaDeNumerosAleatorios.includes(numeroEscolhido)){
      return gerarNumeroAleatorio();
    }else{
      listaDeNumerosAleatorios.push(numeroEscolhido);
      console.log(listaDeNumerosAleatorios);
      return numeroEscolhido;

    }
}
function limparCampo(){
  chute = document.querySelector('input');
  chute.value = '';
}

function reiniciarJogo(){
  numeroSecreto = gerarNumeroAleatorio();
  limparCampo();
  tentativa = 1;
  document.getElementById('reiniciar').setAttribute('disabled', true);
}

O código está dessa maneira. E no console esta aparecendo assim:
Insira aqui a descrição dessa imagem para ajudar na acessibilidade

2 respostas
solução!

Oi, João! Tudo bem?

Parabéns por estar avançando no curso e por compartilhar seu código e o print conosco. Analisar o erro que aparece no console é uma das habilidades mais importantes da programação, e você já deu o primeiro passo tirando esse print!

Vamos entender o que está acontecendo ali na mensagem vermelha do seu console.

No seu print, o console mostra a seguinte mensagem de erro:
Uncaught ReferenceError: reiniciarChute is not defined

Traduzindo de forma simples: o navegador está tentando executar uma ação chamada reiniciarChute quando você clica no botão, mas ele diz "não encontrei nenhuma função com esse nome no seu código JavaScript".

A Solução

Ao olhar o código JavaScript que você colou aqui, percebi que a função responsável por reiniciar o jogo foi criada com o nome reiniciarJogo:

function reiniciarJogo(){
  numeroSecreto = gerarNumeroAleatorio();
  // ... resto do código
}

Percebe a diferença?

  • O HTML (o botão "Novo jogo") está chamando: reiniciarChute()
  • O seu JavaScript tem a função: reiniciarJogo()

Como os nomes são diferentes, a conexão não acontece.

Como resolver?

Você tem duas opções (eu recomendo a Opção 1 pra manter a semântica correta):

  1. Ir no seu arquivo index.html: Procure a linha do botão "Novo jogo" (provavelmente na linha 28, segundo o erro) e altere o onclick para chamar o nome correto que está no seu JS: onclick="reiniciarJogo()".
  2. Ou alterar no JavaScript: Mudar o nome da função de reiniciarJogo para reiniciarChute.

Faça esse ajuste e me conta se funcionou?

Bons estudos!

Alura Conte com o apoio da comunidade Alura na sua jornada. Abraços e bons estudos!

Muito obrigado pela atenção e rapidez querida!