Tutorial 3 - i cicli

[Flep]

Ciao a tutti :)
Adesso che abbiamo visto cosa sono gli Array e come si usano, proseguo con i tutorials di Actionscript 3.0 base
In questo articolo vedremo cosa sono i cicli, a cosa servono, quanti tipi sono e come usarli.
Inoltre i cicli ci permettono di navigare all' interno degli Array risalendo ad ogni loro elemento utilizzando appunto la variabile di controllo del ciclo come indice di un Array.

I cicli sono blocchi di codice che vengono eseguiti ripetutamente fino a quando una certa condizione ( chiamata condizione di ciclo ) ha valore true, cioè è vera.
Acionscript 3.0 mette a disposizione 5 tipi di cicli...

for ( solitamente il più usato )

while

do - while

for - each - in

for - in

Vediamo come usarli...

Ciclo for

Questo ciclo è di solito il più utilizzato e lasciatemi dire anche il più semplice da apprendere per chi è alle prime basi.
Un ciclo for è una struttura che permette la ripetizioni di parti di codice da 0 a più volte ( anche infinito se necessario ) dichiarando il numero di iterazioni ( numero di volte che il codice verrà eseguito ).
Per creare un ciclo for, bisogna stare attenti a 5 regole fondamentali.

1. Naturalmente dichiarare la parola for, in modo che Flash capisca che stiamo inizializzando un ciclo


2. Dichiarare una variabile di controllo


3. Dichiarare una condizione di ciclo


4. Dichiarare una espressione di incremento


5. Dichiarare il blocco di istruzioni

Quindi, con Actionscript 3.0, dichiariamo un ciclo in questo modo:

for(var i:int=0;i<10;i++)
{
	trace(i);
}

ottenendo il seguente output

0
1
2
3
4
5
6
7
8
9

for , dichiaro il ciclo
var i:int=0; dichiaro una variabile di controllo ( in questo caso ha valore iniziale zero )
i<10; questa è la condizione di ciclo, cioè fino a che il valore della variabile i è minore di 10, Flash esegue il codice
i++; questa è l' espressione di incremento, ad ogni iterazione del ciclo viene incrementata la variabile di controllo
trace(i); è il blocco di istruzioni, il codice che Flash esegue ad ogni iterazione.

In sostanza avviene questo:

• Flash vede che è un ciclo dall' operatore for
• Controlla la condizione di ciclo ( se i è minore di 10 ) e se è vera allora esegue il codice tra le graffe
• Esegue il codice tra le graffe ( il blocco di istruzioni )
• Dato cha sa che è un ciclo, non continuerà ad eseguire il codice che eventualmente sarà dopo il ciclo, ma andrà ad incrementare la i ( i++ )
• quando la condizione di ciclo sarà falsa, e cioè che i sarà uguale o maggiore a 10, allora Flash uscirà dal ciclo ed eseguirà il codice seguente al ciclo

for(var i:int=0;i<10;i++)
{
	trace(i);
}
trace('fatto');

output:

0
1
2
3
4
5
6
7
8
9
fatto

Dato che ho già presentato gli Array di Actionscript 3.0, vediamo come navigarli ed accedere ai loro elementi utilizzando un ciclo for.

var nomi:Array=new Array('filippo','andrea','giovanni','pietro','giacomo','luca','paolo');
for(var n:int=0;n < nomi.length;n++)
{
	trace(nomi[n]);
}

Ho creato un array
var nomi:Array=new Array('filippo','andrea','giovanni','pietro','giac omo','luca','paolo');
creo un ciclo for con condizione di ciclo il valore massimo della lunghezza dell' array ( usando la proprietà length della classe Array, che abbiamo già visto nel tutorial 2 sugli Array )
for(var n:int=0;n < nomi.length;n++)
e poi utilizzo la variabile di controllo ( in questo caso n ) per accedere ad ogni elemento dell' array tramite i suoi indici
trace(nomi[n]);

ottenendo il seguente output

filippo
andrea
giovanni
pietro
giacomo
luca
paolo

Ciclo while

Strutturalmente, un ciclo while assomiglia molto ad una logica condizionale ( if ) che vedremo più avanti.
Anche questo ciclo permette la ripetizioni di parti di codice da 0 a più volte dichiarando il numero di iterazioni.
A differenza del ciclo for, il ciclo while viene dichiarato in questo modo:

