1
00:00:01,180 --> 00:00:03,578
Znacie podstawy języka JavaScript.

2
00:00:03,679 --> 00:00:05,735
Pokażę wam fajne zastosowanie.

3
00:00:05,835 --> 00:00:08,765
Tzw. programowanie obiektowe.

4
00:00:09,485 --> 00:00:12,392
Zacznijmy od tego,
czemu to jest przydatne.

5
00:00:12,492 --> 00:00:17,322
Mam program, który ulepszymy
za pomocą obiektów.

6
00:00:17,422 --> 00:00:19,502
Teraz też jest niezły!

7
00:00:19,602 --> 00:00:24,094
Dwie zmienne, u góry,
przechowują literały.

8
00:00:25,087 --> 00:00:28,305
Literał to obiekt, który już znamy:

9
00:00:28,405 --> 00:00:33,111
w klamrach wpisujemy nazwy
właściwości oraz wartości.

10
00:00:34,292 --> 00:00:38,999
Tu mamy dwie zmienne z literałami,
a tu - funkcję „drawWinston”,

11
00:00:39,099 --> 00:00:41,006
przyjmującą jeden argument.

12
00:00:41,106 --> 00:00:45,836
Funkcja rysuje obraz
z uwzględnieniem „x” i „y”

13
00:00:45,936 --> 00:00:47,647
oraz właściwości obiektu;

14
00:00:47,747 --> 00:00:52,103
wyświetla też podpis
z przydomkiem i wiekiem.

15
00:00:52,918 --> 00:00:57,864
U dołu mamy funkcję „drawWinston”
dla wieku nastoletniego i dorosłego.

16
00:00:57,964 --> 00:01:00,905
Dlatego pokazuje się obraz.

17
00:01:01,005 --> 00:01:05,991
Super! Przyglądając się literałom,

18
00:01:06,091 --> 00:01:11,116
zauważymy ich podobieństwo.

19
00:01:11,216 --> 00:01:13,909
Mają te same właściwości

20
00:01:14,009 --> 00:01:17,601
i w obu może działać
ta sama funkcja „drawWinston”.

21
00:01:17,701 --> 00:01:21,631
Zastanówmy się:
każdy literał opisuje

22
00:01:21,731 --> 00:01:23,429
jakiś rodzaj Winstona.

23
00:01:23,529 --> 00:01:28,514
Jakby na świecie istniał
abstrakcyjny typ Winstona,

24
00:01:28,614 --> 00:01:31,579
zatem każdy Winston
miałby te same właściwości

25
00:01:31,679 --> 00:01:35,828
(przydomek, wiek,
współrzędne „x” i „y”)...

26
00:01:36,386 --> 00:01:41,889
A my tu stworzyliśmy
tylko dwie instancje Winstona,

27
00:01:41,989 --> 00:01:44,990
by opisać go
w szczególnej sytuacji.

28
00:01:45,090 --> 00:01:48,065
Ten jest nastolatkiem,
a ten - dorosłym.

29
00:01:48,165 --> 00:01:51,455
Są podobni do siebie.

30
00:01:51,555 --> 00:01:54,660
Bardzo wiele ich łączy.

31
00:01:54,760 --> 00:01:57,453
Tak zresztą działa świat.

32
00:01:57,553 --> 00:02:01,066
Istnieją abstrakcyjne
typy danych, np. ludzie,

33
00:02:01,166 --> 00:02:05,626
a każdy z nas jest instancją,
z własnymi cechami.

34
00:02:05,726 --> 00:02:10,078
W JavaScript możemy używać
technik obiektowych,

35
00:02:10,178 --> 00:02:14,606
żeby te zmienne z Winstonem

36
00:02:14,706 --> 00:02:17,751
były instancjami obiektu „Winston”,

37
00:02:17,851 --> 00:02:21,664
i wiedziały,
że mają wspólne cechy.

38
00:02:21,764 --> 00:02:24,073
Aby tak było, musimy...

39
00:02:24,173 --> 00:02:27,818
opisać ten abstrakcyjny
typ danych - „Winstona”.

40
00:02:27,918 --> 00:02:32,578
W tym celu określimy zmienną,
by przechowywać w niej dane.

