WEBVTT

00:00:00.750 --> 00:00:03.571
V posledním videu jsme se naučili,
jak vytvořit typ objektu,

00:00:03.571 --> 00:00:06.374
který reprezentoval dva typu
objektů podobných Winstonovi.

00:00:06.374 --> 00:00:09.234
Potom jsme je inicializovali
pomocí konstruktorů.

00:00:09.234 --> 00:00:13.472
Typ objektu ale nemusí
souviset pouze s vlastnostmi.

00:00:13.472 --> 00:00:15.866
Může být také spojen
s funkcionalitou.

00:00:15.866 --> 00:00:18.927
Představte si svět a všechny 
typu objektů, které obsahuje.

00:00:18.927 --> 00:00:20.287
Například my lidé.

00:00:20.287 --> 00:00:22.307
Všichni máme výšku a věk,

00:00:22.307 --> 00:00:24.197
ale také máme věci, 
které můžeme dělat,

00:00:24.197 --> 00:00:26.287
jako třeba spát, jíst 
a programovat.

00:00:26.287 --> 00:00:30.679
Chceme být schopni spojit
tyto funkce s jejich typy objektů.

00:00:30.679 --> 00:00:34.279
Tento program máme v bodě,
kde jsme skončily minule.

00:00:34.289 --> 00:00:39.439
Máme zde funkci drawWinston, 
kterou voláme na oba objekty Winstona.

00:00:39.439 --> 00:00:44.916
Nebylo by hezké, kdybychom to mohli
spojit s Winstonovým typem objektu?

00:00:45.576 --> 00:00:48.309
Můžeme a je to celkem snadné.

00:00:48.569 --> 00:00:55.575
Pod naším konstruktorem napíšeme
"Winston" – velké W – tečka "prototype".

00:00:55.575 --> 00:00:59.232
"Prototype" je nové slovo,
které jste asi ještě neviděli.

00:00:59.232 --> 00:01:05.602
Prototyp je vlastnost objektu, 
ke které můžeme připojit funkce.

00:01:05.602 --> 00:01:07.321
To znamená,

00:01:07.321 --> 00:01:12.989
že každý objekt, který je prototypem,
bude obsahovat dané funkce.

00:01:12.989 --> 00:01:17.632
Můžeme tedy napsat tečka "prototype" 
a poté tečka a název funkce.

00:01:17.632 --> 00:01:24.399
Takže napíšeme "draw" rovná se 
a pak vezmeme náš kód z drawWinston,

00:01:24.399 --> 00:01:28.026
který následně můžeme
vložit sem dovnitř.

00:01:29.036 --> 00:01:34.386
Takže právě jsme připojili funkci
"draw" k našeme prototypu Winstona.

00:01:34.776 --> 00:01:35.838
To znamená,

00:01:35.838 --> 00:01:40.008
že bychom měli být schopni volat draw() 
u libovolného objektu typu Winston.

00:01:40.008 --> 00:01:45.331
Měli být schopni zavolat draw() 
na winstonTeen nebo winstonAdult.

00:01:45.331 --> 00:01:49.549
Když máme takovouto funkci,
kterou můžeme zavolat na objektu,

00:01:49.549 --> 00:01:51.444
nazýváme ji "method".

00:01:51.444 --> 00:01:54.193
Takže mě teď budete slyšet,
jak říkám "metoda".

00:01:54.713 --> 00:01:57.089
Řekněme tedy, že se jedná 
o "draw method".

00:01:57.922 --> 00:02:00.893
Tak a teď odstraníme tohle.

00:02:00.893 --> 00:02:05.499
Zkusíme, jestli teď můžeme volat 
draw(), winstonTeen.draw()

00:02:07.009 --> 00:02:08.287
A máme chybu.

00:02:08.287 --> 00:02:13.577
Chybové hlášení nám říká,
že "winstObject" není definován.

00:02:14.374 --> 00:02:18.370
Předtím jsme vložili tento 
parametr do drawWinston,

00:02:18.370 --> 00:02:22.710
což byl objekt typu Winston,
ale teď už to nepředáváme.

00:02:22.710 --> 00:02:26.592
Mohli bychom to změnit tak,
abychom to předali.

