Entrar Ainda não tem acesso?
Solucionado (ver solução)
Solucionado
(ver solução)
7
respostas

Parte 7 - Consolidando seu conhecimento

Referente ao curso JavaScript e HTML: desenvolva um jogo e pratique lógica de programação

por Bruno Degaspare Dias
| 68.7k xp | 61 posts
Product Designer

Estou tentando implementar o numero de tentativas no jogo advinha numero juntamente com o input e o button.

Porem quando insiro um numero no input e clico no botao Advinha, o loop é executado 3 vezes em 1 clique.

Como posso fazer com que o loop apenas some o numero de tentativas?

Esse é o meu codigo:

function pulaLinha() {
  document.write("<br>");
  document.write("<br>");
}

function mostra(frase) {
  document.write(frase);
  pulaLinha();
}

function sorteia(n) {
  return Math.round(Math.random() * n);
}

var numeroPensado = sorteia(10);


var button = document.querySelector('button'),
    input = document.querySelector('input');
    input.focus();


function verifica() {
  var tentativas = 0;
  var chute = input.value;

  while(tentativas <= 3) {
    if(chute === numeroPensado) {
      mostra("Acertou!");
      break;
    } else if(chute !== numeroPensado) {
      mostra("Errou!");
      tentativas++;
      input.focus();

      if(tentativas === 3) {
        mostra("GAME OVER!");
        break;
      }
    }
  }
}

button.onclick = verifica;
7 respostas
por Bruno Degaspare Dias
| 68.7k xp | 61 posts
Product Designer

Aqui tem um exemplo melhor do que está acontecendo: http://codepen.io/brunodd/pen/dpbywB

solução!
por Fernando Stefanini
| 48.6k xp | 17 posts

Olá Bruno,

do jeito que está feito, sempre que a função verifica() for chamada, a variável tentativas será inicializada com valor = 0. Logo o while sempre rodará três vezes.

Uma maneira de resolver isso pode ser declarar a variável fora do escopo da função, como global. E a cada chamada de verifica() incrementá-la fazendo tentativas++ ou tentativas+=1.

Daí dentro da função, você só checa se 

if(tentativas <= 3) {...}

E se for maior, mostrar o "GAME OVER!"

por Flavio Henrique de Souza Almeida
| 3119.3k xp | 6969 posts
Instrutor Instrutor/Desenvolvedor Web Sênior/Autor

Foi Bruno? Dúvidas ainda?

por Bruno Degaspare Dias
| 68.7k xp | 61 posts
Product Designer

Opa, valeu Fernando! Eu pensei que precisaria usar algum loop para esta tarefa. Sua sugestao funcionou.

Sim Flavio, deu certo. Tive que modificar algumas partes do codigo, inclusive a funcao mostra() pois o document.write estava removendo o input e o botao da pagina.

Eu aproveitei para incluir uma opcao extra: Apos as 3 tentativas, eu desabilito o input e o botao.

O que eu nao entendo é por que a palavra "Errou" nao se repete. Por exemplo: Vc erra duas vezes, o correto seria aparecer a palavra "Errou" duas vezes, certo? Nao sei se isso é devido a alguma atualizacao do browser ou se é alguma parte que está faltando no meu codigo.

Aqui esta o resultado final:

http://codepen.io/brunodd/pen/dpbywB

var button = document.querySelector('button'),
    input = document.querySelector('input');

input.focus();

function mostra(frase) {
  mensagem = document.getElementById('resposta');
  mensagem.textContent = frase;
  pulaLinha();
}

function pulaLinha() {
  mensagem.innerHTML += "<br>";
}

function sorteia(n) {
  return Math.round(Math.random() * n);
}

var numeroPensado = sorteia(10);

var tentativas = 0;

function verifica() {
  var chute = input.value;
  tentativas++;

  if(tentativas <= 3) {
    if(chute !== numeroPensado) {
      mostra("Errou!");
      input.focus();
      input.value = '';
      tentativas++;
    } else {
      mostra("Acertou!");
    }
  } else {
    mostra("Errou todas. O numero pensado foi " + numeroPensado + " GAME OVER!!!");
    input.value = '';
    input.disabled = true;
    button.disabled = true;
  }
}

button.onclick = verifica;
por Flavio Henrique de Souza Almeida
| 3119.3k xp | 6969 posts
Instrutor Instrutor/Desenvolvedor Web Sênior/Autor

É que o document.write se for chamado depois da página ter sido exibida ele apaga tudo que tinha nela para escrever novamente(por isso eu uso alert) É uma limitação dele. Contudo ele é mais simples para quem quer aprender lógica. Se você quiser avançar ns linguagem javascript aprenderá em outros cursos outras formas. O importante agora é aprender lógica. Tudo bem?

por Bruno Degaspare Dias
| 68.7k xp | 61 posts
Product Designer

Tranquilo Flavio. Estou com uma duvida com relacao ao meu codigo, mas vou abrir um novo topico para isso.

por Flavio Henrique de Souza Almeida
| 3119.3k xp | 6969 posts
Instrutor Instrutor/Desenvolvedor Web Sênior/Autor

Se for outra questão abre sim. Ajuda os moderadores e os colegas a te ajudarem. Se for ainda sobre o mesmo código pode postar aqui.