EcmaScript 6: Tworzenie Symboli

0:00Do języka JavaScript w wersji ES6 został dodany nowy typ

0:04prymitywny, czyli symbole. Wcześniej mieliśmy kilka typów prymitywnych i był

0:08to na przykład number, boolean, string czy powiedzmy undefined

0:13i null. Natomiast teraz mamy jeszcze kolejny typy prymitywne jakim jest

0:17symbol i teraz, jak to wygląda i do czego służy, już będę chciał ci pokazać.

0:21Od razu sobie przejdziemy do kodu i będę chciał utworzyć stałą

0:26o nazwie hidden i tutaj wywołam sobie symbol, w taki oto sposób. Mamy

0:30funkcje symbol, której możemy przekazać string, ale nie musimy. Jeżeli

0:34przekażemy, to potem będziemy mogli za pomocą tego string'u na przykład sobie zdebug'ować, o

0:39który symbol chodzi, więc może sobie go podajmy i ja napiszę ściśle tajne

0:43i teraz

0:48będę chciał ci w konsoli pokazać co znajduje się pod hidden, czyli co nam zwróciło symbol.

0:52Przejdźmy sobie tutaj i napisz mi hidden. Okaże się, że taka

0:56reprezentacja została zwrócona, czyli symbol i ten string, który podałem. Ale jeżeli skorzystamy

1:01z operatora typeof na hidden, to zostanie zwrócone

1:05symbol i to nam mówi, że jest to nowy typ prymitywny, taki jak na przykład number czy

1:09string i teraz do czego są symbole i co one robią. Otóż wywołanie

1:13symbol, nieważne co mu tutaj przekażemy, nawet gdybym drugi raz sobie zrobił

1:17coś takiego, zwróci nam można powiedzieć unikalny obiekt,

1:22ale nie jest to obiekt, bo jest to typ prymitywny i najlepsze w tym jest to, że my nie

1:26możemy sprawdzić co on tak naprawdę zwraca i czym jest ta wartość. Natomiast mamy stuprocentową

1:31pewność, że ta wartość za każdym razem będzie unikalna. Nawet jeżeli dwa razy

1:35wpiszę ten sam string, pamiętaj, że on służy głównie do debugowania, żeby sprawdzić czego

1:39dotyczy dany symbol, czyli symbol jest to jakaś wartość

1:43nie wiemy jaka, ale wiemy że ona na pewno jest unikalna, czyli pod hidden i hidden2

1:48mam teraz dwie unikalne wartości i coś mogę z nimi zrobić. No i teraz

1:52dobre pytanie, co będziemy chcieli z nimi zrobić. Jedną z nich usunę i

1:56utworze sobie teraz obiekt Person. Za moment zobaczysz,

2:00jak wszystko zaczyna nam się łączyć w pewną całość, czyli te rzeczy, które poznałeś do tej pory.

2:04Chciałbym w tym obiekcie utworzyć sobie, można powiedzieć właściwość, której

2:08nikt nie będzie widział. Gdybym napisał hidden i tutaj bym sobie napisał jakiś taki string,

2:13powiedzmy służący do szyfrowania czegoś, niech on wygląda w taki sposób. To

2:20co by to oznaczało. Oznaczałoby tylko tyle, to hidden

2:24nie ma nic wspólnego z tym, że mogę sobie w konsoli zobaczyć pod

2:29Person, oczywiście hidden. Natomiast chciałbym sobie dodać właściwość, która nie będzie

2:33widoczna, przynajmniej na pierwszy rzut oka i pamiętasz, że mogliśmy

2:37sobie dodawać wyliczone właściwości i robiło się to w taki sposób, że tutaj stawialiśmy

2:42zapis taki jakby tablicowy i tutaj mogliśmy sobie wpisać na przykład jakiś string,

2:46do którego można było coś dodać i tak dalej i w tym miejscu można podstawić

2:50symbol. Wciąż nie wiemy jaką wartością jest symbol, co to w ogóle jest. I tego

