E' basato sull'uso di due sole cifre cioè i bit 0 e 1. E' posizionale esattamente come il sistema decimale e quindi le cifre hanno un peso dipendente dalla posizione. Tale peso è determinato dalla potenza di base 2 ed esponente uguale alla posizione occupata dal bit, come nel seguente schema:
Posizione
...
6
5
4
3
2
1
0
Peso
...
26
25
24
23
22
21
20
Ad esempio il numero 1001010 in base due diventa 0×20 + 1×21 + 0×22 + 1×23 + 0×24 + 0×25 + 1×26 = 2 + 8 + 64 = 74 in base dieci.
Alla variabile di tipo alfanumerico di nome output viene assegnato, come valore iniziale, il testo 'CODICE ASCII' seguito dal tag <br> che serve per andare a capo e da <pre>
<pre>
Quanto viene scritto all'interno dei tags <pre> e </pre> si presenta come paragrafo preformattato, che cioè viene visualizzato così come è stato scritto; in particolare vengono conservati gli spazi e gli "a capo". Nel nostro caso è indispensabile se si vogliono rendere le sequenze escape /t e /n
\t
Sequenza escape, o di controllo, che permette di inserire una tabulazione (simula il tasto Tab)
\n
Sequenza escape, o di controllo, che permette di andare a capo (new line)
Iterazione enumerativa
Il valore iniziale per il contatore è 32
La condizione per terminare è che sia i=255
L'incremento per il contatore è 1 (i++ equivale all'istruzione di assegnazione i=i+1; in altri termini incrementa di 1 il valore della variabile i)
{
Parentesi che indica l'inizio del ciclo
output += i + '\t&#8594\t'+ i + '\n'
Concateniamo alla stringa output
i: è il numero attualmente memorizzato nel contatore;
'': si antepone al numero di codice per far visualizzare il carattere corrispondente;
i: è il numero attualmente memorizzato nel contatore;
'\n': sequenza escape che manda a capo
output+='</pre>'
Chiusura del tag
}
Parentesi di chiusura del ciclo
document.write(output)
Metodo dell'oggetto document. Il parametro posto in parentesi indica che deve essere visualizzato sullo schermo il contenuto della variabile output.
document.close()
Metodo dell'oggetto document. Si comunica al browser che è terminata la procedura di apertura della finestra e di scrittura del documento. Se non si include questa riga di codice non avrà luogo la stampa né altri eventuali comandi sulla pagina che abbiamo appena aperta.
Tutte le informazioni immagazzinate nella memoria di un computer sono espresse sotto forma di numeri del sistema binario: ogni dato è quindi trasformato in una sequenza di 0 e 1, detti bit (binary digit, cifra binaria). Di norma una cella di memoria comprende 8 cifre binarie (byte) con le quali è possibile rappresentare 28=256 caratteri distinti. Ad ogni diversa configurazione degli 8 bit corrisponde uno e un solo simbolo secondo lo schema del codice ASCII (American Standard Code for Information Interchange) esteso. Tra questi ci sono ad esempio il ritorno di carrello (carriage return), le lettere dell'alfabeto, le cifre ed altri simboli che vengono detti caratteri alfanumerici, oltre che codici che corrispondono a funzioni di macchina, come l'avvisatore acustico. Tale rappresentazione permette anche di avere un ordinamento anche fra caratteri e quindi di disporre, ad esempio, una lista di nomi in ordine alfabetico.
La rappresentazione binaria non è comunque immediatamente percepibile, e dunque normalmente del codice ASCII viene dato il corrispondente valore decimale. Ad esempio diciamo che il carattere A, che è memorizzato nel computer come 1000001 ha codice 65.
Esempio di codice:
«Frase fra virgolette»
Risultato:
«Frase fra virgolette»
Nella tabella compaiono alcune caselle vuote o con strani simboli: ricordiamo che:
Il codice   rappresenta la barra spaziatrice: anche se viene ripetuto nella pagina si visualizza soltanto uno spazio;
il codice  , che pure lascia uno spazio, corrisponde a e quindi lascia tanti spazi per quante volte viene scritto;
alcuni caratteri, ed esattamente quelli corrispondenti al codice 129, 141, 143, 144 e 157 vengono visualizzati in modo diverso da Firefox e da MSIE e dunque non conviene usarli;
il carattere di codice 127 corrisponde al tasto Canc.
Questo fatto ci consente di scrivere il nostro programma.
Con HTML è possibile visualizzare un carattere scrivendone il codice ASCII, trasformato in decimale, preceduto dai simboli &#: ad esempio, digitando &#65, otteniamo A.
ANALISI DEL PROBLEMA
Innanzitutto impariamo a visualizzare il carattere corrispondente ad un singolo numero decimale compreso fra 32 e 255: 32 è il primo dei caratteri visualizzabili e stampabili e corrisponde alla pressione della barra spaziatrice, mentre 255 è il massimo numero al quale corrisponde un carattere.
Si tratta di implementare un programma che:
scriva il carattere corrispondente a &#32, cioè uno spazio vuoto;
scriva il carattere corrispondente a &#33, cioè !
...
scriva il carattere corrispondente &#255, che è ÿ.
Fra un carattere e l'altro poi occorrerà andare a capo.
Al tal fine introduciamo una variabile nella quale memorizzare l'intera sequenza dei caratteri separati dal tag <br> che serve ad andare a capo (Break Line): all'inizio nella variabile memorizziamo il titolo
A tal fine bastano le seguenti righe di codice:
function codice1() {
var output='CODICE ASCII ESTESO<pre>\n'
for (i=32; i<=255; i++) {
output +=i + '\t&#8594\t'+ i + '\t'
}
output+='</pre>'
document.write(output)
document.close()
}
Abbiamo impostato un ciclo for in cui il contatore iserve anche per l'output del programma. Il ciclo permette la memorizzazione di tutti i caratteri, ognuno in una riga, nella variabile di nome output.
Una volta terminato il ciclo il contenuto della variabile viene visualizzato sullo schermo.
Il risultato, abbastanza deludente dal punto di vista estetico, si vede cliccando sul bottone
E' chiaro che la semplice sequenza di caratteri senza specificazione del numero di codice non è di grande aiuto.
NOTA BENE - Le singole righe del codice sono commentate nella sezione Facciamo il punto a sinistra nella pagina.
CODICE COMPLETO
Script (clic sull'area di testo per selezionare tutto).
Pulsante che attiva lo script, da inserire fra i tags <BODY> e </BODY>:
Ottieni la lista dei caratteri con il loro codice Ascii. Per vederla premi il bottone (se non lo hai fatto prima):
Una volta compreso come far scrivere i singoli caratteri preceduti dal loro codice dovremo migliorare l'aspetto dell'output inserendo opportunamente i dati in una tabella.