0:00:01.496,0:00:04.117
Drahokam, a velmi pěkný drahokam!

0:00:04.117,0:00:06.286
Ale víte, co je lepší[br]než jeden drahokam?

0:00:06.286,0:00:08.275
Je to celá řada drahokamů!

0:00:08.275,0:00:09.942
Nyní již samozřejmě víme,

0:00:09.942,0:00:12.751
že nejlepší způsob, jak řadu [br]drahokamů udělat, bude cyklem.

0:00:12.751,0:00:16.162
Pojďme tedy použít cyklus for k[br]nakreslení 12 drahokamů v řadě.

0:00:16.162,0:00:19.523
Zleva doprava přes obrazovku.

0:00:19.523,0:00:21.624
Takhle.

0:00:21.624,0:00:31.046
Napíšeme tedy: [br]for (var i = 0; i < 12; i++).

0:00:31.046,0:00:34.939
Poté vezmeme tento řádek[br]a přesuneme ho dovnitř, sem.

0:00:36.019,0:00:37.979
Takže zde máme 12 drahokamů,

0:00:37.979,0:00:40.389
ale všechny jsou momentálně[br]nahrnuty přímo na sebe.

0:00:40.389,0:00:43.401
A my je chceme[br]vidět přes obrazovku.

0:00:43.401,0:00:45.941
To znamená, že musíme[br]upravit proměnnou x.

0:00:45.941,0:00:49.524
Proměnná x je nyní 36 a my chceme, [br]aby měla pokaždé jinou hodnotu.

0:00:49.524,0:00:51.859
To znamená, že musí být x[br]závislé na i.

0:00:51.859,0:00:56.329
Co můžeme udělat,[br]je jednoduše napsat: i krát 36.

0:00:56.329,0:01:01.627
Takže první je na 0, pak 36[br]a pak 72 atd.

0:01:02.687,0:01:04.575
Super, nyní máme [br]řádek drahokamů.

0:01:04.575,0:01:07.997
Připomíná mi to jednu z těch scén[br]v Indianě Jones nebo Aladdinovi,

0:01:07.997,0:01:11.306
kde hrdina v podzemní objeví[br]pokladnice drahokamů.

0:01:11.306,0:01:13.732
Obvykle ale najdou[br]mnohem více drahokamů než tohle.

0:01:13.732,0:01:17.306
Nejen řadu drahokamů,[br]ale přímo hromadu drahokamů.

0:01:17.306,0:01:23.512
Jak tedy můžeme vyrobit další drahokamy,[br]které by byly i směrem dolů po obrazovce?

0:01:24.276,0:01:29.539
No, mohli bychom začít opakováním[br]cyklu for a zkopírovat ho sem.

0:01:30.389,0:01:32.795
Poté musíme pokaždé[br]změnit proměnnou y.

0:01:34.355,0:01:37.578
Takže to změníme[br]na 60 a poté na 90.

0:01:37.578,0:01:44.060
Nyní máme tři řady drahokamů,[br]ale začíná to být velmi nudné,

0:01:44.060,0:01:49.114
protože jenom kopírujeme a vkládáme,[br]přičemž měníme jenom tuto jednu věc.

0:01:49.114,0:01:52.889
Obvykle, když bychom přišli na to, [br]že píšeme opakující se kód,

0:01:52.889,0:01:56.537
řekli bychom si: „Možná bychom [br]místo toho měli použít cyklus. “

0:01:56.537,0:01:58.607
Jenže my již používáme cyklus.

0:01:58.607,0:02:00.634
Jaké je tedy řešení,

0:02:00.634,0:02:03.854
abychom se vyhnuly opakujícímu se[br]kopírování a vkládání?

0:02:03.854,0:02:09.358
Je to něco, čemu říkáme "vnořené [br]for cykly", tedy cyklus uvnitř cyklu.

0:02:09.358,0:02:12.132
Co tedy budeme dělat je to, [br]že vytvoříme vnější cyklus,

0:02:12.132,0:02:15.038
který se postará o to, [br]aby drahokamy šly dolů po obrazovce.

0:02:15.038,0:02:19.234
A pak se náš vnitřní cyklus [br]postará o to, co dělá teď,

0:02:19.234,0:02:20.997
tedy aby drahokamy [br]šly zleva doprava.

0:02:21.767,0:02:23.789
Hned vám ukážu, [br]co mám na mysli.

0:02:23.789,0:02:28.351
Začneme "for" a použijeme [br]novou proměnnou "j",

0:02:28.351,0:02:29.851
protože "i" už používáme.

0:02:29.851,0:02:35.974
for (var j = 0; j < 13; j++).

0:02:37.274,0:02:41.359
Takže to bude tedy náš vnější cyklus,[br]pro směr od shora dolů.

0:02:41.359,0:02:45.037
A pak si prostě vezmeme[br]jeden z našich předchozích for cyklů,

