Solucionado (ver solución)
Solucionado
(ver solución)
10
respuestas

CUANDO LE DOY EN VERIFICAR ME TIRA QUE TODOS LOS NUMEROS SON ERRONEOS, QUE ESTOY HACIENDO MAL?

**

<script>
    var secretos = [3,5,7];
    var input = document.querySelector("input"); /*querySelector = "trae" todo el objeto 
                                                                                     del HTML, en este caso el input, para
                                                                                     manipularlo con JavaScript*/
    input.focus();

    function Verificar(){
        if (parseInt(input.value) == secretos){ //acá comparo uno con otro
            alert("Usted acertó");
        }
        else{
            alert("Usted erró");
        }
        input.value = " ";
        input.focus();
    }
    var button = document.querySelector("button");
    button.onclick = Verificar; /*cuando haga click que me llame a VERIFICAR
                                                    verificar va sin () para que NO lo ejecute
                                                    de entrada, sino al momento de hacer click*/
</script>
**
10 respuestas

Hola,

Es porque el número secreto es un arreglo (array). Los Array tiene un índice. Por ejemplo:

  • El número 3 está en el índice 0 del array: secretos[0]
  • El número 5 está en el índice 1 del array: secretos[1]
  • El número 7 está en el índice 2 del array: secretos[2]

Para ello, deberías utilizar un ciclo for o un map. En el siguiente ejemplo, se utiliza un for:

    <input type="text">
    <button>Verificar</button>

    <script>
        var secretos = [3,5,7];
        var input = document.querySelector("input"); /*querySelector = "trae" todo el objeto 
                                                                                         del HTML, en este caso el input, para
                                                                                         manipularlo con JavaScript*/
        input.focus();

        function Verificar(){
            for (let index = 0; index < secretos.length; index++) {
                if (parseInt(input.value) == secretos[index]){ //acá comparo uno con otro
                    alert("Usted acertó");

                    limpiar();
                    return;
                }
            }

            alert("Usted erró");
            limpiar()
        }
        var button = document.querySelector("button");
        button.onclick = Verificar; /*cuando haga click que me llame a VERIFICAR
                                                        verificar va sin () para que NO lo ejecute
                                                        de entrada, sino al momento de hacer click*/

        const limpiar = () => {
            input.value = "";
            input.focus();
        }
    </script>

Saludos.

