Vamos a programar #36 - DecToAny, versión Javascript.

Hola de nuevo a todos, el día de hoy vamos a ver el mismo programa que vimos en el post anterior.
Te preguntarás, lo mismo, otra vez? En esencia es lo mismo, lo único que cambia es el lenguaje en el cual se ejecuta.

Inicialmente iba a hacer la aplicacion para andoid, pero gente me pidio una version en javascript, entonces por eso decidi hace primero esta versióm (y adivinaste, la semana que viene publicaré la version android).

El código.

El código en javascript que convierte de decimal a otras bases es el siguiente:
<html>
	<head>
	<title>Convertidor de decimal a otras bases</title>
	<style type="text/css">
	.h1Cal
	{
	   font-size: 14px;
	}
	.formDecToAny{
		font: 95% Arial, Helvetica, sans-serif;
		max-width: 400px;
		margin: 10px auto;
		padding: 16px;
		background: #F9F9F9;
	}
	.TextCal
	{
		width: 100%;
		box-sizing: border-box;
		border: 2px solid #999;
		border-radius: 4px;
	}

	.ButtonCal
	{
	width: 100%;
		background-color: #26c6da;
		border: none;
		color: white;
		padding: 15px 32px;
		text-align: center;
		text-decoration: none;
		display: inline-block;
		-webkit-transition-duration: 0.4s; /* Safari */
		transition-duration: 0.4s;
	}

	.ButtonCal:hover
	{
	width: 100%;
		background-color: #35d5e5;
		border: none;
		color: white;
		padding: 15px 32px;
		text-align: center;
		text-decoration: none;
		display: inline-block;
	}
	</style>
	<script type="text/javascript">

	function DecToAny(Number, Base){
		var LastNumber = parseInt(Number, 10);
		var Garbage;
		var result = []
		debugger;
		if (LastNumber < Base)
		{
			result.push(LastNumber);
		}
		else
		{
			while (LastNumber >= Base) {
				Garbage = LastNumber % Base;
				LastNumber = Math.floor(LastNumber / Base);
				if (LastNumber < Base)
				{
					result.push(Garbage.toString());
					result.push(LastNumber.toString());
				}
				else
				{
					result.push(Garbage.toString());
				}
			}
		}
		return result;
	}

	function NumberToChar(Number){
		if(Number < 10)
			return Number;
		else
			return String.fromCharCode(parseInt(Number, 10) + 55);
	}

	function ArrayToString(){
		var GetNumber = document.getElementById('InputNumber').value;
		var GetBase = document.getElementById('InputBase').value;
		if(GetNumber.length < 1 || GetBase.length < 1)
		{
			alert('El numero/base no puede estar en blanco');
			return;
		}
		var Convert = DecToAny(GetNumber,GetBase);
		var Out = "";
		Convert.reverse()
		for(var i = 0; i < Convert.length; i++)
		{
			Out = Out + NumberToChar(Convert[i])
		}
		document.getElementById('Result').value = Out;
	}
	</script>
	</head>
	<body>
		<form class="formDecToAny">
			<span class="h1Cal">Numero decimal a convertir:</span>
			<input class="TextCal" id="InputNumber" type="text"></input><br />
			<span class="h1Cal">Base a la cual convertir:</span>
			<input class="TextCal" id="InputBase" type="text"></input><br />
			<br />
			<input class="ButtonCal" id="ToAny" onclick="ArrayToString()" type="button" value="Convertir" /><br />
			<br />
			<span class="h1Cal">Resultado:</span>
			<input class="TextCal" id="Result" type="text"></input><br />
			<br />
		</form>
	</body>
</html>

El código esta formado por 3 funciones. La priera es "DecToAny", esta será la encargada de hacer los cálculos, hay que recordar que todo el proceso se lleva a cabo por una sucesión de divisiones. Esta función recibe dos parámetros, el primero es el número que queremos convertir, el segundo es la base objetivo. Devuelve una matriz que contiene los valores en orden inverso.

La segunda función es "NumberToChar", esta recibe un número cómo parámetro y lo único que hace es comprobar si el número es menor a 10, si es así, entonces solo devuelve el número que se ingreso, en caso contrario, convertirá el número ingresado cómo parámetro y lo devolverá con el valor correcto, hay que recordar que cuando usamos el décimo dígito en una base 12; por ejemplo; no podemos poner 0,2,3,4,5,6,7,8,9,10,11,12 (que serian los doce dígitos necesarios para representar todos los números simples hasta la base), en su lugar, debemos de recurrir a letras: 0,1,2,3,4,5,6,7,8,9,0,A,B. Con está función tenemos disponible hasta el dígito Z (base 35).
Finalmente tenemos la función "ArrayToString" que se encarga de convertir todos los datos de la matriz devuelta por la función "DecToAny" a un formato legible para las personas, internamente también llama a la función "NumberToChar" para que el resultado contenga letras cuando se hace uso del décimo o más. Cuando se quiera convertir un número, esta es la función que se debe mandar a llamar.

Para el formulario, solamente se hace uso de tres Textbox(text), uno servirá para introducir el número a convertir, otro recibirá la base de destino y el tercero mostrará el resultado. Ademas se hace el uso de un boton(button) que al hacer clic sobre el, mandará a llamar a la función "ArrayToString".

Cómo podrás ver, el código es realmente similar al de la versión C# que hicimos en el post anterior, con esto quiero demostrar que resulta relativamente fácil portar un programa de un lenguaje a otro, ahora solo queda pendiente la versión para android, pero eso será la semana que viene. Cómo siempre, el código completo lo puedes descargar de mi dropbox, pero además la versión online también esta disponible para su ejecución en este blog.

Por ahora es todo. Los leo luego.

No hay comentarios.