While – Utilizzi del ciclo iterativo

Ciclo infinito alert javascript - Reyboz blog

Il ciclo while si utilizza per ripetere un operazione solo finchè una funzione logica è vera. Cioè:

  • Controlla una formula logica
    • Se risulta vera esegue un comando fintanto che la funzione logica è vera
    • Se risulta falsa esce dal ciclo

Con un esempio:

  • Controlla se x è minore di 10
    • Se risulta vera esegue x=x+1 fintanto che x è minore di 10
    • Se risulta falsa esce dal ciclo

Ora che abbiamo meglio in testa cosa fa il ciclo while, proviamo a tradurre questo esempio in linguaggio javascript. Creiamo quindi una variabile x=0 e proviamo a seguire i passaggi logici sotto celati.

x=0;
while (x<10)
{
x=x+1;
}
document.write(x);

Se il valore di x in questo caso è zero (o), al termine di questo ciclo quanto varrà?

Se abbiamo capito bene il while possiamo calcolarlo semplicemente vedendo i suoi passaggi:

All'inizio x=0
Inizio ciclo
x= 0 ( 0 minore o uguale a 10? Vero. x= 0+1)
x= 1 ( 1 minore o uguale a 10? Vero. x= 1+1)
...
x=10 (10 minore o uguale a 10? Vero. x=10+1)
x=11 (11 minore o uguale a 10? Falso. Interrompi while)
Fine ciclo
→ x=11

Esattamente il risultato che ci fornirà la pagina: 11.

Utilizzi del ciclo while

Ora che abbiamo capito come funziona, proviamo ad utilizzarlo per creare un’applicazione che crea una serie di finestre window.alert in successione, a seconda di quante finestre decidiamo di visualizzare in precedenza.

Questo è il codice javascript:

contoallarovescia=10;
while(contoallarovescia==0)
{
window.alert("Mancano ancora "+contoallarovescia+" finestre!);
contoallarovescia=contoallarovescia-1;
}

Se volete potete provare il ciclo con questo link di prova. Buona navigazione.

Javascript di base

Javascript - Reyboz Blog

Ecco un semplice riassunto di concetti basilari per un primo approccio al linguaggio Javascript, il linguaggio lato utente, che si utilizza per svolgere script all’interno di una pagina web.

Inserimento

Per aggiungere uno script interno ad una pagina web basta inserire i comandi javascript tra <script> e </script> all’interno della pagina. Ecco un esempio:

<html>
<head>
<title>Home</title>
<script type='text/javascript'>
document.write('Questo è un comando Javascript');
document.title='Questo è un' altro comando Javascript';
</script>

</head>
<body>
</body>
</html>

Oppure se si vuole caricare uno script esterno alla pagina basta inserire il suo indirizzo utilizzando il metodo src=” + indirizzo del file.js”.

Il file esterno deve essere in formato .js e all’interno di esso non bisogna inserire di nuovo <script> e </script>. Ecco in questo caso come caricare lo script nella pagina:

<html>
<head>
<title>Home</title>
<script type="text/javascript" src="http://reybozblog.it/file.js"></script>
</head>
<body>
</body>
</html>

E nel corrispondente http://reybozblog.it/file.js:

document.write('Questo è un comando Javascript');
document.title='Questo è un'altro comando Javascript';

Calcoli

Dichiarare variabile x=1;
Incrementare di uno x++;
Decrementare di uno x--;
Addizionare x=3+1;
Sottrarre x=4-2;
Moltiplicare x=6*4;
Dividere x=3/4;
Resto di una divisione x=4%2;

Condizione – if

Il’if else è un comando che calcola una condizion biunivoca: ad esempio se una variabile è vera, esegue un comando, ma se è falsa ne esegue un’altro: (esempio)

x=confirm('Aprire il Reyboz search?');
if(x == true) {
window.location='/search';
}
else
{
alert('Rimani su questa pagina.');
}

L’if valuta una condizione: se la condizione è vera fa una cosa, se è falsa ne fa un’altra.

Ripetizione – while

Il ciclo while ripete un operazione finchè una condizione è vera. (esempio)

x = false;
while (x==false) {
x=confirm('Uscire?');
}
alert('Sei uscito');

Condizioni – switch

Conosciuto anche come case of permette di eseguire dei comandi dopo una multipla scelta di condizioni. (esempio)

x=prompt('Inserisci un numero da 1 a 3','');
switch (x) {
case '1': alert('Hai inserito 1'); break;
case '2': alert('Hai inserito 2'); break;
case '3': alert('Hai inserito 3'); break;
default: alert('Non hai messo nè 1 nè 2 nè 3');
}

Ripetizione – for

Per ripetere x volte uno script contenuto in parentesi graffe. (esempio)

document.write(' - Tabellina del due: <br>');
y = 0;
for (x = 1; x<=10; x++){
y=y+2;
document.write(y + '<br>');
}

Break & continue

Il ‘break’ interrompe un ciclo, mentre il ‘continue’ salta una e una sola iterazione di un ciclo for per passare alla successiva. Qui ad esempio abbiamo utilizzato il continue per accorciare l’esempio precedente. (esempio)

document.write(' - Tabellina del due: <br>');
for (x=1; x<=20; x++) {
if(x % 2 != 0){continue}
document.write(x + '<br>'); }