for (let index = 0; index < secretos.length; index++) { if (parseInt(input.value) == secretos[index])

No estaría entendiendo esto...

Yo lo hice tal cual lo explicaba Christian en el video por eso, y no me resultó

Hola,

en el ejemplo se crea una variable de tipo array:

var secretos = [3,5,7];

luego, si quieres conocer que valores tiene el array (arreglo), tienes que utilizar un índice. Pero primero, veamos que tiene la variable secretos sin el índice:

alert(secretos)

Ingrese aquí la descripción de esta imagen para ayudar con la accesibilidad

Si observas, te está mostrando los 3 valores todos juntos. Entonces si pones un if para comparar, el if toma todo el valor junto (3,5,7) y no uno por uno. Si pones esto:

if (parseInt(input.value) == secretos)

has de cuenta que estás escribiendo esto:

if (parseInt(input.value) == 3,5,7)

¿como sabe el if que valor tiene que comparar? ¿tiene que comparar el 3 el 5 o el 7?

Utilizando índice

Ahora, si el secretos es utilizado con un índice

alert(secretos[0])

el resultado es un 3: Ingrese aquí la descripción de esta imagen para ayudar con la accesibilidad Ingrese aquí la descripción de esta imagen para ayudar con la accesibilidad

Eso es el índice...

es por ello, que al utilizar el for, creo un índice automático con la variable index (puedes poner cualquier nombre de variable, pero en el ejemplo, yo la llame index)

            for (let index = 0; index < secretos.length; index++) {
                if (parseInt(input.value) == secretos[index]){ 
                    alert("Usted acertó");

                    limpiar();
                    return;
                }
            }

index va tomando primero el valor de 0, luego de 1 y por último el valor de 2.

De este modo, comparas cuando secretos[0] es igual a 3, secretos[1] es igual a 5 y secretos[2] es igual a 7.

Saludos.

gracias por la aclaracion ya puedo entender un poco mas dicha aclaracion

yo lo hice como hiciste vos pero el bucle me repite la opcion erronea 3 veces... solamente me funcionó con el numero 3, despues con los demás numeros me tiró "Usted erró" 3 veces seguidas, es decir 3 alert.

intenté hacerlo de otra forma pero se me colgó el bucle y me tiraba eternamente aerta de que erró...

Ahora por ejemplo, lo modifiqué de la siguiente forma, pero los valores del 4 en adelante no me deja enviarlos... solo los menores y el 5 y 7 que son correctos:

**

<script>
    var secretos = [3,5,7];
    var input = document.querySelector("input"); /*querySelector = "trae" todo el objeto 
                                                 del HTML, en este caso el input, para
                                                 manipularlo con JavaScript*/
    input.focus();
    var encontrado = false;

    function Verificar(){
        for (var posicion = 0; posicion < secretos.length; posicion++){
            if (parseInt(input.value) == secretos[posicion]){ //acá comparo uno con otro
                alert("Usted acertó");
                limpiar();
                encontrado = true;
                break;
            }
        }
        if (encontrado == false){
        alert("Usted erró");
                limpiar();
            }
        }

    var button = document.querySelector("button");
    button.onclick = Verificar; /*cuando haga click que me llame a VERIFICAR
                                verificar va sin () para que NO lo ejecute
                                de entrada, sino al momento de hacer click*/

   const limpiar = () => {
        input.value = "";
        input.focus();
    }

</script>

**

solución!

Hola,

Hice un par de cambios:

A la función limpiar, agregué una "reset" más:

        const limpiar = () => {
                encontrado = false; // regresa el valor a false
                input.value = "";   // input queda limpio (vacío) ""
                input.focus();      // mueve el cursor a input.
        }

Luego, a la función limpiar, la llamo al finalizar las comprobaciones para que limpie o resetee todo como está al inicio o la carga de la página. Te paso todo el código para que veas como queda:

<!DOCTYPE html>
<html lang="es">
<head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Número Secreto</title>
</head>
<body>

    <input type="text">
    <button>enviar</button>

    <script>
        var secretos = [3,5,7]; // números a encontrar
        var encontrado = false; // variable booleana

        /*
            querySelector = "trae" todo el objeto 
            del HTML, en este caso el input, para
            manipularlo con JavaScript
        */
        var input = document.querySelector("input"); // guardamos el input en la variable input (var input)
        input.focus();  // le decimos a input que tenga el focus (el cursor dentro de él)

        /*
            querySelector = "trae" todo el objeto 
            del HTML, en este caso el button, para
            manipularlo con JavaScript
        */
        var button = document.querySelector("button"); //guardamos el button en la variable button (var button)

        /*
            Inicio de la función Verificar
        */
        function Verificar(){

            /*
                Inicio del ciclo for
            */
            for (var posicion = 0; posicion < secretos.length; posicion++){
                if (parseInt(input.value) == secretos[posicion]){ //acá comparo uno con otro
                    alert("Usted acertó");
                    encontrado = true;
                    break;
                }
            }   // FIN del ciclo for

            if (encontrado == false){
                alert("Usted erró");
            }

            limpiar(); // llamar a la función limpiar

            } // FIN de la función Verificar


        /*
            cuando haga click que me llame a VERIFICAR
            verificar va sin () para que NO lo ejecute
            de entrada, sino al momento de hacer click
        */
        button.onclick = Verificar; 


        /*
                Función Limpiar
                Esta es otra forma de crear funciones.
                Estas funciones se conocen como funciones de flecha.
        */
        const limpiar = () => {
                encontrado = false; // regresa el valor a false
                input.value = "";   // input queda limpio (vacío) ""
                input.focus();      // mueve el cursor a input.
        }
    </script>


</body>
</html>

Saludos.

//TE DEJO EL CODIGO COMO LO HEMOS VENIDO TRABAJANDO CON EL INSTRUCTOR. //Tambien te recomiendo que sigas las estandarizaciones para programar, inicias con mayuscula el nombre de tu funcion, eso no es correcto. Recuerda que debes llamarlo verificar, te dejo unos ejemplos extras: verificarSecreto, nombreFuncion, verificarSecretoNumeros

<meta charset="utf-8">

<input />
<button>Verificar si acerto con el secreto</button>

<script>

    var secretos = [3,5,7];

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

    function verificar(){

        var encontrado = false;

        //Los arreglos inician en la posicion 0, generalmente lo tenemos en el 1, pero en este caso es 0. 
        //las 3 partes del for es donde se inicia, en este caso el 0, la segunda parte es el condicional y el tercero es el contador que incrementa por cada loop. Te sugiero repasar estas clases ya que si son mas complejas pero es muy importante.
        for(var posicion = 0; posicion < secretos.length; posicion++){ 

            //En este condicional verificamos que si lo ingresado es igual a lo que tenemos en el array, si es asi pues mandamos el alert de que acerto, 
            if(parseInt(input.value) == secretos[posicion]) {

            alert("Usted acerto");
            encontrado = true;
            break;

            } 

        }

        // y mientras no se haya encontrado es false
        if(encontrado == false){

            alert("Usted erro");

        }    


        //aca reseteamos los valores de nuestro input
        input.value = "";
        input.focus();    
    }

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

</script>

Ahora siiii..... Tenia la

** var encontrado = false;

* fuera del *function, por ende no me ejecutaba correctamente la funcion... ahora si, muchisimas gracias por tu aporte, la verdad que a pesar de todo se me hizo mucho mas entendible el tema!!!!!