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!