<table border=1 >
<tr>
<td colspan=4><input id=disp type=text name=display>
<tr>
<td class=operatori><input type=button value=+ onClick=calcola('+')>
<td class=operatori><input type=button value=- onClick=calcola('-')>
<td class=operatori><input type=button value=* onClick=calcola('*')>
<td class=operatori><input type=button value=/ onClick=calcola('/')>
<tr>
<td class=tasti><input type=button value=7 onClick=press(7)>
<td class=tasti><input type=button value=8 onClick=press(8)>
<td class=tasti><input type=button value=9 onClick=press(9)>
<td id=C><input type=button value="C" onClick="annulla()">
<tr>
<td class=tasti><input type=button value=4 onClick=press(4) >
<td class=tasti><input type=button value=5 onClick=press(5) >
<td class=tasti><input type=button value=6 onClick=press(6) >
<td id=enter rowspan=3> <button type="button" onClick=enter()>E<br>n<br>t<br>e<br>r </button>
<tr>
<td class=tasti><input type=button value=1 onClick=press(1) >
<td class=tasti><input type=button value=2 onClick=press(2) >
<td class=tasti><input type=button value=3 onClick=press(3) >
<tr>
<td class=tasti colspan=2><input type=button value=" 0 "onClick=press(0) >
<td class=tasti><input type=button value=. onclick=press(".")>
</table>
<script type=text/javascript>
var
saved=false; /* true se il dato nel display è stato salvato nello stack */
function press(car) {
if (saved) {
document.rpn.display.value = "";
saved = false;
}
document.rpn.display.value = document.rpn.display.value + car;
}
</script>
var
stack = new Array();
saved = false; /* true se il dato nel display è stato salvato nello stack */
function enter() {
n = stack.push(document.rpn.display.value);
saved=true;
}
function calcola(op) {
if (!saved) {stack.push(document.rpn.display.value)};
switch (op) {
case '+': document.rpn.display.value = parseFloat(stack.pop()) + parseFloat(stack.pop());
break;
case '-': document.rpn.display.value = -(parseFloat(stack.pop()) - parseFloat(stack.pop()));
break;
case '*': document.rpn.display.value = parseFloat(stack.pop()) * parseFloat(stack.pop());
break;
case '/': val2 = parseFloat(stack.pop());
val1 = parseFloat(stack.pop());
document.rpn.display.value = val1 / val2;
}
stack.push(document.rpn.display.value);
saved=true;
}
function annulla() {
document.rpn.display.value = "";
stack.clear();
saved=false;
}
Introdurre i gli operandi premendo i pulsanti numerici per comporre il numero desiderato e premere il pulsante ENTER alla fine di ciascun inserimento
Per effettuare un'operazione aritmetica premere il pulsante con l'operazione desiderata dopo l'ultimo inserimento (non è necessario premere Enter per l'ultimo operando)
Il risultato dell'operazione sarà effettuata sugli ultimi due valori introdotti e visualizzato sul display, eventuali valori precedentmente introdotti saranno disponibili per ulteriori operazioni che coinvolge l'ultimo risultato.
Il codice HTML che realizza l'interfaccia è costituito da una TABLE di 6 righe x 4 colonne nelle cui celle saranno ospitati i diversi componenti.
Alcuni di loro si dovranno espandere su più righe o colonne. (attributo cospan e rowspan di TD). Associato ad ogni pulsante l'evento onClick richiamerà un'opportuna funzione javascript da definire.
La funzione press(car) risponde al click effettuato su un pulsante numerico. Il valore cliccato viene passato come parametro.
Il suo compito fondamentale è accodare al contenuto del display il carattere ricevuto. Ma se il display è stato precedentemente salvato sullo stack significa che dobbiamo iniziare a comporre un nuovo numero e quindi il display va svuotato prima di procedere. A questo scopo predisponiamo la variabile saved per conservare lo stato del display (true se il contenuto è già stato salvato, false altrimenti)
Al pulsante ENTER risponde l'omonima funzione che non deve fare altro che salvare il contenuto del display sullo stack. Javascript mette a disposizione il metodo push contenuto nell'oggetto array per effettuare questa operazione. Dobbiamo anche settare al variabile saved a true per consentire di vuotare il display al prossimo inserimento (invocazione della funzione press)
La funzione calcola(op) rappresenta il cuore dell'applicazione. Deve eseguire l'operazione che gli viene indicata tramite il parametro op.
Una istruzione switch distingue i possibile valori del parametro effettuando l'operazione aritmetica opportuna. L'esecuzione avviene sugli ultimi due operando recuperati con un'operazione di pop sullo stack che li toglie dall'array.
Il risultato viene di nuovo impilato sullo stack. Notare il cambio di segno nel caso della sottrazione, reso necessario dal fatto che il primo valore recuperato sullo stack è l'ultimo introdotto dall'utente. Sottrendogli il primo valore si ottiene un risultato di segno invertito.
Prima di effettuare l'operazione descritta avremo cura di salvare l'ultimo valore contenuto nel display sullo stack, ma solo se non già fatto dall'utente con il pulsante ENTER. Alla fine del processo setteremo la variabile saved a true in modo che alla prossima invocazione di press il display venga svuotato. Infine salveremo il contenuto del display appena calcolato di nuovo sullo stack.
La funzione annulla risponde al click del pulsante C della calcolatrice. Deve semplicemente svuotare il display, azzerare lo stack e riportare la variabile saved al suo valore iniziale.