Lezione 7 (aa 2017-2018)

Sintesi della lezione

Prendere decisioni

• condizionale: faccio una determinata cosa se una condizione risulta vera altrimenti ne faccio un'altra
• iterativa (o loop): ripeto una determinata operazione finche una condizione risulta vera

L'istruzione if

• if ( espressione ) blocco di istruzioni
• if ( espressione ) blocco di istruzioni else blocco di istruzioni

Esempi

/*
  Blocco if
*/
if (condizione)
{
	//comandi se condizione è vera
}
// il programma continua qui

/*
  Blocco if...else
*/
if (condizione)
{
	//comandi se condizione è vera
}
else
{
	//comandi se condizione è falsa
}
// il programma continua qui

/*
  Serie di condizioni
*/
if (condizione1)
{
	//comandi se condizione1 è vera
}
else if (condizione2)
{
	//comandi se condizione2 è vera
}
else if (condizione3)
{
	//comandi se condizione3 è vera
}
else
{
	//comandi se tutte le condizioni sono false
}
// il programma continua qui

Operatori logici

 Combinare tra loro le condizioni

• esco se il tempo è bello ed è caldo
• esco se il tempo è bello o è caldo
• non esco se il tempo non è bello e non è caldo
• non esco se il tempo non è bello o non è caldo

esco se il tempo è bello ed è caldo

 esco se il tempo è bello o è caldo

 non esco se il tempo è non bello e non è caldo

  non esco se il tempo è non bello o non è caldo

Programmazione Iterativa

Flusso naturale del programma:

• viene eseguita un’istruzione dopo l’altra fino a che non si incontra l’istruzione di fine programma.

Programmazione iterativa:

• un'istruzione (o una serie di istruzioni) vengo eseguite continuamente, fino a quando non sopraggiungono delle condizioni che fanno terminare il ciclo.

while

Il ciclo while ripete un blocco di codice fino a quando una condizione specificata è vera.

Sintassi

while (condizione) {
    //blocco di codice da eseguire
}

Esempio 1

//Questo ciclo continua fino a che  i è minore di 10
	function myFunction() {
		var i = 0;	
		while (i < 10) {
			var text =	"<br>Il numero è " + i;
			document.getElementById("demo").innerHTML += text;
			i++;
		}
		document.getElementById("demo").innerHTML += "<br>Il ciclo è finito!";
    }
/* ================================================================
   !!! ATTENZIONE !!!
   Se si dimentica di aumentare la variabile usata nella condizione, 
   il ciclo diventerà infinito . Questo manderà in crash il browser.
   ================================================================= */

Esempio 2

/*
 Creo una node listi che contiene tutti gli elementi della pagina 
 HTML che hanno la classe out
*/
var elementi = document.getElementsByClassName("out");

// Il ciclo continua fino a che la nodeList elementi contiene item
while (elementi.length > 0){
	elementi[0].classList.remove("out");
	// Eliminando la classe "out" dall'insieme delle classi 
	// dell'elemento elimino anche l'elemento dalla collezione
}

for

Il for inizializza una variabile, pone una condizione e poi modifica (normalmente incrementa o decrementa) la variabile iniziale.

for (inzializzazione; condizione; modifica){
   // blocco istruzioni;
}

Il codice  <blocco istruzioni> viene eseguito fino a che l’espressione <condizione> risulta vera, poi si passa la all’istruzione successiva al for.

Esempio

/*
  Creo un certo numero (espresso dalla varibiale quanti) 
  di numeri casuali e li aggiungo ad un stringa (str) separandoli
  con una virgola e uno spazio
*/
var str = "";                                   // Inizializzazione della varibile str
for (var i = 0; i < quanti; i++) {
	var num = Math.round(Math.random() * 100);  // Numero random tra 0 e 100
	if ( i > 0) {
		str = str + ", ";                       // Aggiungo virgola e spazio
	}
	str = str + num;                            // Aggiungo il numero generato a str
}
// Mostro sullo schermo i numeri generati utilizzando l'elemento con id  "casualiGenerati"
document.getElementById("casualiGenerati").innerHTML = "Numeri generati: " + str;