0:02:45.037,0:02:49.444
vložíme ho dovnitř a[br]opravíme odsazení.

0:02:50.274,0:02:52.164
A tyto staré odstraníme.

0:02:53.274,0:02:58.719
Takže všechny cykly máme [br]nahromaděné nahoře ve stejné řadě.

0:02:58.729,0:03:01.439
Teď chceme změnit y,[br]je to tak?

0:03:01.439,0:03:04.268
To je to, co jsme změnili předtím,[br]když jsme kód kopírovali.

0:03:04.268,0:03:06.108
A momentálně je y vždy 90.

0:03:06.108,0:03:08.710
A my chceme změnit y [br]pro každý řádek.

0:03:09.440,0:03:15.308
Takže pokud je x závislé na i,[br]chceme, aby y bylo závislé na j.

0:03:15.998,0:03:24.663
Můžeme to tedy změnit [br]na něco jako: j krát 30.

0:03:26.163,0:03:27.705
Tolik drahokamů!

0:03:29.604,0:03:32.336
Pojďme si kód znovu [br]projít a říct si, co dělá.

0:03:32.336,0:03:37.420
Vnější cyklus vytvoří proměnnou j[br]a zvyšuje ji až na hodnotu 13.

0:03:38.340,0:03:42.820
Po každém vykonání tohoto vnějšího cyklu[br]poběží i tento vnitřní cyklus.

0:03:44.040,0:03:47.813
Vnitřní cyklus vytvoří proměnnou i, [br]která stoupá až na hodnotu 12.

0:03:47.813,0:03:52.208
A po každém provedení vnitřního cyklu[br]se nakreslí obrázek na x a y,

0:03:52.208,0:03:54.148
které jsou založeny na i a j.

0:03:55.358,0:03:58.707
Proměnná i se kvůli tomu mění [br]mnohem častěji mění než j.

0:03:59.247,0:04:04.548
Abychom to pochopili lépe, [br]zkusme si hodnoty i a j vizualizovat.

0:04:04.958,0:04:12.027
Takže toto zakomentuji[br]a pak nastavím barvu výplně.

0:04:12.027,0:04:14.976
Budu používat textový příkaz[br]pro zobrazení hodnoty j.

0:04:14.976,0:04:20.035
Takže "text j" a pak to dám[br]na příslušné místo zde.

0:04:21.335,0:04:25.909
Nyní můžeme vidět, jak[br]se j pohybuje od 0 do 12.

0:04:25.909,0:04:29.739
To je v podstatě místo,[br]kde jsou umístěny řady drahokamů.

0:04:31.809,0:04:34.934
A teď si vizualizujeme "i"[br]a uvidíte, jak se mění.

0:04:35.444,0:04:38.886
Takže pro "i"[br]uděláme jinou barvu.

0:04:42.906,0:04:45.635
Pak "i" někam dáme.

0:04:45.945,0:04:49.481
A jeho hodnotu x změníme tak,[br]že jde přes obrazovku.

0:04:49.481,0:04:53.338
Uděláme to samé pro y.

0:04:54.688,0:04:59.561
Nyní můžeme vidět, že "i"[br]jde od 0 do 11.

0:04:59.561,0:05:04.326
A "i", jak jsem říkala,[br]se mění mnohem častěji.

0:05:04.326,0:05:08.778
Tento řádek kódu bude vykonán[br]mnohem častěji, než tento řádek kódu.

0:05:08.778,0:05:13.855
Protože tento řádek kódu je spuštěn[br]při každém provedení vnitřního cyklu,

0:05:13.855,0:05:18.167
zatímco tento řádek kódu se vykoná [br]pouze při každém provedení vnějšího cyklu.

0:05:19.007,0:05:26.593
Doufám, že vám tato vizualizace i a j[br]pomůže lépe pochopit vnořené for cykly.

0:05:26.593,0:05:30.475
Nyní vrátíme zpět naše drahokamy,[br]protože jsou mnohem hezčí!

0:05:30.475,0:05:34.066
S vnořenými cykly toho[br]můžete dělat opravdu mnoho.

0:05:34.066,0:05:36.652
Stačí popřemýšlet o čemkoliv,[br]co na světě existuje.

0:05:36.652,0:05:39.599
Něco jako dvourozměrná mřížka,[br]šachovnice, přikrývka,

0:05:39.599,0:05:43.824
hvězdy na americké vlajce,[br]zajímavé vzory a tapety.

0:05:44.454,0:05:47.352
Nastartujte svou fantazii a[br]pohrajte si s tímto kódem.

0:05:47.352,0:05:49.386
Například změňte obrázek.

0:05:49.386,0:05:53.166
Já začnu tím, že ho[br]změním na srdce!

0:05:53.796,0:05:58.256
Abych vám ukázala, jak moc[br]mám vnořené for cykly ráda!