-
Drahokam, a velmi pěkný drahokam!
-
Ale víte, co je lepší
než jeden drahokam?
-
Je to celá řada drahokamů!
-
Nyní již samozřejmě víme,
-
že nejlepší způsob, jak řadu
drahokamů udělat, bude cyklem.
-
Pojďme tedy použít cyklus for k
nakreslení 12 drahokamů v řadě.
-
Zleva doprava přes obrazovku.
-
Takhle.
-
Napíšeme tedy:
for (var i = 0; i < 12; i++).
-
Poté vezmeme tento řádek
a přesuneme ho dovnitř, sem.
-
Takže zde máme 12 drahokamů,
-
ale všechny jsou momentálně
nahrnuty přímo na sebe.
-
A my je chceme
vidět přes obrazovku.
-
To znamená, že musíme
upravit proměnnou x.
-
Proměnná x je nyní 36 a my chceme,
aby měla pokaždé jinou hodnotu.
-
To znamená, že musí být x
závislé na i.
-
Co můžeme udělat,
je jednoduše napsat: i krát 36.
-
Takže první je na 0, pak 36
a pak 72 atd.
-
Super, nyní máme
řádek drahokamů.
-
Připomíná mi to jednu z těch scén
v Indianě Jones nebo Aladdinovi,
-
kde hrdina v podzemní objeví
pokladnice drahokamů.
-
Obvykle ale najdou
mnohem více drahokamů než tohle.
-
Nejen řadu drahokamů,
ale přímo hromadu drahokamů.
-
Jak tedy můžeme vyrobit další drahokamy,
které by byly i směrem dolů po obrazovce?
-
No, mohli bychom začít opakováním
cyklu for a zkopírovat ho sem.
-
Poté musíme pokaždé
změnit proměnnou y.
-
Takže to změníme
na 60 a poté na 90.
-
Nyní máme tři řady drahokamů,
ale začíná to být velmi nudné,
-
protože jenom kopírujeme a vkládáme,
přičemž měníme jenom tuto jednu věc.
-
Obvykle, když bychom přišli na to,
že píšeme opakující se kód,
-
řekli bychom si: „Možná bychom
místo toho měli použít cyklus. “
-
Jenže my již používáme cyklus.
-
Jaké je tedy řešení,
-
abychom se vyhnuly opakujícímu se
kopírování a vkládání?
-
Je to něco, čemu říkáme "vnořené
for cykly", tedy cyklus uvnitř cyklu.
-
Co tedy budeme dělat je to,
že vytvoříme vnější cyklus,
-
který se postará o to,
aby drahokamy šly dolů po obrazovce.
-
A pak se náš vnitřní cyklus
postará o to, co dělá teď,
-
tedy aby drahokamy
šly zleva doprava.
-
Hned vám ukážu,
co mám na mysli.
-
Začneme "for" a použijeme
novou proměnnou "j",
-
protože "i" už používáme.
-
for (var j = 0; j < 13; j++).
-
Takže to bude tedy náš vnější cyklus,
pro směr od shora dolů.
-
A pak si prostě vezmeme
jeden z našich předchozích for cyklů,
-
vložíme ho dovnitř a
opravíme odsazení.
-
A tyto staré odstraníme.
-
Takže všechny cykly máme
nahromaděné nahoře ve stejné řadě.
-
Teď chceme změnit y,
je to tak?
-
To je to, co jsme změnili předtím,
když jsme kód kopírovali.
-
A momentálně je y vždy 90.
-
A my chceme změnit y
pro každý řádek.
-
Takže pokud je x závislé na i,
chceme, aby y bylo závislé na j.
-
Můžeme to tedy změnit
na něco jako: j krát 30.
-
Tolik drahokamů!
-
Pojďme si kód znovu
projít a říct si, co dělá.
-
Vnější cyklus vytvoří proměnnou j
a zvyšuje ji až na hodnotu 13.
-
Po každém vykonání tohoto vnějšího cyklu
poběží i tento vnitřní cyklus.
-
Vnitřní cyklus vytvoří proměnnou i,
která stoupá až na hodnotu 12.
-
A po každém provedení vnitřního cyklu
se nakreslí obrázek na x a y,
-
které jsou založeny na i a j.
-
Proměnná i se kvůli tomu mění
mnohem častěji mění než j.
-
Abychom to pochopili lépe,
zkusme si hodnoty i a j vizualizovat.
-
Takže toto zakomentuji
a pak nastavím barvu výplně.
-
Budu používat textový příkaz
pro zobrazení hodnoty j.
-
Takže "text j" a pak to dám
na příslušné místo zde.
-
Nyní můžeme vidět, jak
se j pohybuje od 0 do 12.
-
To je v podstatě místo,
kde jsou umístěny řady drahokamů.
-
A teď si vizualizujeme "i"
a uvidíte, jak se mění.
-
Takže pro "i"
uděláme jinou barvu.
-
Pak "i" někam dáme.
-
A jeho hodnotu x změníme tak,
že jde přes obrazovku.
-
Uděláme to samé pro y.
-
Nyní můžeme vidět, že "i"
jde od 0 do 11.
-
A "i", jak jsem říkala,
se mění mnohem častěji.
-
Tento řádek kódu bude vykonán
mnohem častěji, než tento řádek kódu.
-
Protože tento řádek kódu je spuštěn
při každém provedení vnitřního cyklu,
-
zatímco tento řádek kódu se vykoná
pouze při každém provedení vnějšího cyklu.
-
Doufám, že vám tato vizualizace i a j
pomůže lépe pochopit vnořené for cykly.
-
Nyní vrátíme zpět naše drahokamy,
protože jsou mnohem hezčí!
-
S vnořenými cykly toho
můžete dělat opravdu mnoho.
-
Stačí popřemýšlet o čemkoliv,
co na světě existuje.
-
Něco jako dvourozměrná mřížka,
šachovnice, přikrývka,
-
hvězdy na americké vlajce,
zajímavé vzory a tapety.
-
Nastartujte svou fantazii a
pohrajte si s tímto kódem.
-
Například změňte obrázek.
-
Já začnu tím, že ho
změním na srdce!
-
Abych vám ukázala, jak moc
mám vnořené for cykly ráda!