Convertitore decimale binario

In questa lezione impareremo a realizzare un convertitore decimale binario online in JavaScript. Anzi faremo in modo di convertire il numero decimale in binario, in ottale ed esadecimale.

Fate la prova ad inserire un numero decimale nella casella di input. Nelle altre caselle comparirà, in automatico, il numero corrispondente negli altri sistemi di numerazione.

Binario:

Ottale:

Esadecimale:


Convertitore decimale binario online in JavaScript

Procediamo con l’implementazione delle varie funzioni necessarie ad effettuare la conversione.

Innanzitutto sviluppiamo la funzione dec_bin che si occupa di convertire da decimale a binario, considerando i resti della divisione per 2. La funzione ritorna il numero binario così convertito.

Dopo sviluppiamo la funzione dec_ott che si occupa di convertire da decimale a ottale, considerando i resti della divisione per 8. La funzione ritorna il numero ottale così convertito.

Poi implementiamo la funzione dec_esa che si occupa di convertire da decimale a esadecimale, considerando i resti della divisione per 16. Se il resto è maggiore di 9 si prende la lettera corrispondente dall’array. La funzione ritorna quindi il numero esadecimale così convertito. 

Infine inseriamo la funzione change che fa attivare il cambiamento automatico quando inseriamo il valore nel campo decimale.

 

Ecco dunque il codice JavaScript completo per il convertitore decimale binario:

<script> 
function dec_bin(num){
	n = document.getElementById("decimale").value; 
	binario = "";

	while(n!=0) {
		resto = n%2; 
		n = (n-resto)/2; 
		binario = resto + binario;
	}
	
	return binario;
}


function dec_ott(num){
	n = document.getElementById("decimale").value; 
	ottale = "";

	while(n!=0) {
		resto = n%8; 
		n = (n-resto)/8;
		ottale = resto + ottale;
	}
	
	return ottale;
}

function dec_esa(num){
	n = document.getElementById("decimale").value; 
	esa = ""; 
	while(n!=0) { 
		resto = n%16; 
		n = (n-resto)/16; 
		ar = new Array('0','1','2','3','4','5','6','7','8','9','A','B','C','D','E','F');
		if (resto > 9) 
			resto = ar[resto]; 
		esa = resto + esa;
	}
	
	return esa;
}


function change(name)
{
		n = document.getElementById("decimale").value;
                result = dec_bin(n);
		result2 = dec_ott(n);
		result3 = dec_esa(n);
		risultato.value=result;
		risultato2.value=result2;
		risultato3.value=result3;
}
</script>

Nel campo, dove inserisco in input il numero decimale, aggiungo l’evento onkeyup. Questo fa sì che gli altri campi si aggiornino in automatico richiamando la funzione change sviluppata in JavaScript.

<p><label>Numero da decimale a binario, ottale ed esadecimale</label>
<input type="text" id="decimale" onkeyup="change(this)"></p>
<p>Numero in binario: <input type="text" id="risultato" readonly></p>
<p>Numero in ottale: <input type="text" id="risultato2" readonly></p>
<p>Numero in esadecimale: <input type="text" id="risultato3" readonly></p>

Chiaramente questo è solo un semplice modo per implementare un convertitore decimale binario, che consente anche di convertire in ottale ed esadecimale. Proponete pure la vostra soluzione nei commenti sotto.

Alcuni link utili

Indice argomenti tutorial JavaScript

Template responsive con html

Come creare un css responsive

Come trovare immagini per il sito web

Quali colori scegliere per un sito web

Quali font scegliere per un sito web

PDF da un form con JavaScript

Autore dell'articolo: Cristina

Avatar per Coding Creativo

Lascia un commento

Il tuo indirizzo email non sarà pubblicato. I campi obbligatori sono contrassegnati *