00:02:27.182 --> 00:02:30.339
To, co chceme předat,
bude winstonTeen.

00:02:30.339 --> 00:02:33.901
Teď to funguje, ale vypadá 
to opravdu nešikovně.

00:02:33.901 --> 00:02:38.081
Již volám draw na 
samotném objektu.

00:02:38.081 --> 00:02:41.775
Neměla bych vkládat 
znovu objekt jako takový.

00:02:41.775 --> 00:02:43.875
To se zdá nadbytečné.

00:02:43.875 --> 00:02:45.982
A je to pravda a neměli
bychom to tak dělat.

00:02:45.982 --> 00:02:48.245
Pojďme to smazat
a zamyslet se.

00:02:48.245 --> 00:02:50.444
Pokud jsme uvnitř objektu,

00:02:50.444 --> 00:02:54.274
co bychom mohli použít pro
přístup k vlastnostem objektu?

00:02:54.274 --> 00:02:56.311
Když se podíváte na konstruktor,

00:02:56.311 --> 00:02:58.661
možná si vybavíte speciální 
klíčové slovo "this".

00:03:00.328 --> 00:03:04.124
Co kdybychom nahradili 
toto za "this"?

00:03:04.124 --> 00:03:07.923
Takže změníme 
winstObject na "this".

00:03:08.383 --> 00:03:10.688
Protože jsme teď uvnitř objektu,

00:03:10.688 --> 00:03:16.781
tak je funkce vyhodnocena na objektu, 
takže "this" odkazuje na aktuální objekt.

00:03:16.781 --> 00:03:23.041
Takže nám stačí napsat "this" a získáme 
přístup ke všem vlastnostem objektu.

00:03:23.041 --> 00:03:25.280
A jak vidíte,
funguje to!

00:03:26.520 --> 00:03:31.547
Teď už nám stačí napsat
winstonAdult.draw().

00:03:31.907 --> 00:03:35.291
A bude to mít přístup k
vlastnostem winstonAdult,

00:03:35.291 --> 00:03:38.021
protože to je ten objekt, 
který se volá.

00:03:38.021 --> 00:03:41.022
A to je důvod, proč je slovo
"this" opravdu hodně dobré!

00:03:41.022 --> 00:03:44.292
I když to může být trochu
matoucí, když ho píšeme.

00:03:45.532 --> 00:03:49.294
To byla spousta legrace,
nyní přidejme další metodu.

00:03:49.294 --> 00:03:51.908
Co dalšího by Winston
mohl udělat?

00:03:51.908 --> 00:03:53.498
Možná bude mluvit.

00:03:53.498 --> 00:03:56.238
Takže uděláme
Winston.prototype.talk.

00:03:56.238 --> 00:04:00.628
Do prototypu můžeme připojit 
tolik metod, kolik chceme.

00:04:00.628 --> 00:04:05.241
Napíšeme: "Jsem Winston!"

00:04:05.241 --> 00:04:12.751
A pak napíšeme 
this.x+20 a this.y+150.

00:04:14.590 --> 00:04:15.954
Nic se nestalo.

00:04:15.954 --> 00:04:19.534
Ale to proto, že jsem tu 
funkci ještě nezavolala.

00:04:19.534 --> 00:04:24.208
Pojďme si tedy promluvit,
zavoláme winstonTeen.talk ().

00:04:24.208 --> 00:04:25.549
"Jsem Winston!"

00:04:26.406 --> 00:04:29.836
A pak napíšeme:
winstonAdult.talk()

00:04:31.928 --> 00:04:38.008
Teď máme tento objekt Winstona, 
který má vlastnosti: jméno, věk, x, y.

00:04:38.216 --> 00:04:41.448
A má taky funkcionality
jako chování a metody,

00:04:41.496 --> 00:04:44.440
které fungují odlišně 
v závislosti na vlastnostech.

00:04:45.110 --> 00:04:48.146
A můžeme vytvořit tolik instancí
Winstona, kolik jen chceme.

00:04:48.146 --> 00:04:50.649
A můžeme na ně zavolat
kteroukoli z těchto metod.

00:04:50.649 --> 00:04:52.873
Dost dobrý, že?