2:54się nie dowiemy, ale możemy jako symbol wstawić go tutaj do

2:59takiej wyliczonej właściwości, i to sprawi, że jeżeli teraz zapisze i podejrzymy sobie

3:04person, to będziemy mieli object, gdzie mamy symbol ściśle tajne,

3:08ale on chociaż tutaj jest widoczny, to nie będzie widoczny przy, na przykład,

3:13pętli for in. Nie pokazałem ci przed momentem tej pętli for in, ale teraz

3:17gdybyśmy sobie ją zrobili, na przykład, key in Person,

3:21console.log, to zobaczysz, że

3:25nic nam się nie pojawi dlatego, że symbol jest jakby ukryty. To nie

3:29sprawia, że możemy zrobić jakąś prywatną w stu procentach właściwość, co przed momentem widziałeś

3:34dlatego, że w lekcji kolejnej zobaczysz metody, które służą do wyszukiwania symboli

3:38w jakichś obiektach. Natomiast symbol, to jest jakaś unikalna wartość, która pozwoli

3:42nam w ten sposób coś można powiedzieć nawet nie tyle ukryć, co

3:46zapisać wewnątrz. Tylko teraz pytanie brzmi jak mogę się do tego string'u

3:50odwołać i mogę się do niego odwołać wyłącznie mając referencje do

3:55tego co mi zwrócił symbol, czyli gdybym teraz chciał sobie tutaj wyświetlić

3:59ten hidden musiałbym napisać console.log person i przekazać

4:03dokładnie to, co mam pod zmienną hidden, czyli jest to jakaś wartość, którą jeśli tutaj przekażę,

4:07to zostanie mi zwrócony ten ciąg. Zobaczmy, tak też się stało

4:12i wiem, że na początku wydaje się, że jest to coś co jest mało potrzebne,

4:16ale za moment zobaczysz jeszcze bardziej praktyczne tego przykłady. Stworzymy

4:20sobie teraz przykład z klasą. Wkleje sobie klasę, którą już

4:25kilkukrotnie widzieliśmy. Okej,

4:30mamy jakiś konstruktor i mamy metodę sayHello i teraz pytanie brzmi, gdybyśmy

4:35chcieli wydać sobie do klasy jakieś metody prywatne, czyli takie, które nie będą

4:39widoczne na obiekcie, który utworzymy. Gdybym teraz utworzył person1 new Person

4:46i podał Jan Kowalski. W konsoli

4:50byśmy sobie zrobili person1 sayHello. Wszystko

4:56jest okej, natomiast gdybym chciał tutaj utworzyć metodę prywatną wciąż JavaScript nam na to

5:00nie pozwala, czyli taką do której person1 kropka nie miałoby

5:05dostępu. To jak możemy to zrobić. W stu procentach takiej prywatności tutaj

5:09nie uzyskamy, ale moglibyśmy sobie utworzyć symbol z użyciem const i

5:13też odpowiem ci na pytanie dlaczego skorzystałem z const. Dlatego, że

5:17mam stuprocentową pewność, że nikt mi tej wartości nie nadpiszę, bo const na to nie pozwala,

5:21a więc zawsze będę miał na niej dostęp, ale utworzmy sobie z użyciem const

5:25symbol, któremu jako string podam tutaj

5:29na przykład format. Mogę podać co chcę, więc podam sobie, że jest to metoda format

5:34i oczywiście muszę tutaj nadać nazwę. Z wielkich liter może sobie napiszę

5:38format i teraz okazuje się, że w klasach też możemy korzystać z wyliczonych

5:43właściwości, a więc podobnie jak w obiektach i w klasach możemy właściwość

5:48nazwać sobie za pomocą dynamicznej na przykład jakieś zmiennej. Czyli znowu mógłbym

5:52tutaj wpisać jakiś string czy podstawić jakąś zmienną. Podstawie sobie symbol

5:56format, w ten sposób i sprawie,