41
00:02:32,678 --> 00:02:35,759
Piszę więc: „var Winston”,
przez wielkie „W”

42
00:02:35,859 --> 00:02:38,743
(nazwy obiektów
zaczynamy od wielkiej litery).

43
00:02:38,843 --> 00:02:41,030
I piszemy, że jest to równe funkcji.

44
00:02:42,115 --> 00:02:46,649
To funkcja specjalna,
zwana konstruktorem.

45
00:02:46,763 --> 00:02:49,702
Zostanie przywołana zawsze,
gdy będziemy chcieli

46
00:02:49,802 --> 00:02:51,821
stworzyć nową instancję Winstona.

47
00:02:51,921 --> 00:02:54,288
Chcąc stworzyć Winstona
nastoletniego

48
00:02:54,388 --> 00:02:57,737
albo dorosłego,
przywołamy tę funkcję.

49
00:02:57,837 --> 00:03:00,767
Będzie ona przyjmować

50
00:03:00,867 --> 00:03:03,623
argumenty, których potrzebuje,

51
00:03:03,723 --> 00:03:06,200
by stworzyć pełnego Winstona.

52
00:03:06,300 --> 00:03:10,171
W tym przypadku to przydomek,
wiek, „x” i „y”.

53
00:03:11,233 --> 00:03:15,024
Skoro przyjęliśmy te argumenty,
musimy coś z nimi zrobić.

54
00:03:15,124 --> 00:03:17,787
Trzeba przypisać

55
00:03:17,887 --> 00:03:21,200
te informacje do obiektu „Winston”.

56
00:03:21,434 --> 00:03:24,776
Użyjemy nowego specjalnego
hasła, zwanego „this” (to).

57
00:03:25,536 --> 00:03:28,406
Będzie się odnosić
do bieżącej instancji obiektu.

58
00:03:28,506 --> 00:03:30,813
Napiszemy: „this.nickname”,

59
00:03:30,913 --> 00:03:34,714
co będzie znaczyć, że właściwość
przydomka obiektu jest równa...

60
00:03:34,814 --> 00:03:38,244
temu, co poda
funkcja konstruktor. OK?

61
00:03:38,344 --> 00:03:41,259
A „this.age” jest równe
wprowadzonemu wiekowi;

62
00:03:41,359 --> 00:03:44,676
„this.x” równa się
wprowadzonemu „x”, a „y”...

63
00:03:45,807 --> 00:03:48,252
równa się wprowadzonemu „y”.

64
00:03:48,352 --> 00:03:52,948
Mamy abstrakcyjny typ danych,
który nazwaliśmy Winstonem,

65
00:03:53,048 --> 00:03:56,634
a z pomocą konstruktora
możemy stworzyć nowego Winstona.

66
00:03:57,497 --> 00:04:00,187
Spróbujmy z tego skorzystać.

67
00:04:00,287 --> 00:04:05,063
Znów robimy nastoletniego Winstona.
Powiemy, że jest on równy...

68
00:04:05,163 --> 00:04:07,153
Zamiast wstawiać klamry,

69
00:04:07,253 --> 00:04:10,141
powiemy, że jest równy
nowemu Winstonowi.

70
00:04:10,241 --> 00:04:13,770
Czyli staramy się stworzyć
nową instancję Winstona.

71
00:04:13,870 --> 00:04:17,300
Wprowadzamy potrzebne informacje:
„winstonTeen”,

72
00:04:17,399 --> 00:04:21,293
15, 20, 50. W porządku?

73
00:04:22,276 --> 00:04:25,752
Stary fragment możemy skasować.
Jest już niepotrzebny.

74
00:04:27,284 --> 00:04:30,786
Stworzyliśmy nowego Winstona.

75
00:04:30,886 --> 00:04:34,970
Powiemy, że Dorosły Winston
równa się Nowemu Winstonowi.

76
00:04:35,070 --> 00:04:37,617
Nazywa się Pan Wygrany,

77
00:04:37,717 --> 00:04:39,127
ładnie!

78
00:04:39,227 --> 00:04:43,237
Ma 30 lat i znajduje się
na 229 i 50.