variabile di controllo
while(condizione di ciclo)
{
blocco di istruzioni
espressione di incremeto
}

quindi

var j:int=0;
while(j<10)
{
	trace(j);
	j++;
}
trace('fatto');

da il seguente output

0
1
2
3
4
5
6
7
8
9
fatto

Come si nota, il risultato è identico al ciclo for, il tipo di struttura e la logica implementata nella nostra applicazione ci indicheranno quale tipo di ciclo utilizzare.
Inoltre è altrettanto importante notare che l' azione trace('fatto'); non viene eseguita fino a quando la condizione di ciclo risulta falsa.

Ciclo do while

Questo ciclo si potrebbe defiire come la versione invertita del ciclo while. Infatti la sua struttura è la seguente:

variabile di controllo
do
{
blocco di istruzioni
espressione di incremeto
}
while(condizione di ciclo);

quindi

var k:int=0;
do
{
	trace(k);
	k++
}
while(k<10);
trace('fatto');

con il seguente output

0
1
2
3
4
5
6
7
8
9
fatto

Anche in questo caso vediamo che l' output non cambia, quindi il fine è lo stesso del ciclo for e del ciclo while. Saranno appunto le condizioni della struttura dell' applicazione che stiamo sviluppando a portarci ad usare il ciclo più adeguato ( anche se ripeto, nel 90% dei casi il ciclo for è sempre quello utilizzato ).

Ciclo for each in

Questo ciclo è fondamentale per accedere alle proprietà dinamiche di un oggetto oppure agli elementi di un Array tramite i suoi indici.
La sua struttura è la seguente:

for each(variabileDiControllo in Oggetto)
{
blocco di istruzioni
}

Quindi, supponiamo di avere un oggetto con diverse proprietà:

var oggetto:Object=new Object();
oggetto.nome='filippo';
oggetto.cognome='lughi';
oggetto.sesso='maschile';
oggetto.paese='cesenatico';

con un ciclo for each in possiamo risalire ogni proprietà di oggetto in questo modo

for each(var p in oggetto)
{
	trace(p);
}

ottenendo il seguente output

filippo
lughi
maschile
cesenatico

Adobe non garantisce l' ordine di output tranne nei casi in cui lavoriamo con le classi XML e XMLList.
Infatti se aggiungo una proprietà a oggetto di tipo numerico

var oggetto:Object=new Object();
oggetto.nome='filippo';
oggetto.cognome='lughi';
oggetto.eta=35;
oggetto.sesso='maschile';
oggetto.paese='cesenatico';

ecco che l' output che ottengo non rispetta l' ordine

filippo
35
lughi
maschile
cesenatico

Il seguente codice invece, utilizza il ciclo for each in per accedere agli elementi di Array:

var nomi:Array=new Array('filippo','andrea','giovanni','pietro','giacomo','luca','paolo');
for each(var s in nomi)
{
	trace(s);
}

ottenendo questo output

filippo
andrea
giovanni
pietro
giacomo
luca
paolo

Ciclo for in

Questo ciclo ha la stessa struttura del ciclo for each in, l' unica sostanziale differenza è che il ciclo for each in itera tra i valori delle variabili mentre il ciclo for in itera tra i nomi delle variabili.
Vediamo un esempio sullo stesso Object dell' esempio

var oggetto:Object=new Object();
oggetto.nome='filippo';
oggetto.cognome='lughi';
oggetto.sesso='maschile';
oggetto.paese='cesenatico';
for (var p in oggetto)
{
	trace(p);
}

ottengo il seguente output

nome
cognome
sesso
paese

Vorrei ricordare a chi è alle prime basi di Actionscript di fare numerosi esercizi e raggiugere una buona padronanza dei cicli.

Files:

[grandeorco]

var nomi:Array=new Array('filippo','andrea','giovanni','pietro','giac omo','luca','paolo');
for each(var s in nomi2)
{
trace(s);
}


Perche è nomi2 e non nomi?
Cosa mi sfugge?

[Flep]

Era un errore

Ho corretto e grazie dell' avviso

[nexo]