6:00że będzie to metoda, w taki oto sposób i chciałbym, żeby ta metoda przyjmowała

6:05sobie na przykład jakiś string tekst i żeby zamieniała go na wielkie

6:09litery, czyli return textToUppercase. No i ja chcę,

6:13żeby ona była prywatna, a to oznacza, że kiedy odwołam się do person kropka to

6:17żebym nie mógł się tutaj odwołać do tej metody i teraz

6:21z niej będę chciał skorzystać tutaj. Ona została podana na prototypie i tutaj

6:25mogę się poprzez this do niej odwołać, ale właśnie, muszę mieć odwołanie do symbolu,

6:30czyli muszę napisać this format, wywołać ją przekazując

6:34jej cały ten string. Zobaczmy czy nam to zadziała. Jak

6:39widzisz mamy z wielkich liter Jan Kowalski, czyli teoretycznie utworzyliśmy sobie metodę prywatną.

6:43W tym akurat konkretnym przypadku, gdzie wszystko mamy w jednym pliku, to

6:47mógłbym na person1 do niej się odwołać, bo mógłbym sobie napisać coś takiego jak

6:52na przykład person1. Podałbym ten symbol,

6:57czyli format i miałbym dostęp do tej metody. Natomiast

7:01normalnie ja do tego symbolu nie będę miał dostępu, w tym kursie jeszcze dowiesz się czym są

7:05moduły w ES6 i wyobraź sobie na szybko, że to co tutaj widzisz

7:09do tego momentu do tej linii, czyli tylko to, to będzie w

7:13jakimś jednym pliku w jednym module, więc utworzymy sobie format, taki oto

7:17symbol i wewnątrz te metody tej klasy będą miały do niego dostęp, a więc

7:21dzięki niemu również to takie metody prywatnej i teraz

7:25na końcu takiego modułu, co jeszcze w tym kursie zobaczysz, można taką klasę wyeksportować

7:29i można ją później, to wyglądało by tak, powiedzmy i w innej,

7:36w innym module można ją zaimportować i dopiero w innym module gdzie ją importujemy, za

7:40jej pomocą tworzylibyśmy byśmy new Person, czyli w zupełnie innym module. Ja nie będę miał

7:44odwołania do tej stałej, a więc nie mógłbym napisać tego co pokazałem przed momentem, czyli person1,

7:49format. W ten sposób stworzyliśmy sobie swego rodzaju prywatność, bo

7:53tylko jakby ta klasa ma dostęp do tej stałej, bo

7:57jest zdefiniowana w tym samym zakresie. Tak jak wspomniałem musiałoby to być osobnych modułach.

8:02W tej lekcji zatem to już wszystko. Zobaczyłeś jak utworzyć symbol i

8:06zapamiętaj tyle, że każdy nowo utworzony symbol zawsze będzie w stu procentach indywidualny,

8:11czyli jeżeli dodamy sobie do jakiegoś obiektu coś pod symbolem, nawet jeżeli to nie jest ukryte. Co

8:15prawda nie pojawia się w pętli na przykład for in, nie jest ukryte, ale nikt nam tego nie nadpisze,

8:19bo gdybyśmy chcieli zasymulować symbol, to teoretycznie moglibyśmy tutaj napisać

8:24jakieś całkowicie randomowe rzeczy i pod tym sobie to przepisać, też

8:28działałoby nam tak samo, ale ktoś teoretycznie przez przypadek do naszego obiektu, mógłby

8:33dodać sobie również dokładnie takie same rzeczy i nam to nadpisać. Natomiast

8:37nie może tego zrobić jeżeli korzystamy w symbolu, dlatego może wrócę tutaj

8:41do tego zapisu i w ten sposób to pozostawie. W przypadku klas, jak widzisz, jest

8:45to już nieco bardziej przydatne, bo stworzyłem metody, które nie będą widoczne na obiekcie

8:49na przykład person1, bo musielibyśmy mieć dostęp do symbolu.