WEBVTT

00:00:01.333 --> 00:00:02.334
Udělala jsem program,

00:00:02.334 --> 00:00:05.039
který o Winstonovi prozrazuje
řadu zajímavých detailů.

00:00:05.039 --> 00:00:08.366
Ale neprozrazuje úplně vše,
protože si to Winston nepřeje.

00:00:08.366 --> 00:00:10.520
Tak to prostě Winston chce.

00:00:11.154 --> 00:00:13.664
Pojďme se podívat, jak jsem 
tento program vytvořila.

00:00:13.664 --> 00:00:17.087
Nejdřív jsem vytvořila proměnné,
které v sobě ukládají části informací.

00:00:17.087 --> 00:00:19.264
První proměnná obsahuje 
číslo, Winstonův věk.

00:00:19.264 --> 00:00:21.804
Druhá proměnná obsahuje
textový řetězec, jeho oči.

00:00:21.804 --> 00:00:23.955
A třetí proměnná obsahuje
pole řetězců,

00:00:23.955 --> 00:00:26.187
což jsou věci, které 
Winston rád dělá.

00:00:26.187 --> 00:00:28.684
A poslední dvě proměnné
obsahují řetězce,

00:00:28.684 --> 00:00:31.566
které popisují Winstonovo
místo narození.

00:00:31.566 --> 00:00:36.380
A tady dolů jsem informace vypsala
pomocí textových příkazů a proměnných.

00:00:36.380 --> 00:00:39.699
U pole musím samozřejmě
zpřístupnit každý z jeho prvků.

00:00:39.699 --> 00:00:41.870
K tomu používám
zápis v závorce.

00:00:43.256 --> 00:00:48.636
Všech pět proměnných popisují
jednu a tu samou věc: Winstona.

00:00:48.636 --> 00:00:51.598
Proměnné ale nevědí,
že popisují tu samou věc.

00:00:54.228 --> 00:00:58.182
Když chceme v JavaScriptu uložit 
hromadu souvisejících informací,

00:00:58.182 --> 00:01:00.688
používáme k tomu 
mnohem lepší způsob.

00:01:00.688 --> 00:01:03.125
A tím způsobem je "objekt".

00:01:03.125 --> 00:01:07.932
To znamená, že namísto pěti 
proměnných nám stačí jedna,

00:01:07.932 --> 00:01:11.163
která všechny naše 
informace uloží pohromadě.

00:01:11.623 --> 00:01:14.556
Pojďme si to vyzkoušet
na Winstonových informacích.

00:01:14.556 --> 00:01:18.667
Nejdříve si vytvoříme proměnnou 
a nazveme ji Winston.

00:01:18.667 --> 00:01:21.149
Poté vložíme složené závorky.

00:01:21.149 --> 00:01:23.399
Dejte si pozor, aby byly
složené a ne hranaté.

00:01:23.399 --> 00:01:25.513
A na konec dáme prostředník.

00:01:25.513 --> 00:01:27.107
Vytvořili jsme objekt!

00:01:27.107 --> 00:01:31.047
Neobsahuje ale žádné informace.

00:01:31.909 --> 00:01:35.518
Aby nějaké informace obsahoval,
musíme mu dát nějaké vlastnosti.

00:01:35.518 --> 00:01:37.666
A každá vlastnost se skládá
z klíče a hodnoty.

00:01:37.666 --> 00:01:41.299
Věk napíšeme následovně:
age: 19.

00:01:42.099 --> 00:01:47.028
A oči napíšeme takhle:
eyes: "black"

00:01:48.039 --> 00:01:52.742
Winston má teď uvnitř
svého objektu dvě vlastnosti.

00:01:52.742 --> 00:01:58.794
Pro koníčky napíšeme "likes: "
a překopírujeme horní část kódu.

00:02:00.806 --> 00:02:04.000
Takže Winston už má 
tři vlastnosti.

00:02:04.000 --> 00:02:08.317
Každá z vlastností má klíč,
který je na levé straně,

00:02:08.317 --> 00:02:12.796
a pak hodnotu,
která je na pravé straně.

00:02:12.796 --> 00:02:16.268
Pro klíč platí stejná pravidla jako 
pro jména proměnných v JavaScriptu.

00:02:16.268 --> 00:02:20.099
Žádné mezery, začínáme 
písmenem a tak dále.

00:02:20.591 --> 00:02:22.063
Co se týče hodnoty,

00:02:22.063 --> 00:02:25.234
může se jednat o jakoukoli hodnotu,
na kterou jsme zatím narazili.

00:02:25.234 --> 00:02:27.124
Může to být číslo, řetězec, pole...

00:02:27.124 --> 00:02:29.550
Mohl by to dokonce být i boolean.

00:02:29.550 --> 00:02:34.126
Můžeme napsat "isCool: true",
což je samozřejmě pravda.

00:02:34.126 --> 00:02:38.398
Popravdě můžeme jako hodnotu 
použít i nějaký jiný objekt.

