2

Lo que pasa es que encontré este código:

<html> 
    <head> 
        <title>Carnito</title> 
    </head> 
<body> 
    Ingrese numero:<input type="text" id="valor" > 
    <button id="MyBtn1" >Invertir numero</button> 
 
          <script> 
                document.getElementById("valor").onfocus=function(){ if(document.getElementById("valor").value == 0){ document.getElementById("resultado").innerHTML = "";}}; 
                document.getElementById("MyBtn1").onclick=function(){ invertir();}; 
                function invertir(){ 
                      var numero = document.getElementById("valor").value;  
                     
                    if(numero == 0){ 
                        document.getElementById("resultado").innerHTML = "EL PROGRAMA TERMINO"; 
                    }     
                     
                    while( parseInt(numero / 10) != 0 ){ 
 
                            document.getElementById("resultado").innerHTML += (numero % 10); 
                            numero = parseInt(numero / 10); 
                            if(parseInt(numero/10) == 0){ 
                                document.getElementById("resultado").innerHTML += (numero % 10); 
                                document.getElementById("resultado").innerHTML += "     "; 
                            } 
     
                    }     
                     
                }   
        </script> 
<p id="resultado"></p> 
</body> 
</html> 

Lo que hace es dar vuelta el número que ingreses, osea si ingresas 123456, resultará 654321, pero no entiendo como funciona. Me gustaría una explicación y otro ejemplo parecido por favor

3 respuestas 3

3

No invierte nada, simplemente extrae los últimos dígitos, en nuestro sistema esto se logra dividiendo por 10 y tomando el resto (véase el algoritmo de euclides)

103 % 10 = 10 r 3 
 10 % 10 =  1 r 0
  1 % 10 =  0 r 1

como puedes ver, la secuencia de restos produce 301, que es exactamente el número original pero con las cifras invertidas.

El algoritmo puro y crudo es el siguiente:

function invertirDigitos(numero)
{ 
  var invertido = 0
  var resto = numero
  do {
    invertido = invertido * 10 + (resto % 10)
    resto = Math.floor(resto / 10)
  } while ( resto > 0 )
  return invertido
}

console.log(invertirDigitos(123456))
console.log(invertirDigitos(321))

La explicación es sencilla, se declara un acumulador llamado invertido el cual almacena la secuencia de restos. Para hacer que los restos se desplacen a la izquierda se multiplica por 10, finalmente se le suma el resto, ambas acciones aseguran la invariantez del bucle, para cualquier iteración y por ende garantizan que el algoritmo es correcto. (véase inducción matemática)

Respecto a la eficiencia del algoritmo, el algoritmo tiene una complejidad asintótica Omega(n) donde n es el número de dígitos del número o bien Omega(ceil[log10(i)]) donde i es el número a invertir.

Para más información debes investigar los siguientes temas

  • Sistemas de numeración (decimal, binario, etc)
  • Algoritmo de euclides (su uso en las ciencias de la computación)
  • Técnicas de compiladores ( Conversión de un flujo de caracteres a un tipo primitivo válido)

La teoría detrás del algoritmo es extensa y no lo podría explicar aquí con el rugor matemático que me gustaría, no obstante la idea intuitiva te la llevas.

1

En el ejemplo que propones lo que hace es ir diviendo por 10 hasta ir consiguiendo cada uno de los números. Personalmente me parece una solución un poco liosa.

Te propongo otra solución que, a mi parecer, es bastante más sencilla. Te la explico paso por paso:

  • Lo primero que hago es referenciar tanto el botón como el input en el que voy a introducir el valor.

  • Una vez hecho esto, le asocio una función al botón cada vez que le den clic. Para ello, hago uso de la función addEventListener, es decir, todos los clics que haga en el botón van a estar asociados a la función.

  • Por último, obtengo el valor del input y lo invierto. Para ello, utilizo la función split tomando como referencia un string vacío, por lo que me va a crear un array por cada carácter que tenga el valor. A continuación utilizo la función reverse para darle la vuelta al array e invertir el orden de sus valores y por último vuelvo a reconstruir el string mediante la función join (lo vuelvo a juntar todo de nuevo).

Ejemplo:

var boton = document.getElementById("boton");
var valor = document.getElementById("valor");

boton.addEventListener("click", invertir);

function invertir(){
  var numero = valor.value;
  valor.value = numero.split("").reverse().join("");
}
<input id="valor" type="number">
<button id="boton">Invertir</button>

2
  • La solución no es óptima, y no responde la pregunta en sí. Tu solución requiere crear un arreglo, revertirlo y luego alocar una nueva cadena en memoria, cuando fácilmente se puede evitar. Commented el 1 sept. 2017 a las 22:47
  • @EduenSarceño Realmente he preferido dar otra opción que para mí es más fácil y se emplea mucho menos código. La parte matemática prefería que la explicase otro que entendiera de verdad que algoritmo se estaba usando. Commented el 1 sept. 2017 a las 22:49