79
00:04:43,933 --> 00:04:47,207
Możemy skasować literał.

80
00:04:47,307 --> 00:04:50,063
Hura! Nasz program działa!

81
00:04:50,729 --> 00:04:54,243
Powiedzieliśmy tutaj:

82
00:04:54,343 --> 00:04:57,656
mamy abstrakcyjny
typ danych, Winstona,

83
00:04:57,756 --> 00:05:00,403
i możemy tworzyć nowe instancje

84
00:05:00,503 --> 00:05:04,251
z wyjątkowymi właściwościami.

85
00:05:04,351 --> 00:05:08,639
Przypomnijmy sobie
właściwości w nich zawarte.

86
00:05:08,739 --> 00:05:10,613
Trzeba o nich pamiętać.

87
00:05:10,713 --> 00:05:14,130
Mamy tu „this.nickname”
i „this.age”.

88
00:05:14,230 --> 00:05:17,596
Gdyby nie było „this.age”,

89
00:05:17,696 --> 00:05:19,970
spójrzcie: wyskakuje „nieokreślone”.

90
00:05:20,070 --> 00:05:22,780
Bo tutaj, wewnątrz
funkcji „drawWinston”,

91
00:05:22,880 --> 00:05:28,005
każdy wprowadzony obiekt
powinien mieć właściwość wieku.

92
00:05:28,105 --> 00:05:30,512
Gdybyśmy nie powiedzieli
„this.age”,

93
00:05:30,612 --> 00:05:32,486
nie byłoby właściwości wieku.

94
00:05:32,586 --> 00:05:35,481
Wpisaliśmy to do konstruktora
i nic nie zrobiliśmy.

95
00:05:35,581 --> 00:05:39,359
Musimy przypisać wiek do obiektu
używając hasła „this”.

96
00:05:39,459 --> 00:05:41,170
Dodajmy to z powrotem.

97
00:05:41,270 --> 00:05:46,255
Pomyślicie: „Jasne, twój program
śmiga, robisz niezłe rzeczy...

98
00:05:46,355 --> 00:05:50,505
ale to wszystko dałoby się
osiągnąć starymi metodami”.

99
00:05:50,605 --> 00:05:52,386
Teraz będzie fajnie.

100
00:05:52,486 --> 00:05:55,770
Każdy Winston przechodzi
przez tego samego konstruktora.

101
00:05:55,870 --> 00:06:00,814
Gdybyśmy chcieli, możemy zmienić
to i owo o Winstonie.

102
00:06:00,914 --> 00:06:03,043
O wszystkich Winstonach tutaj.

103
00:06:03,143 --> 00:06:05,830
Przy wieku napiszemy „ile lat”.

104
00:06:05,930 --> 00:06:07,618
Umieszczamy to tu

105
00:06:07,718 --> 00:06:12,424
i każdy Winston mówi:
„15 lat”, „30 lat” itd.

106
00:06:12,524 --> 00:06:14,866
To jego specyfika,

107
00:06:14,966 --> 00:06:17,231
ale instancje mają też
cechy wspólne.

108
00:06:17,331 --> 00:06:20,764
Świetne w programowaniu
obiektowym jest to...

109
00:06:20,864 --> 00:06:22,757
że istnieją rodzaje obiektów,

110
00:06:22,857 --> 00:06:26,287
a my możemy tworzyć
ich instancje.

111
00:06:26,387 --> 00:06:29,700
Czasami są podobne,
np. mają te same własciwości,

112
00:06:29,800 --> 00:06:34,739
ale są też różnice, np. „ta właściwość
przybiera inną wartość niż ta druga”.

113
00:06:35,528 --> 00:06:38,992
Możemy jednak zrobić to samo,

114
00:06:39,092 --> 00:06:43,168
przywołać te same funkcje
i użyć ich w podobny sposób.

115
00:06:43,268 --> 00:06:45,908
To są zalety
programowania obiektowego,

116
00:06:46,008 --> 00:06:48,485
ale zobaczycie: można więcej!

117
00:06:48,585 --> 00:06:50,017
Oglądajcie dalej!