EcmaScript 6: Gettery i settery w ES5

0:00W tym rozdziale pokażę ci w jaki sposób działa tak zwane Reflect API, dostępne

0:04w ES6. Natomiast zanim do tego przejdziemy, to chciałbym ci przypomnieć, jeżeli jeszcze o

0:09tym nie wiedziałeś, to cię poinformować, że coś takiego jest. Mianowicie czym

0:13są gettery i settery w EcmaScript 5 dlatego, że to co ci pokażę

0:17w lekcji kolejnej jest swego rodzaju kontynuacją tego co mieliśmy od ES5. Mamy

0:22sobie taki oto obiekt i w środku zapisałem firstName i lastName i zauważ,

0:26że stworzyłem dwie zwyczajne metody. Nie ma tutaj nic skomplikowanego getFullName

0:31i setFullName, czyli getFullName będzie nam zwracać firstName i lastName

0:35rozdzielone na spacji, więc wpiszmy sobie tutaj person getFullName. Widzimy,

0:41że jest to Jan Kowalski, natomiast setFullName pozwoli nam podać całe nazwisko,

0:45rozbijemy go sobie na spacji i ustawimy firstName i lastName w taki oto sposób,

0:49więc jeżeli bym teraz napisał person setFullName,

0:53to musiałbym tutaj podać na przykład Jan Nowak. Zostanie

0:57to rozbite na spacji i ustawione i teraz getFullName zwróci mi Jan Nowak. Oczywiście

1:02w każdej chwili mogę też się odwołać do tych poszczególnych właściwości. Natomiast

1:06mamy w ES5 coś takiego, co nazywa się getter'em lub setter'em i

1:10teraz chciałbym tak je tutaj dodać. Więc to sobie będę chciał

1:14wykomentować, może skopiuję tylko to, co jest wewnątrz i jeżeli wcześniej nie widziałeś setter'ów,

1:18to może to dziwnie wyglądać. Natomiast w dowolnym takim obiekcie możemy napisać get

1:23lub set, do czego za moment przejdziemy getFullName.

1:28Nie chcę, żeby to się nazywało getFullName, tylko samo fullName, a kiedyget jest to

1:32specjalne słowo i tutaj nie przypisujemy wtedy funkcji w ten sposób, tylko w

1:36taki sposób podobny jak w ES6, czyli taki skrócony, ale to było dostępne

1:40już w EcmaScript 5 i będę chciał zwrócić firstName i lastName i

1:44teraz co to oznacza. Czy to znaczy, że będę miał metodę fullName, sprawdźmy, person fullName. Okaże

1:53się, że to generuje błąd. Gettery działają tak, że chociaż utworzyliśmy

1:57sobie funkcję, to ona jest wywoływana za każdym razem gdy ktoś próbuje

2:01odwołać się do właściwości o nazwie fullName. Czyli jeżeli ktoś napisze person

2:06fullName, normalnie jak właściwość, to zostanie wywołana nasza

2:10funkcja getter'a, czyli widzisz, że jest to funkcja, bo mogę tutaj zrobić co chcę i coś

2:14zwrócić, ale używa się jej jak właściwości, czyli dla kogoś wygląda

2:18to jak zwykły właściwość obiektu i teraz mamy jeszcze setter'y. Setter się

2:22wykona wtedy, kiedy ktoś napisze fullName i będzie chciał przypisać nową

2:26wartość. Na przykład Jan Kowalski. Zobaczmy czy to się uda. Zróbmy

2:31teraz fullName. Jak widzisz nie wiemy czy się udało, bo przypisałem

2:35taką samą wartość. Przypiszmy sobie Jan Nowak, okej.

2:40I teraz pobierzmy sobie full name, mamy Jan Kowalski, czyli nic się nie wydarzyło. Nie

2:44udało się tego nadpisać, więc utwórzmy sobie teraz setter. Robimy

2:48to za pomocą słowa set i nazwa będzie taka sama. Natomiast tutaj

2:52otrzymamy to, co ktoś przypisze, czyli w momencie kiedy ktoś napisze fullName równa

2:56się Jan Nowak. To to co jest w tym miejscu otrzymamy pod parametrem tutaj, więc napiszmy,

3:01że jest to fullName i będziemy

3:05chcieli zrobić to samo co mieliśmy tutaj, czyli rozbić to sobie na spacji i ustawić

3:10i teraz utworzyliśmy sobie setter, więc jeżeli ktoś by chciał napisać

3:14fullName Jan Nowak, a później go pobrać, to widzimy, że ono

3:18rzeczywiście zostało zmienione. Tylko teraz jaki jest minus tych getterów

3:22i setterów względem tego co zobaczysz w lekcji kolejnej. Mianowicie nie możemy

3:27jakby dynamicznie sobie sprawdzić co ktoś napisał. Czyli

3:31ja musiałem z góry powiedzieć, że jeżeli ktoś napisze kropka fullName jako właściwość. Wykonaj

3:35tę funkcję. Jeżeli napisze kropka fullName równa się i przybliżoną wartość,

3:40wykonaj tę funkcję, ale nie mogę zrobić czegoś takiego, że jeżeli ktoś napisze

3:44person i na przykład age równa się 20, to żebym ja mógł

3:48to przechwycić,  czyli chciałbym mieć taką możliwość, że jeżeli ktoś napisze person kropka

3:52cokolwiek, to chciałbym to cokolwiek móc sobie jakoś sprawdzić i tego

3:56w ES5 zrobić nie mogliśmy, ale będziemy mogli to zrobić w EcmaScript 6 za

4:00pomocą tak zwanego Proxy API i o tym powiemy sobie w lekcji kolejnej.