Problemas com arrays | JavaScript e HTML: desenvolva um jogo e pratique lógica de programação

Solucionado (ver solução)

Solucionado
(ver solução)

4
respostas

por Igor Telles

| 104.8k xp | 34 posts

Desenvolvedor

Estou assistindo à primeira aula do último capítulo de Lógica da programação I, e estou enfrentando problemas acerca do uso de arrays. Meu objetivo é fazer um programa em que o usuário deve tentar acertar um de quatro números escolhidos por mim. O problema é que ele só diz que o usuário acertou se ele inserir o primeiro item do array. Por exemplo, [5 , 6, 7 , 8], o programa só diz que o usuário acertou se ele digitar 5. Caso o usuário digite 6, o programa diz que ele errou, mesmo com o conteúdo presente no array.

Segue abaixo o código

<meta charset="UTF-8">

<h2> Tente adivinhar o número que eu pensei!</h2>
<input/>
<button> Enviar</button>

<script>

    var segredos = [5,6,10,2];
    console.log(segredos);

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

    function verifica() {

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

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

                alert("Você acertou!!!");
                break;
            } else {

                alert("Você errou!");
            }

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

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

</script>

Gostaria de saber o que eu fiz de errado no código, já que já comparei o meu com o do instrutor várias vezes e não encontrei erro.

4 respostas

por Carlos Pereira Dias

| 527k xp | 54 posts

01/11/2016

Veja se isso ajuda.

<!DOCTYPE html>
<html lang="en">
    <head>
        <title></title>
        <meta charset="UTF-8">
        <link href="css/style.css" rel="stylesheet">
    </head>
    <body>
        <h2> Tente adivinhar o número que eu pensei!</h2>
        <input name="numero" id="numero" title="Entre com um número entre 1 e 5"/>
        <button> Enviar</button>

        <script>
            var segredos = [5,6,10,2];

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

            input.focus();

            function verifica() {
            var numero_selecionado;

            numero_selecionado = parseInt(input.value,10);

            if (segredos.indexOf(numero_selecionado)> -1){
                    alert("Você acertou!!!");
                    return;   
            }
            alert('Você errou!');
            }    

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

        </script>
    </body>
</html>

por Flavio Henrique de Souza Almeida

| 3119.3k xp | 6969 posts

Instrutor Instrutor/Desenvolvedor Web Sênior/Autor

02/11/2016

Se segundo elemento é o certo ele vai exibir que errou para o primeiro e depois que acertou para o segundo. Se todos forem errado ele vai exibir uma mensagem de erro para cada comparação. É isso que ocorre? Isso é esperado.

Se você quer exibir uma mensagem de erro apenas ai a lógica e outra.

O que você deseja?

por Igor Telles

| 104.8k xp | 34 posts

Desenvolvedor

02/11/2016

Por exemplo, [5,6,7,8], se eu inserir o 5, ele dá a mensagem de acerto primeiro, e depois 3 de erro. Ok, esse era o objetivo. Porém se eu insiro, o 6, por exemplo, ele dá todas as mensagens de erro, incluindo a segunda. Esse é o meu problema.

solução!

por Daniel Silva

| 64.3k xp | 1 posts

02/11/2016

Igor, o problema é que dentro do for existe essas duas instruções:

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

E por conta disso, o valor digitado pelo usuário está sendo perdido logo ao término da primeira iteração. Daí consequentemente o seu exemplo: Valor informado 6, que deveria dar o resultado "você acertou!!!", acaba falhando a comparação e o resultado obtido é "Você errou!".

Tente assim:

<meta charset="UTF-8">

<h2> Tente adivinhar o número que eu pensei!</h2>
<input/>
<button> Enviar</button>

<script>

    var segredos = [5,6,10,2];
    console.log(segredos);

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

    function verifica() {

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

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

                alert("Você acertou!!!");
                input.value = "";
                input.focus();
                break;
            } else {

                alert("Você errou!");
            }
        }
    }    

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

</script>