Imersão Dev - Aula 2 | Expandindo os Conhecimentos
Olá a todos. Como sabem, essa semana, está rolando a Imersão Dev, e tivemos a segunda aula, então, iremos expandir os conhecimentos.
Alguns desafios serão mostrados nesse artigo, pois eles são necessários para os conteúdos do post.
Código
O Código entregue no final da aula foi:
var numeroSecreto = parseInt(Math.random() * 1001);
while (chute != numeroSecreto) {
var chute = prompt("Digite um número entre 0 e 1000");
if (numeroSecreto == chute) {
alert("Acertou!");
} else if (chute > numeroSecreto) {
alert("Chute é Maior do que o Número Secreto!");
} else if (chute < numeroSecreto) {
alert("Chute é Menor do que o Número Secreto!");
}
}
Perceba que eu mudei as mensagens do alerta. Você pode altera-lás como quiser.
Conteúdos
- Desafio: Concatenação de Strings
- Desafio: Contador de Chutes
- Limitando a quantidade de chutes
Desafio: Concatenação de String
Desafio feito pelo instrutor Paulo Silveira, aos 39:05 do Vídeo.
Precisamos mostrar no alert o valor que o usuário chutou.
Ideia
Esse desafio não tem mistério. Precisamos apenas fazer com que a mensagem fique algo assim: 500 é Maior do que o Número Secreto!
Implementação
Concatenamos o valor do chute com a mensagem dentro do alert.
} else if (chute > numeroSecreto) {
alert(chute + " é Maior do que o Número Secreto!");
} else if (chute < numeroSecreto) {
alert(chute + " é Menor do que o Número Secreto!");
}
Desafio: Contador de Chutes
Desafio feito pelo instrutor Paulo Silveira, aos 39:45 do Vídeo
Precisamos adicionar um contador de chutes, para o usuário saber quantos chutes já foram dados.
Ideia
Vamos adicionar um contador, que a cada vez que o usuário chuta algum número, esse contador acrescenta um.
Implementação
Fazendo um contador
A maneira mais primitiva de se fazer um contador que adiciona um a cada execução é atribuir o valor de variável a ela mesma mais um. Vamos ver na prática:
var chutes = 0;
chute = chutes + 1;
Para adicionar um aos chutes, podemos fazer também: chutes += 1 chutes++. As três implementações estão certas, e fazem a mesma função.
var numeroSecreto = parseInt(Math.random() * 1001);
var chutes = 0;
while (chute != numeroSecreto) {
chutes++;
var chute = prompt("Digite um número entre 0 e 1000");
if (numeroSecreto == chute) {
alert("Acertou!");
} else if (chute > numeroSecreto) {
alert(chute + " é Maior do que o Número Secreto!");
} else if (chute < numeroSecreto) {
alert(chute + " é Menor do que o Número Secreto!");
}
alert("Você fez um total de " + chutes + " chutes!");
}
Limitando a quantidade de chutes
Podemos também limitar a quantidade de chutes para o jogador.
Ideia
Vamos colocar um limite de 15 chutes por jogo. Ao começo do jogo, avisaremos quantos chutes o jogador terá, e a cada chute que ele fizer, irá mostrar quantos chutes ainda restam. Caso o jogador acertar o número, irá mostrar o total de chutes que o jogador fez. Caso o jogador continuar errado e o limite de chutes for excedido, o jogo dará Game Over.
Implementação
Implementando o Limite
Em nosso exemplo, colocaremos um limite de chutes (15), além dos chutes restantes.
Para fazer a lógica do limite, precisamos que quando o número de chutes for Maior ou Igual ao limite, paramos o jogo. Para implementarmos, vamos aprender um novo operador lógico: >=. Ele é igual ao operador de >, mas com a diferença que se os dos valores são iguais, o código dentro do if também é executado.
Para pararmos o jogo, na verdade, precisamos "freiar" o while. Para isso, existe uma palavra: o break, que quando é executado pelo JavaScript, o código dentro do while não será executado mais.
var numeroSecreto = parseInt(Math.random() * 1001);
var numeroSecreto = 500;
var chutesLimite = 15;
var chutesRestante = chutesLimite;
var chutes = 0;
alert("E O Jogo Começa! Você tem um limite de " + chutesLimite + " chutes!");
while (chute != numeroSecreto) {
if (chutes >= chutesLimite) {
alert("Você atingiu o limite de chutes. O Jogo está finalizado.");
break;
}
var chute = prompt("Digite um número entre 0 e 1000");
chutes++;
chutesRestante--;
if (numeroSecreto == chute) {
alert("Acertou! Você fez um total de " + chutes + " chutes!");
} else if (chute > numeroSecreto) {
alert(chute + " é Maior do que o Número Secreto!");
alert("Ainda lhe restam " + chutesRestante + " chutes!");
} else if (chute < numeroSecreto) {
alert(chute + " é Menor do que o Número Secreto!");
alert("Ainda lhe restam " + chutesRestante + " chutes!");
}
}
Perceba que para a implementação do
chutesRestante, usamos um--. Isso subtrai um do valor da variável Note que agora, em cada if, é dado um alerta. Caso o jogador errou, a mensagem de Chutes Restantes é a mesma. Mas se caso o jogador acertou, mostra um alerta de quantos chutes o jogador fez na rodada.
Sobre Mim 🐘
Me Chamo Erick. Desenvolvedor PHP (Symfony).
Se me permite alguns pitacos...
A parte do if/else poderia ser assim:
if (chute == numeroSecreto) {
alert("Acertou! Você fez um total de " + tentativas + " chutes!");
} else if (chute > numeroSecreto) {
alert(chute + " é Maior do que o Número Secreto!");
} else {
alert(chute + " é Menor do que o Número Secreto!");
}
Afinal, se chute não for igual a numeroSecreto, ele não entra no primeiro if. Se chute não for maior que numeroSecreto, não entra no segundo if. Então se ele não entrou no if e nem no else if, é porque chute não é igual e nem maior que numeroSecreto. A única possibilidade que sobrou é chute ser menor que numeroSecreto, então não precisa testar isso de novo.
Ok, o único caso em que isso não funcionaria é se a pessoa não digitar um número, pois aí todas as comparações falhariam, mas não ficou claro se era para validar isso. Mas se
chutesempre for um número, o último caso só precisa de umelsee nada mais.
Quanto a isso:
var numeroSecreto = parseInt(Math.random() * 1001);
Sei que nesse caso "funciona", mas a ideia de parseInt é que ele receba uma string e a converta para número. Se você quer truncar/arredondar um número, tem casos em que parseInt pode falhar. Uma opção mais segura é usar Math.floor:
var numeroSecreto = Math.floor(Math.random() * 1001);
Um lugar em que parseInt poderia ser usado é no prompt. Afinal, prompt retorna uma string, e nesse caso faz sentido converter para número. Sei que o JavaScript faz coerção de tipos quando você faz as comparações, mas usar parseInt deixa claro a intenção ("aqui precisa ser um número"). Com isso, também se torna mais simples verificar se foi de fato digitado um número, como veremos no código abaixo.
E quando acabam os chutes, vc mostra "Ainda lhe restam 0 chutes", mas será que precisa dessa mensagem? Se restam 0 chutes, é porque acabou, acho que poderia pular essa mensagem quando chegar a zero e mostrar logo a mensagem final.
Por fim, daria para eliminar algumas variáveis, seria assim:
// floor para arredondar o valor
// (parseInt não funciona em todos os casos: https://pt.stackoverflow.com/q/506307/112052)
var numeroSecreto = Math.floor(Math.random() * 1001);
var chutesLimite = 15;
var tentativas = 0;
alert("E O Jogo Começa! Você tem um limite de " + chutesLimite + " chutes!");
while (true) {
// parseInt para converter para número
var chute = parseInt(prompt("Digite um número entre 0 e 1000"));
if (isNaN(chute)) { // verifica se foi digitado um número mesmo
alert('Você não digitou um número');
// vai para a próxima iteração, entendo que não conta como tentativa,
// já que não é um número
continue;
}
tentativas++;
if (chute == numeroSecreto) {
alert("Acertou! Você fez um total de " + tentativas + " chutes!");
break; // sai do while
} else if (chute > numeroSecreto) {
alert(chute + " é Maior do que o Número Secreto!");
} else {
// se chegou nesse else, é porque chute não é igual e nem maior que numeroSecreto
// então com certeza é menor e não preciso testar isso de novo
alert(chute + " é Menor do que o Número Secreto!");
}
if (tentativas == chutesLimite) {
alert("Você atingiu o limite de chutes. O Jogo está finalizado.");
break; // sai do while
} else {
alert("Ainda lhe restam " + (chutesLimite - tentativas) + " chutes!");
}
}