• Flash vede che è un ciclo dall' operatore for
• Esegue subito il codice tra le graffe ( il blocco di istruzioni )
• Dato cha sa che è un ciclo, non continuerà ad eseguire il codice che eventualmente sarà dopo il ciclo, ma andrà ad incrementare la i ( i++ )
• Controlla la condizione di ciclo ( se i è minore di 10 ) e se è vera allora esegue ancora il codice tra le graffe
• quando la condizione di ciclo sarà falsa, e cioè che i sarà uguale o maggiore a 10, allora Flash uscirà dal ciclo ed eseguirà il codice seguente al ciclo

Sei certo sia corretto?

Non dovrebbe essere :

• Flash vede che è un ciclo dall' operatore for
• Controlla la condizione di ciclo ( se i è minore di 10 ) e se è vera allora esegue il codice tra le graffe
• Esegue il codice tra le graffe ( il blocco di istruzioni )
• Dato cha sa che è un ciclo, non continuerà ad eseguire il codice che eventualmente sarà dopo il ciclo, ma andrà ad incrementare la i ( i++ )
• quando la condizione di ciclo sarà falsa, e cioè che i sarà uguale o maggiore a 10, allora Flash uscirà dal ciclo ed eseguirà il codice seguente al ciclo

Grazie mille per tutto l'aiuto che ci dai e per l'impegno che costantemente metti a disposizione degli altri!


Saluti

Nexo

[Flep]

• Flash vede che è un ciclo dall' operatore for
• Esegue subito il codice tra le graffe ( il blocco di istruzioni )
• Dato cha sa che è un ciclo, non continuerà ad eseguire il codice che eventualmente sarà dopo il ciclo, ma andrà ad incrementare la i ( i++ )
• Controlla la condizione di ciclo ( se i è minore di 10 ) e se è vera allora esegue ancora il codice tra le graffe
• quando la condizione di ciclo sarà falsa, e cioè che i sarà uguale o maggiore a 10, allora Flash uscirà dal ciclo ed eseguirà il codice seguente al ciclo

Sei certo sia corretto?

Non dovrebbe essere :

• Flash vede che è un ciclo dall' operatore for
• Controlla la condizione di ciclo ( se i è minore di 10 ) e se è vera allora esegue il codice tra le graffe
• Esegue il codice tra le graffe ( il blocco di istruzioni )
• Dato cha sa che è un ciclo, non continuerà ad eseguire il codice che eventualmente sarà dopo il ciclo, ma andrà ad incrementare la i ( i++ )
• quando la condizione di ciclo sarà falsa, e cioè che i sarà uguale o maggiore a 10, allora Flash uscirà dal ciclo ed eseguirà il codice seguente al ciclo

Grazie mille per tutto l'aiuto che ci dai e per l'impegno che costantemente metti a disposizione degli altri!


Saluti

Nexo

Sì, hai ragione
Chiedo scusa.

Ho corretto.

[carnifexino]

Ciao, complimenti per il forum e grazie delle guide.
Mi sembra che nell'esempio del ciclo for in manchi un pezzo di codice, dovrebbe esserci:

for (var p in oggetto)
{
    trace (p);
}

[carnifexino]

Anche l'output è sbagliato, dovrebbe essere:

nome
cognome
sesso
paese

[Flep]

Sì hai ragione ho corretto.
Scusate le distrazioni... ma dov' ero con la testa quando ho scrito quel ciclo...

[carnifexino]

Ciao, sempre io, ancora alle prese coi cicli ... ho creato un ciclo che disegna 10 volte un quadrato sullo stage:

var quadr:MovieClip = new MovieClip();

for (var i:int=0; i<10; i++)
{
quadr.name = 'quadr';
quadr.graphics.lineStyle(1);
quadr.graphics.drawRect(25 + 50 * i, 25 ,  50,  50);
addChild (quadr);
}

Ora vorrei provare a disegnare una 'griglia' di 10 quadrati x 10 sempre utilizzando i cicli (o altri sistemi perchè no?)... suggerimenti?

[Flep]

Ciao

Ti ho fatto un esempio:

var colonne:int=5
var lato:int=50;
var spazio_sinistra:int=20;

for (var i:int=0; i<10; i++)
{
	var quadr:MovieClip = new MovieClip();
	quadr.name = 'quadr';
	quadr.graphics.lineStyle(1);
	quadr.graphics.drawRect(0, 0 , lato, lato);
	quadr.x = spazio_sinistra + ( i % colonne ) * lato;
	quadr.y = spazio_sinistra + Math.floor( i / colonne ) * lato;
	addChild (quadr);
}