A jsme zpátky u programu,
který pomocí pole vypisuje
seznam mých kamarádů.
Něco se mi ale na něm
vůbec nelíbí.
Pokaždé, když do pole
přidám nového kamaráda,
musím zde dolů přidat nový
textový příkaz.
Řekněme, že přidám Winstona.
Neukáže se jen tak.
Pokud chci, aby se ukázal,
musím napsat "text(myFriends[3]...".
Potom ještě změním polohu y
a pak už uvidím Winstona.
To je zbytečně moc práce.
Chci, aby se při přidání někoho do pole
vytvořil textový příkaz automaticky.
Pamatujete si, jak jsme
se učili cykly?
Cykly nám pomohly opakovat
tu samou část kódu několikrát za sebou.
Například když jsme chtěli
mít několik stromů za sebou.
Nebo hromadu balónů.
Cykly jsou mimo jiné taky
skvělým způsobem pro to,
jak přehrát část kódu
pro každý prvek v poli.
Cykly použijete skoro vždy,
když budete používat pole.
Pracují spolu opravdu dobře.
Pojďme tedy pro zobrazení
jmen mých přátel použít cyklus.
Použijeme ho namísto všech
těchto textových příkazů.
Začneme se třemi otázkami,
na které se ptáme vždy,
když tvoříme cyklus.
První: co chci opakovat?
Podívám se, co se opakuje,
a vidím textový příkaz.
Druhá: co chci pokaždé změnit?
Podíváme se a zjistíme, že odlišná
je poloha y a aktuální index.
Kamarádovo číslo a poloha y.
Třetí: jak dlouho chceme opakovat?
Chceme opakovat, až dokud
nevypíšeme všechny kamarády.
Teď už víme, co chceme,
a tím pádem můžeme vytvořit cyklus.
Začneme proměnnou pro počítaní,
abychom měli přehled o stavu cyklu.
Napíšeme:
var friendNum = 0;
A číslem 0 začíname kvůli tomu,
že je to zároveň prvním číslem pole.
Není to číslo 1.
Poté máme while cyklus.
Napíšeme:
while(friendNum < myFriends.length)
Porovnáme tedy aktuální počítadlo
s celkovým počtem věcí v poli.
A uvnitř cyklu, tam kde používáme
textové příkazy,
napíšeme textový příkaz myFriends,
akorát místo čísla napíšeme "friendNum".
FriendNum totiž představuje
aktuální číslo.
Pro teď určíme jen jednu pozici.
Náš kód momentálně produkuje
chybu s nekonečným cyklem.
A to kvůli tomu, že jsme
ohledně friendNum nic nezměnili.
Musíme friendNum pokaždé zvyšovat,
jinak pojede smyčka donekonečna.
To kvůli tomu, že by
to bylo vždy true.
Něco se stalo, teď
zakomentuji starý kód.
Tím pádem můžu vidět,
co se to vlastně stalo.
Takže jsme zobrazili všechna jména,
jsou ale všechna naházena přes sebe.
Musíme změnit polohu y.
Napíšeme friendNum krát 30.
Je to sice fajn, ale Sophia se
teď nachází mimo obrazovku.
A pokud to zjistí,
tak ji to moc nepotěší.
Pojďme k tomu přidat 30,
čímž je všechny posuneme o 30.
Pěkné, teď máme cyklus
zobrazující naše pole.
A to znamená, že kdybychom
měli více lidí, jako Ohnoes Guy,
nebo dokonce Sala, z kterého přidáním
do pole udělám svého kamaráda.
A teď je můj kámoš.
Jak vidíte, nové kamarády to
zobrazuje automaticky,
protože se to pokaždé
přidá do celého pole.
Náš starý kód můžeme smazat,
už ho nebudeme potřebovat.
Pojďme si teď kód projít
a zopakovat si, jak vlastně funguje.
Začínáme s proměnnou friendNum
rovné číslu 0.
Zkontrolujeme, zda je friendNum
menší než aktuální délka.
Takže si to představíme a vidíme,
že 0 je méně než 6.
To je pravdivé.
Poté jdeme sem a napíšeme:
text(myFriends[friendNum]...)
Poprvé by to tedy bylo:
myFriends[0].
Dále následuje:
30 plus 0 krát 30.
Čímž se zajistí vyobrazení
Sophie na pozicích 10 a 30.
Poté máme friendNum++,
čili se hodnota stává 1.
Poté se cyklus opakuje a ptá se:
je číslo 1 menší než délka pole?
Ano, je.
A cyklus běží a běží.
A potom se dostaneme k Salovi.
Sal je šestým prvkem v poli,
má ale index 5 (kvůli začátku na 0).
Je 5 méně než 6?
Ano, je.
Zobrazuje to kamaráda 5
a poté se hodnota stává 6.
A je 6 méně než 6?
Ne, není, je to rovno.
Podmínka bude
tedy nepravdivá (false).
Nikdy se tedy
nezobrazí šestý prvek.
A to je dobře, protože v
indexu 6 nic není.
Šestý element je, ale
index 6 nic neobsahuje.
Může to být celkem matoucí,
nejdřív je to 0, pak 1 a pak další.
Naučíte se to.
To je tedy náš cyklus.
Pokud chcete,
můžete klidně použít cyklus for.
V případě, že
preferuje cyklus for.
Pro for cyklus napíšeme
for(var FriendNum = 0) a podmínku.
FriendNum je méně než myFriends.length,
poté máme přírůstek friendNum++.
A do vnitřku for cyklu
vložíme tento řádek kódu.
Změním polohu x a jak vidíte,
dělá to úplně tu samou věc.
Takže je na vás,
který z nich použijete.
Důležité je, že použijete cyklus
v kombinaci s vaším polem.
Učiní vás to opravdu mocnými.