00:02:38.398 --> 00:02:41.839
Například město a stát 
narození jsou informace,

00:02:41.839 --> 00:02:43.266
které popisují tu samou věc.

00:02:43.266 --> 00:02:45.396
Jedno a to samé místo.

00:02:45.396 --> 00:02:48.806
Dávalo by proto smysl, abychom 
hodnotu uložili jako objekt.

00:02:48.806 --> 00:02:51.042
Přidám další klíč,
místo narození.

00:02:51.042 --> 00:02:54.836
A jako hodnotu nejdřív 
vložím složené závorky.

00:02:54.836 --> 00:02:58.376
Uvnitř pak budu mít klíč
pro město, "city: ".

00:02:58.376 --> 00:03:00.719
"Mountain View"

00:03:00.719 --> 00:03:02.847
A stát, "state: ".

00:03:02.847 --> 00:03:04.054
"California".

00:03:05.494 --> 00:03:09.906
A teď už můžete do objektu
ukládat celkem detailní informace.

00:03:11.033 --> 00:03:13.280
A protože už máme 
tento pěkný objekt,

00:03:13.280 --> 00:03:15.639
který o Winstonovi 
prozrazuje zajímavé informace,

00:03:15.639 --> 00:03:20.253
můžeme všechny tyto 
zastaralé proměnné smazat.

00:03:23.066 --> 00:03:26.187
A dostali jsme chybové hlášení!

00:03:26.187 --> 00:03:30.179
Je to kvůli tomu, že naše textové 
příkazy odkazují na staré proměnné.

00:03:30.179 --> 00:03:34.502
Musíme informace aktualizovat
a použít informace z objektu.

00:03:34.502 --> 00:03:38.218
Začneme tím, že zakomentujeme
poslední tři řádky kódu,

00:03:38.218 --> 00:03:40.562
abychom je mohli 
aktualizovat jeden po druhém.

00:03:41.147 --> 00:03:46.111
Momentálně zde máme "winstonAge"
a potřebujeme to něčím nahradit.

00:03:46.111 --> 00:03:49.478
Nejprve napíšeme "winston",
což je název proměnné.

00:03:49.478 --> 00:03:53.834
Všimněte si, že pokud to necháme tak,
dostaneme hlášení "object Object".

00:03:53.834 --> 00:03:55.163
A to není vůbec hezké.

00:03:55.163 --> 00:03:56.932
Je to zpráva JavaScriptu,

00:03:56.932 --> 00:04:01.044
která nám říká, že se snažíme převést 
celý objekt do řetězcové hodnoty.

00:04:01.044 --> 00:04:05.054
My se ale snažíme získat
pouze vnitřní hodnotu pro věk.

00:04:05.054 --> 00:04:09.173
Takže za to napíšeme tečku,
"winston." a napíšeme název klíče.

00:04:09.173 --> 00:04:11.063
Klíčem je "age".

00:04:11.063 --> 00:04:13.398
A máme věk!

00:04:13.398 --> 00:04:14.897
Toto se nazývá tečkový zápis.

00:04:14.897 --> 00:04:16.254
Je to typ zápisu,

00:04:16.254 --> 00:04:20.811
kdy nejprve napíšeme název proměnné
objektu, tečku a pak klíč dané vlastnosti.

00:04:20.811 --> 00:04:23.454
Podobně můžeme dodělat zbytek.

00:04:23.454 --> 00:04:24.844
Tohle odkomentuji.

00:04:24.844 --> 00:04:29.357
A namísto "winstonEyes" 
napíšeme "winston.eyes".

00:04:29.357 --> 00:04:34.074
A tady to bude "winston.likes".

00:04:34.074 --> 00:04:37.341
A potom "winston.likes[1]".

00:04:37.341 --> 00:04:41.471
A pro tento poslední to bude
o trošku komplikovanější,

00:04:41.471 --> 00:04:45.451
protože se jedná o objekt
uvnitř jiného objektu.

00:04:45.451 --> 00:04:49.054
Napíšeme "winston.birthplace",

00:04:49.686 --> 00:04:52.268
což ale pořád odkazuje 
k celému objektu.

00:04:52.268 --> 00:04:56.485
A proto musíme napsat
"winston.birthplace.city".

00:04:57.455 --> 00:05:01.572
A tady napíšeme
"winston.birthplace.state".

00:05:02.602 --> 00:05:03.861
Toto se celkem hodí,

00:05:03.861 --> 00:05:07.756
protože se můžete vnořovat
do objektů, které jsou v objektech.

00:05:12.855 --> 00:05:14.192
Jak můžete vidět,

00:05:14.192 --> 00:05:19.431
objekty jsou skvělým způsobem, jak 
uložit související informace pohromadě.

00:05:19.431 --> 00:05:21.423
Můžeme je pak později 
vyhledat a použít.

00:05:21.423 --> 00:05:24.586
A čím více je budete používat,
tím více budete z objektů nadšeni!