-1

Primero el HTML

  • Tienes un input text donde pones el número a invertir con un id = valor
  • Tienes un boton con un id = MyBtn1
  • Tienes un elemento P donde se desplegará el resultado con un id = resultado

Ahora el script

Al input text valor le agregan un evento que al seleccionarlo y si no tiene ningun valor borra el contenido de la respuesta

 //Se obtiene el input y se le asigna el evento onfocus 
 document.getElementById("valor").onfocus=function(){
     //Si el input está vacio o tiene un 0
     if(document.getElementById("valor").value == 0){     
         //Bora el resultado
         document.getElementById("resultado").innerHTML = "";
     }  
}; 

Al boton se le asigna un evento onclick y éste llama a la función invertir();

//Se selecciiona el boton y se le asigna el evento onclick
document.getElementById("MyBtn1").onclick=function(){ 
     //Se llama a la funcion invertr
     invertir();
}; 

La función inverir invierte lo que tenga el input valor pero si el input tenía un cero cuando se le dio click al boton muestra en el resultado EL PROGRAMA TERMINO Vamos a suponer que el input valor es igual a 456 para el ejemplo

//funcion invertir 
function invertir(){ 
    //Se obtiene el valor del input y lo guardamos en la variable numero, en nuestro ejemplo: 456
    var numero = document.getElementById("valor").value;  

    //Si numero es igual a cero despliega un mensaje diciendo que termino
    if(numero == 0){ 
        document.getElementById("resultado").innerHTML = "EL PROGRAMA TERMINO"; 
    } 

    //Un ciclo que se repetira mientras la parte entera de la divicion de numero / 10 sea distinta de cero
    while( parseInt(numero / 10) != 0 ){ 
          //Al resultado se le agrega (por el +=) el modulo de numero entre 10
          //El modulo es el resto de la divicion, no confundir con el punto decimal. Por ejemplo para el primer ciclo 456 % 10 = 6. Porque 456 / 10 da 45 y sobran 6 (haz la division a mano)
          document.getElementById("resultado").innerHTML += (numero % 10); 
          //Obtenemos la parte entrea de la divicion (gracias al parseInt) y la guardamos en numero
          numero = parseInt(numero / 10); 
          //Si la parte entera de la divicion es 0 (cuando terminamos), por ejemplo si solo queda el 4 -> 4/10 = 0.4, la parte entera es cero
          if(parseInt(numero/10) == 0){ 
              //El modulo de un digito es el mismo digito, se agrega al resultado
              document.getElementById("resultado").innerHTML += (numero % 10); 
              //Se agregan varios espacios en blanco
              document.getElementById("resultado").innerHTML += "     "; 
          } 

      }     

  }   

Cuando no entiendas como funciona algo en javascript ayudate de la consola para ver que esta haciendo:

<html> 
    <head> 
        <title>Carnito</title> 
    </head> 
<body> 
    Ingrese numero:<input type="text" id="valor" > 
    <button id="MyBtn1" >Invertir numero</button> 
 
          <script> 
                document.getElementById("valor").onfocus=function(){ if(document.getElementById("valor").value == 0){ document.getElementById("resultado").innerHTML = "";}}; 
                document.getElementById("MyBtn1").onclick=function(){ invertir();}; 
                function invertir(){ 
                      var numero = document.getElementById("valor").value;  
                     
                    if(numero == 0){ 
                        document.getElementById("resultado").innerHTML = "EL PROGRAMA TERMINO"; 
                    }     
                    
                    console.log("Enra al while ? " + ( parseInt(numero / 10) != 0 ) );
                    while( parseInt(numero / 10) != 0 ){ 
                            console.log(numero + " % 10 = " + (numero % 10) ); 
                            document.getElementById("resultado").innerHTML += (numero % 10); 
                            
                            numero = parseInt(numero / 10); 
                            console.log("Resultado de numero / 10 = ", numero);
                            
                            console.log("Entra al if (parseInt(numero/10) == 0): " + (parseInt(numero/10) == 0));
                            if(parseInt(numero/10) == 0){ 
                                console.log("Ultimo modulo: " + (numero % 10));
                                document.getElementById("resultado").innerHTML += (numero % 10); 
                                document.getElementById("resultado").innerHTML += "     "; 
                            } 
                            console.log("Resultado al final de ciclo: " + document.getElementById("resultado").innerHTML);
                            console.log("\n");
                    }     
                     
                }   
        </script> 
<p id="resultado"></p> 
</body> 
</html> 

Tu Respuesta

By clicking “Publica tu respuesta”, you agree to our terms of service and acknowledge you have read our privacy policy.

¿No es la respuesta que buscas? Examina otras preguntas con la etiqueta o formula tu propia pregunta.