F | acciamo il punto. Argomenti correlati:
|
- Parentesi graffe
- Racchiudono un blocco di istruzioni e sono usate in molti casi, ad esempio nelle funzioni. In particolare:
- {
- indica l'inizio (corrisponde al begin del Pascal
- }
- indica la fine (corrisponde all' end del Pascal
- Parentesi tonde
- Racchiudono un'espressione. Nella selezione binaria, si usano per la condizione, che deve essere un'espressione booleana, cioè che assume solo i valori true (vero) o false (falso)
- window.prompt; window.alert
- si tratta di metodi delle finestre predefinite di Javascript
- Tavola di traccia
- Si tratta di un metodo molto utile per controllare il funzionamento di
un programma. Si prepara una tabella: nella colonna di sinistra vengono
scritte le azioni, quindi si riportano le variabili e le eventuali condizioni; alle variabili si dà un
valore iniziale a piacere, quando non altrimenti dichiarato: seguendo le azioni passo per passo, si prevede l'output del programma. Quando è presente una condizione, conviene fare un esempio in cui la stessa sia vera ed un altro in cui sia falsa.
|
|
|
|
Ecco il diagramma sintattico della selezione nel suo aspetto più semplice: se una certa condizione è vera, vengono eseguite una o più istruzioni. In italiano diremmo: se... allora. Bene, in Javascript il se è tradotto in if, mentre allora non viene scritto (a differenza di altri linguaggi, dove si usa then): l'inportante è l'aggiunta delle parentesi graffe che racchiudono le istruzioni da eseguire. Se dobbiamo inserire una sola istruzione l'uso delle parentesi graffe non è necessario. Qualora la condizione risulti falsa, essa viene ignorata.
La condizione invece va chiusa fra parentesi tonde.
| |
PRIMO ESEMPIO
|
Vogliamo verificare se il nome inserito da una persona in una casella di testo è "Mario".
Introduciamo a questo scopo una funzione JavaScript con il seguente codice, da inserire fra i tags <HEAD> ed </HEAD> :
<script language=JavaScript>
function controlla() {
dato=window.prompt('Inserisci il tuo nome');
if (dato == 'Mario') {
window.alert('Ti chiami Mario');
}
}
</script>
Creiamo un bottone con il seguente codice, da inserire fra i tags <BODY> e </BODY> :
<form name="Mioform1">
<input type=button value="Clicca" name="bottone" OnClick="javascript:controlla()">
</form>
Otteniamo il seguente risultato:
Se proviamo a cliccare sul bottone, notiamo che:
- Se inseriamo la parola Mario otteniamo l'avviso Ti chiami Mario;
- Se inseriamo un altro nome, un numero, o magari mario o Mario seguito da uno spazio, non succede
nulla.
| TAVOLA DI TRACCIA NUMERO 1 |
TAVOLA DI TRACCIA NUMERO 2 |
| azione |
variabili |
condizione |
risultato |
|
dato |
dato=Mario |
|
|
1° |
Mario |
|
|
|
2° |
|
vera |
|
|
3° |
|
|
Ti chiami Mario |
|
Ci aspettiamo in questo caso di ricevere
l'avviso
Ti chiami
Mario
| |
| azione |
variabili |
condizione |
risultato |
|
dato |
dato=Mario |
|
|
1° |
Gioia |
|
|
|
2° |
|
falsa |
|
|
3° |
|
|
|
|
Ci aspettiamo in questo caso
di non ricevere alcun
effetto
| |
Si verifica cioè quello che avevamo detto all'inizio: se la
condizione è vera, viene eseguita la sequenza di istruzioni
racchiusa tra le parentesi graffe, altrimenti non succede
assolutamente nulla. Forse non è quello che volevamo, infatti di
solito, se un'ipotesi non viene verificata, ci piace almeno avere
una risposta negativa.
| ECCO IL COSTRUTTO SE...ALLORA,
ALTRIMENTI...
|
Introduciamo dunque il diagramma sintattico della selezione nel suo aspetto più usato: se una certa condizione è vera, vengono eseguite una o più istruzioni, altrimenti (else) vengono eseguite le istruzioni racchiuse fra le successive parentesi graffe. In questo secondo caso la prima o la seconda sequenza di istruzioni vengono sempre eseguite.
| |
SECONDO ESEMPIO
|
Miglioriamo il programma precedente.
Introduciamo a questo scopo una seconda funzione JavaScript con il seguente codice, da inserire fra i tags <script> e </script> , dopo la parentesi graffa di chiusura della funzione controlla() :
...
function controlla1() {
dato=window.prompt('Inserisci il tuo nome');
if (dato == 'Mario') {
window.alert('Ti chiami Mario');
}
else {
window.alert('Non ti chiami Mario');
}
}
...
Creiamo un secondo bottone con il seguente codice, da inserire fra i tags <BODY> e </BODY> : :
<form name="Mioform2">
<input type=button value="Clicca" name="bottone1" OnClick="javascript:controlla1()">
</form>
Otteniamo il seguente risultato:
Se proviamo a cliccare sul bottone, notiamo che:
- Se inseriamo la parola Mario otteniamo l'avviso Ti chiami Mario;
- Se inseriamo un altro nome, o un numero, o magari mario, otteniamo l'avviso Non ti chiami Mario.
Ecco
allora che tutte le volte otteniamo una risposta da parte
dell'interprete javaScript.
| TAVOLA DI TRACCIA NUMERO 1 |
TAVOLA DI TRACCIA NUMERO 2 |
| azione |
variabili |
condizione |
risultato |
|
dato |
dato=Mario |
|
|
1° |
Mario |
|
|
|
2° |
|
vera |
|
|
3° |
|
|
Ti chiami Mario |
|
Ci aspettiamo in
questo caso di ricevere l'avviso
Ti chiami
Mario
| |
| azione |
variabili |
condizione |
risultato |
|
dato |
dato=Mario |
|
|
1° |
Gioia |
|
|
|
2° |
|
falsa |
|
|
3° |
|
|
Non ti chiami Mario |
|
Ci aspettiamo in
questo caso di ricevere l'avviso
Non ti chiami
Mario | |
| |
|
|