1
00:00:00,000 --> 00:00:03,840
>> [MUSIC JOC]

2
00:00:03,840 --> 00:00:05,770

3
00:00:05,770 --> 00:00:08,690
>> DOUG LLOYD: Deci până acum suntem vechi
Pro de la programare web, nu?

4
00:00:08,690 --> 00:00:12,140
Și am acoperit mai multe
Limbile în videoclipuri individuale.

5
00:00:12,140 --> 00:00:14,690
Și acum să facem o mai, JavaScript.

6
00:00:14,690 --> 00:00:17,370
>> În primul rând o veste bună, JavaScript
este un moderne de programare

7
00:00:17,370 --> 00:00:21,410
Limba de mult ca PHP, acesta
Sintaxa este derivat din C,

8
00:00:21,410 --> 00:00:22,830
așa că e un loc bun pentru a începe.

9
00:00:22,830 --> 00:00:25,880
Este vorba despre fel de vechi ca PHP, precum și,
au fost în jur de aproximativ 20 de ani.

10
00:00:25,880 --> 00:00:28,600
Acesta a fost inventat în jurul
în același timp cu PHP.

11
00:00:28,600 --> 00:00:32,240
Și este, de fapt destul de activarea JavaScript-
fundamentală pentru experiența utilizatorului

12
00:00:32,240 --> 00:00:32,740
de pe web.

13
00:00:32,740 --> 00:00:34,448
De fapt, există
trei limbi pe care am

14
00:00:34,448 --> 00:00:38,480
ar spune un fel de a face până
experiența utilizatorului de a interactiona

15
00:00:38,480 --> 00:00:42,650
cu site-ul, html,
CSS, JavaScript și.

16
00:00:42,650 --> 00:00:46,030
Și așa acum hai sa vorbim un
pic despre JavaScript.

17
00:00:46,030 --> 00:00:50,301
>> Vestea proastă, deși, cu JavaScript este
că stabilește o mulțime de reguli de la sine,

18
00:00:50,301 --> 00:00:51,300
și apoi le sparge.

19
00:00:51,300 --> 00:00:54,010
Și JavaScript poate fi de fapt
un fel de provocatoare pentru a învăța,

20
00:00:54,010 --> 00:00:57,000
pentru că este, spre deosebire de C și
PHP, care sunt foarte structurate

21
00:00:57,000 --> 00:01:00,270
și au reguli foarte rigide
pentru modul în care lucrurile pot funcționa.

22
00:01:00,270 --> 00:01:03,690
JavaScript are un fel
de ajuns atât de flexibil

23
00:01:03,690 --> 00:01:06,650
că poate lucrurile nu sunt de gând să
de lucru modul în care le așteptăm să,

24
00:01:06,650 --> 00:01:09,830
și poate că într-adevăr nu se poate învăța
primul nostru limbaj de programare

25
00:01:09,830 --> 00:01:10,769
ca JavaScript.

26
00:01:10,769 --> 00:01:12,810
Deci, poate că nu
stabilit reguli,

27
00:01:12,810 --> 00:01:15,754
și nu prea
impune obiceiuri bune de codificare.

28
00:01:15,754 --> 00:01:18,170
Dar acum ne-am dezvoltat, sperăm
unele obiceiuri bune de codificare,

29
00:01:18,170 --> 00:01:21,470
si astfel încât să putem începe să incursiune
într-un pic de activarea JavaScript-.

30
00:01:21,470 --> 00:01:25,750
>> Pentru a scrie JavaScript, similar cu deschidere
un fișier cu o extensie C punct C

31
00:01:25,750 --> 00:01:29,770
sau un fișier PHP cu o extensie punct PHP,
tot ce trebuie să faceți este să deschideți un fișier

32
00:01:29,770 --> 00:01:31,764
cu extensie de fișier punctul js.

33
00:01:31,764 --> 00:01:34,430
Noi nu trebuie să aibă nici o speciale
delimitatori cum am făcut în PHP.

34
00:01:34,430 --> 00:01:36,750
Acest tip de unghi
Suport semn de întrebare PHP

35
00:01:36,750 --> 00:01:40,300
că suntem obișnuiți să de faptul că, așa cum
spunem browser-ul nostru că ceea ce avem este

36
00:01:40,300 --> 00:01:43,502
JavaScript este prin includerea
o într-un tag html,

37
00:01:43,502 --> 00:01:46,210
si vom vedea un pic despre
cum se face că într-o clipă.

38
00:01:46,210 --> 00:01:48,210
>> Un alt lucru care face
JavaScript diferite,

39
00:01:48,210 --> 00:01:50,580
însă, este faptul că se execută partea de client.

40
00:01:50,580 --> 00:01:53,430
Deci, amintesc cu PHP care
nu am putut vedea cu adevărat

41
00:01:53,430 --> 00:01:57,041
PHP care a subliniat un site web.

42
00:01:57,041 --> 00:01:59,040
Dacă vom vizualizat vreodată
sursă pagină, ne-ar numai

43
00:01:59,040 --> 00:02:02,830
vedea HTML care a fost
generate de faptul că PHP.

44
00:02:02,830 --> 00:02:04,900
Dar JavaScript ruleaza partea de client.

45
00:02:04,900 --> 00:02:06,710
JavaScript ruleaza pe computer.

46
00:02:06,710 --> 00:02:09,050
Și de aceea poți să faci
lucruri place adauga blocante.

47
00:02:09,050 --> 00:02:09,550
Dreapta?

48
00:02:09,550 --> 00:02:12,704
De blocare a anunțurilor se face de obicei de
uciderea tuturor de JavaScript

49
00:02:12,704 --> 00:02:14,370
care se execută pe un anumit site.

50
00:02:14,370 --> 00:02:19,000
Și pentru că aceasta ar trebui să
rula pe partea de client de mașini,

51
00:02:19,000 --> 00:02:21,910
Puteți opri doar
JavaScript pentru a rula în întregime.

52
00:02:21,910 --> 00:02:27,030
Asta înseamnă, de asemenea, că atunci când folosiți
un site web care include JavaScript,

53
00:02:27,030 --> 00:02:32,450
trebuie să trimiteți sursa JavaScript
Codul, ca parte a răspunsului dumneavoastră http

54
00:02:32,450 --> 00:02:34,159
clientului, atunci când îl solicită.

55
00:02:34,159 --> 00:02:35,950
Și așa s-ar putea să nu
doriți să utilizați JavaScript

56
00:02:35,950 --> 00:02:38,395
de a face lucruri cu adevărat sensibile
cum ar fi informațiile care trece

57
00:02:38,395 --> 00:02:41,020
despre parolele utilizatorilor spate și
mai departe, pentru că sunt de fapt

58
00:02:41,020 --> 00:02:45,610
va primi toate codul sursă,
nu doar HTML care este generat,

59
00:02:45,610 --> 00:02:49,030
cum ar fi ar fi cazul cu spune PHP.

60
00:02:49,030 --> 00:02:51,620
>> Deci, cum putem să includă JavaScript
în html noastră pentru a începe cu?

61
00:02:51,620 --> 00:02:54,520
Ei bine, similar cu CSS, de fapt,
este un fel de modul în care o facem aici.

62
00:02:54,520 --> 00:02:56,190
Cu CSS avem etichete de stil.

63
00:02:56,190 --> 00:03:00,760
Și în interiorul acestor tag-uri de stil,
putem defini o foaie de stil CSS.

64
00:03:00,760 --> 00:03:03,450
În mod similar cu JavaScript
putem deschide tag-uri script,

65
00:03:03,450 --> 00:03:06,660
un alt tag html nu am
vorbesc despre în videoclipul nostru html,

66
00:03:06,660 --> 00:03:09,720
și scrie JavaScript în
între aceste tag-uri script-ul.

67
00:03:09,720 --> 00:03:13,960
De asemenea, deși, cum ar fi CSS, am
ar putea lega în afara fișiere CSS

68
00:03:13,960 --> 00:03:15,900
și trageți-le în programul nostru în acest fel.

69
00:03:15,900 --> 00:03:18,280
Cu CSS putem, de asemenea,,
scuză-mă, cu JavaScript

70
00:03:18,280 --> 00:03:23,240
putem specifica, de asemenea, sursa
atribut al tag-ul script-ul

71
00:03:23,240 --> 00:03:25,720
pentru a lega în JavaScript
separat, astfel încât să nu

72
00:03:25,720 --> 00:03:27,680
trebuie să-l scrie în
între tag-uri script, am

73
00:03:27,680 --> 00:03:29,600
poate lega în utilizarea
că tag-ul script-ul, de asemenea.

74
00:03:29,600 --> 00:03:33,230
Și, la fel ca și cu cazul în care CSS
am recomandat că a fost, probabil,

75
00:03:33,230 --> 00:03:36,090
în interesul dumneavoastră pentru a scrie
CSS-ul într-un fișier separat în cazul în care

76
00:03:36,090 --> 00:03:38,500
aveți nevoie să-l schimbe,
face în mod similar, vă recomandăm

77
00:03:38,500 --> 00:03:40,720
pe care le scrie dvs.
JavaScript în fișiere separate

78
00:03:40,720 --> 00:03:45,460
și de a folosi tag-uri script-ul sursa
atribuie lega JavaScript

79
00:03:45,460 --> 00:03:49,520
în HTML, pagina web.

80
00:03:49,520 --> 00:03:52,610
>> Variabile Deci JavaScript, vom
începem să vorbim despre sintaxa aici.

81
00:03:52,610 --> 00:03:53,600
Și vom trece prin
acest tip de rapid,

82
00:03:53,600 --> 00:03:56,640
pentru că am făcut acest lucru în PHP, astfel încât
acest lucru ar trebui să fie destul de familiar tuturor.

83
00:03:56,640 --> 00:03:59,490
Deci, variabile în JavaScript sunt
foarte asemănător cu PHP variabile.

84
00:03:59,490 --> 00:04:03,270
Nu e nici un tip specificator, și
atunci când introduce o variabilă,

85
00:04:03,270 --> 00:04:05,070
îl prefixul cu cuvântul cheie var.

86
00:04:05,070 --> 00:04:07,750
În PHP am face ceva
ca aceasta, semnul dolar X.

87
00:04:07,750 --> 00:04:09,950
Așa am indicat
o variabilă, dar nu, noi

88
00:04:09,950 --> 00:04:12,060
nu menționează tipul
variabilei deloc.

89
00:04:12,060 --> 00:04:15,124
Ne-ar spune ceva de genul
dolar semn X este egal cu 44 în PHP.

90
00:04:15,124 --> 00:04:17,040
Dacă am fost faci
același lucru în JavaScript,

91
00:04:17,040 --> 00:04:19,589
am spune var x este egal cu 44.

92
00:04:19,589 --> 00:04:22,780
Deci este un fel de var modul nostru
introducerii unei variabile.

93
00:04:22,780 --> 00:04:26,850
Asta e, probabil, un pic mai intuitiv
decât variabila semn dolar.

94
00:04:26,850 --> 00:04:29,080
>> Din nou, din moment ce nu exista nici
tipuri de date, am putea face acest lucru

95
00:04:29,080 --> 00:04:34,490
cu orice tip de date, siruri de caractere,
orice altceva ar fi toate var.

96
00:04:34,490 --> 00:04:37,260
Condiționale, toate noastre
prieteni vechi din C și PHP

97
00:04:37,260 --> 00:04:41,640
sunt încă disponibile, așa că avem în cazul în care,
altceva în cazul în care, altfel, comutator și întrebarea

98
00:04:41,640 --> 00:04:42,240
marca de colon.

99
00:04:42,240 --> 00:04:45,890
Comutator rămas la fel de flexibil ca aceasta
a fost în PHP, dar toate acestea te

100
00:04:45,890 --> 00:04:46,930
familiarizat cu de acum.

101
00:04:46,930 --> 00:04:49,900
Și în mod similar cu bucle sunt
favorite vechi de timp,

102
00:04:49,900 --> 00:04:52,700
face în timp, și pentru încă disponibile pentru noi.

103
00:04:52,700 --> 00:04:55,880
Deci, deja știm o mulțime de
de bază fel JavaScript fundamentelor

104
00:04:55,880 --> 00:05:01,800
doar în virtutea de a avea destul de un pic
de cunoștințe acum despre C și PHP.

105
00:05:01,800 --> 00:05:03,670
>> Ce zici de funcții în JavaScript?

106
00:05:03,670 --> 00:05:08,199
Ei bine, similar cu PHP fiecare funcție este
introdus cu cuvântul cheie funcția.

107
00:05:08,199 --> 00:05:10,740
Tu spui funcție, și apoi
începe să se definească funcția.

108
00:05:10,740 --> 00:05:12,531
Ce este un pic diferit
despre JavaScript,

109
00:05:12,531 --> 00:05:15,700
deși este capacitatea de a avea
ceea ce se numește o funcție anonim.

110
00:05:15,700 --> 00:05:18,880
Astfel încât să puteți defini funcții
care nu au un nume.

111
00:05:18,880 --> 00:05:21,222
Acest lucru este ceva ce
într-adevăr nu s-au mai văzut până acum.

112
00:05:21,222 --> 00:05:23,430
Vom folosi într-adevăr conceptul de
de o funcție anonim

113
00:05:23,430 --> 00:05:27,880
un pic mai târziu în acest
video, pentru că o să

114
00:05:27,880 --> 00:05:31,530
face un pic mai mult sens în contextul
atunci când vom vedea într-o situație particulară

115
00:05:31,530 --> 00:05:33,120
care l-am conceput aici.

116
00:05:33,120 --> 00:05:35,710
Dar să ia doar o privire
la ceea ce un simplu JavaScript

117
00:05:35,710 --> 00:05:37,850
Funcția ar putea arata ca.

118
00:05:37,850 --> 00:05:40,610
>> Așa că am mers mai departe și
deschis IDE mea CS50

119
00:05:40,610 --> 00:05:43,690
si am rulat deja Apache
pentru a începe de rulare serverul meu.

120
00:05:43,690 --> 00:05:46,800
Și am acest fișier
deschide numit home.html.

121
00:05:46,800 --> 00:05:48,330
Și voi mări un pic aici.

122
00:05:48,330 --> 00:05:52,090
Și, practic, puteți vedea
Home.html este doar o adunatura de butoane.

123
00:05:52,090 --> 00:05:55,291
Și mă susținând la partea de sus aici
că aceasta este secțiunea JavaScript

124
00:05:55,291 --> 00:05:55,790
Materiale.

125
00:05:55,790 --> 00:05:59,490
Deci, există o grămadă de butoane aici,
dar ce, de fapt fac aceste butoane?

126
00:05:59,490 --> 00:06:03,662
>> Ei bine, vom peste cap de la IED mea,
și am deschide home.html aici.

127
00:06:03,662 --> 00:06:05,620
De la bun început,
aici e unde am leagă

128
00:06:05,620 --> 00:06:07,500
în toate fișierele mele sursă JavaScript.

129
00:06:07,500 --> 00:06:08,000
Dreapta?

130
00:06:08,000 --> 00:06:12,440
Deci, am anonymous.js, clock.js,
Sunt folosind atributul sursă

131
00:06:12,440 --> 00:06:14,440
de tag-ul script-ul pentru a lega în fișierul.

132
00:06:14,440 --> 00:06:18,660
Deci, eu nu am scris nici un
JavaScript direct în acest fișier,

133
00:06:18,660 --> 00:06:21,790
dar am tras în toate
JavaScript Am scris separat.

134
00:06:21,790 --> 00:06:24,540
Și dacă vom derula aici, acest
ar trebui să arate toate familiar oarecum

135
00:06:24,540 --> 00:06:27,090
cu un pic de noi sintaxă.

136
00:06:27,090 --> 00:06:32,655
Avem aici tag header pentru
funcții și apoi pe un buton.

137
00:06:32,655 --> 00:06:35,530
Am o intrare care este un buton de tip,
și se pare atunci când am faceți clic pe el,

138
00:06:35,530 --> 00:06:38,130
Am de gând să sun unele
Funcția Data de alertă.

139
00:06:38,130 --> 00:06:41,792
Și acest lucru este modul în care putem fel de amesteca
un pic de JavaScript si HTML.

140
00:06:41,792 --> 00:06:44,500
Acestea joacă, de fapt destul de frumos
împreună, și așa pare când

141
00:06:44,500 --> 00:06:48,730
Dau click pe acest buton, am de gând
pentru a apela o dată de alertă funcție.

142
00:06:48,730 --> 00:06:53,660
Și au în mod similar am definit comportamente
pentru toate celelalte butoane care

143
00:06:53,660 --> 00:06:56,440
sunt pe acea pagină home.html,
pe care le vom păstra returnarea

144
00:06:56,440 --> 00:06:59,172
la timpul acestui film.

145
00:06:59,172 --> 00:07:00,880
Dar să ne întoarcem la
aici și să ia o privire

146
00:07:00,880 --> 00:07:03,850
la clock.js, care este
Fișier JavaScript pe care am

147
00:07:03,850 --> 00:07:07,370
a scris că are această primă funcție
vom arunca o privire la.

148
00:07:07,370 --> 00:07:11,630
După cum puteți vedea, încep JavaScript meu
funcționează cu funcția de cuvinte cheie,

149
00:07:11,630 --> 00:07:14,560
și am dat asta o
nume, se numește data de alertă.

150
00:07:14,560 --> 00:07:18,710
In interiorul acolo, am aparent crea o
nouă variabilă locală numită data curentă.

151
00:07:18,710 --> 00:07:21,500
Și am de gând să atribui
un egal cu o nouă dată.

152
00:07:21,500 --> 00:07:24,430
Și am putea obține într-o mulțime de
detaliu cu privire la ceea ce o dată este,

153
00:07:24,430 --> 00:07:27,060
și într-adevăr este atât de JavaScript
mare care nu putem, eventual,

154
00:07:27,060 --> 00:07:28,330
acoperi totul într-un singur film.

155
00:07:28,330 --> 00:07:32,220
Dar este suficient să spun, acest lucru se întâmplă
pentru a reveni la mine un articol de date care

156
00:07:32,220 --> 00:07:35,470
încapsulează data și ora curentă.

157
00:07:35,470 --> 00:07:39,100
Sunt stocarea că într-o variabilă care sunt
aparent va alerta data curentă.

158
00:07:39,100 --> 00:07:41,300
>> Ei bine, ceea ce face de alertă
Data aspectul actual ca?

159
00:07:41,300 --> 00:07:46,460
Să aruncăm o privire la fișierul în sine
înapoi peste în fereastra browser-ului.

160
00:07:46,460 --> 00:07:49,551
Deci, din nou, acest lucru este butonul pe care am
au legat de, această funcție pe nume.

161
00:07:49,551 --> 00:07:51,800
Si l-am faceți clic pe acolo și
uite ce a făcut, el a alertat.

162
00:07:51,800 --> 00:07:56,140
Acesta a apărut acest tip de cutie spune
mi că ora curentă este, aparent

163
00:07:56,140 --> 00:07:59,370
că la 4 noiembrie, la
10:43:43 dimineața.

164
00:07:59,370 --> 00:08:02,345
Și dacă l-am faceți clic din nou, acum
Este o câteva secunde mai târziu, nu?

165
00:08:02,345 --> 00:08:03,720
Deci asta e tot această funcție nu.

166
00:08:03,720 --> 00:08:07,670
Când m-am faceți clic pe acest buton, se
apare un mesaj de avertizare pentru mine.

167
00:08:07,670 --> 00:08:13,806

168
00:08:13,806 --> 00:08:15,690
Deci, există într-adevăr nu e
prea mult pentru a funcțiilor

169
00:08:15,690 --> 00:08:19,110
care este diferit de la PHP,
doar un pic de noi sintaxă

170
00:08:19,110 --> 00:08:22,500
care vine cu de lucru cu JavaScript.

171
00:08:22,500 --> 00:08:24,650
>> Matrice în JavaScript sunt
destul de simplă.

172
00:08:24,650 --> 00:08:27,200
Pentru a declara o matrice, utilizați
sintaxa paranteze drepte

173
00:08:27,200 --> 00:08:30,090
că suntem familiarizați cu de la PHP.

174
00:08:30,090 --> 00:08:33,432
Și similar cu PHP, am
De asemenea, se pot amesteca tipuri de date.

175
00:08:33,432 --> 00:08:35,140
Deci această matrice, atât
din aceste tablouri ar fi

176
00:08:35,140 --> 00:08:36,960
fi perfect legitimă JavaScript.

177
00:08:36,960 --> 00:08:42,500
Unul care este toate numere întregi, și una care
este amestecat diferite tipuri de date.

178
00:08:42,500 --> 00:08:45,020
>> Ce e ceva foarte diferit
în JavaScript, deși?

179
00:08:45,020 --> 00:08:47,020
Asta e ideea unui obiect.

180
00:08:47,020 --> 00:08:50,240
Asa ca, probabil ați auzit de
Programare orientata pe obiecte.

181
00:08:50,240 --> 00:08:53,370
Noi nu facem o mulțime de ea în CS50,
dar vom face un pic de ea

182
00:08:53,370 --> 00:08:55,670
aici, în contextul JavaScript.

183
00:08:55,670 --> 00:08:59,100
Acum JavaScript are capacitatea de a
se comporta ca un programării orientate pe obiecte

184
00:08:59,100 --> 00:09:02,615
limbă, dar nu este în sine
exclusiv orientate obiect

185
00:09:02,615 --> 00:09:03,490
limbaj de programare.

186
00:09:03,490 --> 00:09:05,281
Și aceasta vine din nou
Înapoi la ce am spus,

187
00:09:05,281 --> 00:09:10,610
poate fi foarte dificil de a învăța
JavaScript ca prima programare

188
00:09:10,610 --> 00:09:13,890
limbă, pentru că nu
se potrivesc într-adevăr un anumit paradigmă.

189
00:09:13,890 --> 00:09:16,430
>> C pe de altă parte este un
limbaj de programare funcțional.

190
00:09:16,430 --> 00:09:22,270
Dacă vrem să, funcții sunt
un fel de om seful mare, nu?

191
00:09:22,270 --> 00:09:24,410
Ei dictează ceea ce
se întâmplă orice altceva.

192
00:09:24,410 --> 00:09:26,600
Vrem să se schimbe variabilele,
numim funcții.

193
00:09:26,600 --> 00:09:28,220
Facem lucruri la funcții.

194
00:09:28,220 --> 00:09:31,250
Obiecte schimb, într-un
obiecții limbaj orientat,

195
00:09:31,250 --> 00:09:35,937
obiecte fel de a deveni vedeta și
Funcțiile devenit un fel de secundare.

196
00:09:35,937 --> 00:09:38,270
Dar ceea ce este un obiect, ceea ce
este această noțiune a unui obiect?

197
00:09:38,270 --> 00:09:40,880
Ei bine, în cazul în care vă ajută, cred că
cu privire la aceasta, la prima fel

198
00:09:40,880 --> 00:09:44,540
de ca o structură C sau o struct
că am învățat despre înainte.

199
00:09:44,540 --> 00:09:47,430
În C, o structură conține
o serie de domenii,

200
00:09:47,430 --> 00:09:51,174
și poate că acum ar putea începe să
numesc aceste proprietăți domenii.

201
00:09:51,174 --> 00:09:53,590
Dar proprietățile niciodată cu adevărat
sta pe cont propriu, nu?

202
00:09:53,590 --> 00:09:56,410
Dacă am defini o structură de o masina
ca acest lucru cu următoarele două

203
00:09:56,410 --> 00:10:00,750
câmpuri sau proprietăți, una o
întreg pentru anul masinii

204
00:10:00,750 --> 00:10:04,290
și un alt personaj 10 o
șir de modelul masinii,

205
00:10:04,290 --> 00:10:07,150
Pot spune ceva de genul asta,
Pot declara o nouă variabilă

206
00:10:07,150 --> 00:10:10,080
de tip Herbie masina struct.

207
00:10:10,080 --> 00:10:13,730
Și apoi pot spune ceva
ca este egal cu herbie.year 1963,

208
00:10:13,730 --> 00:10:15,850
și herbie.model egal Beetle.

209
00:10:15,850 --> 00:10:17,000
Asta e ok.

210
00:10:17,000 --> 00:10:19,680
Sunt folosind câmpurile din
Contextul a structurii,

211
00:10:19,680 --> 00:10:22,290
dar am putut niciodată doar
spune ceva de genul asta.

212
00:10:22,290 --> 00:10:22,790
Dreapta?

213
00:10:22,790 --> 00:10:26,836
Nu pot utiliza numele câmpului
independent de structura.

214
00:10:26,836 --> 00:10:28,210
Este un fel de lucru fundamental.

215
00:10:28,210 --> 00:10:32,990
>> Deci domenii fiind
fundamental pentru structurile C

216
00:10:32,990 --> 00:10:39,050
sunt foarte asemănătoare cu proprietăți fiind
fundamental la obiecte JavaScript.

217
00:10:39,050 --> 00:10:42,080
Dar ceea ce le face
deosebit de interesant

218
00:10:42,080 --> 00:10:46,230
este că obiectele pot avea, de asemenea, ceea ce
sunt numite metode, care sunt într-adevăr

219
00:10:46,230 --> 00:10:50,730
doar un cuvânt fantezist pentru funcții care
sunt inerente obiectului, de asemenea.

220
00:10:50,730 --> 00:10:55,340
Deci, este o funcție care poate fi doar
numit în contextul unui obiect.

221
00:10:55,340 --> 00:10:59,200
Doar un obiect care a definit
această funcție în interiorul ei,

222
00:10:59,200 --> 00:11:02,020
dacă te gândești la o
struct, funcția

223
00:11:02,020 --> 00:11:05,720
este definită în interiorul cele care definesc
acolade ale structurii.

224
00:11:05,720 --> 00:11:07,980
Deci, aceasta înseamnă doar ceva
la structura.

225
00:11:07,980 --> 00:11:10,960
Și asta e un fel de ceea ce facem
aici cu obiecte și metode.

226
00:11:10,960 --> 00:11:13,580
E practic ca suntem
definind o funcție care

227
00:11:13,580 --> 00:11:16,670
are sens doar pe o
obiect special, și așa ne-am

228
00:11:16,670 --> 00:11:19,440
apela că o metodă a obiectului.

229
00:11:19,440 --> 00:11:23,180
Și noi nu putem numi asta
funcție independentă a obiectului,

230
00:11:23,180 --> 00:11:29,260
la fel ca nu putem spune an sau model
independent de struct în C.

231
00:11:29,260 --> 00:11:32,300
>> De programare, astfel funcțional
paradigme arata ceva de genul asta.

232
00:11:32,300 --> 00:11:35,450
Funcție și apoi, când treci
în obiectul ca un parametru.

233
00:11:35,450 --> 00:11:38,650
Într-un programării orientate pe obiecte
limbi, acest tip de devine

234
00:11:38,650 --> 00:11:43,464
oglindită, si ne-ar gândi despre
place asta, object.function.

235
00:11:43,464 --> 00:11:45,380
Deci, un fel de punct care
Operatorul din nou implicând

236
00:11:45,380 --> 00:11:49,540
că este un fel de proprietate
sau atribut al obiectului în sine.

237
00:11:49,540 --> 00:11:53,240
Dar aceasta este ceea ce un obiect
limbaj de programare orientat

238
00:11:53,240 --> 00:11:57,150
s-ar putea face pentru a face o funcție
apel la o metodă, din nou, ceea ce

239
00:11:57,150 --> 00:12:00,260
este doar un cuvânt special pentru o funcție
care este inerentă la un obiect.

240
00:12:00,260 --> 00:12:03,440
Aceasta este ceea ce că
sintaxă ar putea arata ca.

241
00:12:03,440 --> 00:12:09,360
Și așa vom începe pentru a vedea unele dintre
acest lucru în contextul JavaScript.

242
00:12:09,360 --> 00:12:12,470
>> Vă puteți gândi, de asemenea, despre un obiect
un fel de un tablou asociativ,

243
00:12:12,470 --> 00:12:14,160
care suntem familiarizați cu de la PHP.

244
00:12:14,160 --> 00:12:17,720
Amintiți-vă un tablou asociativ permite
noi să avem perechi de valori-cheie, în schimb

245
00:12:17,720 --> 00:12:23,040
de a avea indici 0, una, două, trei,
și așa mai departe ca și cum suntem obișnuiți să de la C

246
00:12:23,040 --> 00:12:23,940
matrice.

247
00:12:23,940 --> 00:12:27,472
Matrice asociative pot hartă
cuvinte, cum ar fi video PHP,

248
00:12:27,472 --> 00:12:29,180
am vorbit despre
topping de pizza.

249
00:12:29,180 --> 00:12:31,180
Și astfel am avut o serie
numite pizza, iar noi

250
00:12:31,180 --> 00:12:36,670
brânză avut a fost o cheie și $ 8,99 a fost
valoare, iar apoi a fost o cheie pepperoni,

251
00:12:36,670 --> 00:12:39,190
$ 9.99 a fost o valoare, și așa mai departe.

252
00:12:39,190 --> 00:12:43,300
Și astfel ne putem gândi, de asemenea, despre un
obiecții fel de similar cu un asociativ

253
00:12:43,300 --> 00:12:43,840
matrice.

254
00:12:43,840 --> 00:12:47,020
Și astfel această sintaxă aici
ar crea un nou obiect

255
00:12:47,020 --> 00:12:50,950
numit Herbie cu două
proprietăți interior.

256
00:12:50,950 --> 00:12:57,310
An, care se atribuie valoarea 1963,
și model, care este atribuit sirul

257
00:12:57,310 --> 00:12:58,140
Gândac.

258
00:12:58,140 --> 00:13:01,770
>> Și observați că aici eu sunt, folosind
ghilimele simple în JavaScript.

259
00:13:01,770 --> 00:13:05,570
Puteți folosi ghilimele simple sau duble
atunci când vorbim despre siruri de caractere.

260
00:13:05,570 --> 00:13:07,772
E doar convențional
cazul în care cele mai multe ori

261
00:13:07,772 --> 00:13:10,230
când scrii JavaScript,
utilizați doar ghilimele simple.

262
00:13:10,230 --> 00:13:15,050
Dar mi-ar prinde ghilimele aici, și
care ar fi foarte bine, de asemenea.

263
00:13:15,050 --> 00:13:17,470
>> Deci, amintiți-vă cum în
PHP am avut această noțiune

264
00:13:17,470 --> 00:13:22,730
de o pentru fiecare buclă, care ne-ar permite
pentru a itera peste tot din valoarea cheie

265
00:13:22,730 --> 00:13:25,270
perechi de o asociativă
matrice, pentru că am

266
00:13:25,270 --> 00:13:29,050
nu au avut capacitatea de a repeta această
prin 0, unu, doi, trei, patru,

267
00:13:29,050 --> 00:13:30,710
si asa mai departe?

268
00:13:30,710 --> 00:13:35,010
JavaScript are ceva foarte similar,
dar nu este numit un pentru fiecare buclă,

269
00:13:35,010 --> 00:13:38,960
se numește un în bucle.

270
00:13:38,960 --> 00:13:42,890
Deci, dacă i-am spus ca mi-
acest, pentru cheie var în obiect,

271
00:13:42,890 --> 00:13:48,670
asta e un fel de a spune similare
pentru fiecare ceva ca pe ceva.

272
00:13:48,670 --> 00:13:53,850
Dar tot ce fac aici este iterarea
prin toate cheile de obiect meu.

273
00:13:53,850 --> 00:13:56,070
Și în interiorul cret
bretele acolo, aș

274
00:13:56,070 --> 00:14:03,410
utilizați obiect cheie paranteze pătrate pentru a se referi
la valoarea la acea locație cheie.

275
00:14:03,410 --> 00:14:05,400
>> Alternativ, există
chiar o altă abordare.

276
00:14:05,400 --> 00:14:10,880
Dacă doar am grijă doar despre
valori, pot să spun pentru cheie de obiect,

277
00:14:10,880 --> 00:14:12,360
și de a folosi doar tasta interior.

278
00:14:12,360 --> 00:14:17,240
Deci, pentru cheie var în obiect, am
pentru a utiliza paranteze pătrate obiect

279
00:14:17,240 --> 00:14:19,340
cheie în interiorul buclei.

280
00:14:19,340 --> 00:14:24,580
Pentru cheie var de obiect, pot
trebuie doar să utilizați cheie în interiorul buclei,

281
00:14:24,580 --> 00:14:29,040
pentru că eu sunt doar în mod special
vorbind despre valorile de acolo.

282
00:14:29,040 --> 00:14:32,630
>> Așa că haideți să aruncăm o poate
uita-te la diferenta

283
00:14:32,630 --> 00:14:35,670
doar să-ți arăt rapid
diferența dintre patru de

284
00:14:35,670 --> 00:14:40,730
în și pentru a, cu o foarte specifice
matrice, pe care o avem aici, saptamana matrice.

285
00:14:40,730 --> 00:14:43,616
Așa că trebuie să găsească o nouă gamă
pe care am umplut cu șapte corzi,

286
00:14:43,616 --> 00:14:46,240
Luni marți miercuri,
Joi, vineri, sâmbătă, duminică.

287
00:14:46,240 --> 00:14:50,530
Și vreau să repeta acum
prin această matrice,

288
00:14:50,530 --> 00:14:53,090
imprimarea anumite informații.

289
00:14:53,090 --> 00:14:58,780
Dacă am folosi o buclă de
pentru a imprima informații,

290
00:14:58,780 --> 00:15:00,710
ce crezi că am de gând pentru a obține?

291
00:15:00,710 --> 00:15:01,710
Ei bine, haideți să aruncăm o privire.

292
00:15:01,710 --> 00:15:05,300
Și înainte de a ne sari peste
la fereastra browser-ul meu,

293
00:15:05,300 --> 00:15:08,090
știu doar că
console.log este un fel de un

294
00:15:08,090 --> 00:15:10,630
mod de a face un F de imprimare în JavaScript.

295
00:15:10,630 --> 00:15:12,040
Dar ceea ce este consola?

296
00:15:12,040 --> 00:15:14,940
Ei bine, asta e ceea ce vom
pentru a merge aruncăm o privire la acest moment.

297
00:15:14,940 --> 00:15:16,850
>> OK, asa ca ne-am întors aici
în fereastra browser-ul meu,

298
00:15:16,850 --> 00:15:19,410
și am de gând să deschidă
up Instrumentele mele de dezvoltare.

299
00:15:19,410 --> 00:15:22,290
Din nou, eu sunt doar lovind F12
pentru a deschide instrumente pentru dezvoltatori.

300
00:15:22,290 --> 00:15:25,670
Și observați că aici, la
top Am ales consola.

301
00:15:25,670 --> 00:15:28,480
Deci aceasta este noțiunea
de o consolă dezvoltator,

302
00:15:28,480 --> 00:15:30,500
și ne va permite să
imprima informațiile afară,

303
00:15:30,500 --> 00:15:33,000
un fel de terminal, dar
după cum veți vedea un pic mai târziu,

304
00:15:33,000 --> 00:15:37,720
putem, de asemenea, informații în tip
de a interacționa cu site-ul nostru.

305
00:15:37,720 --> 00:15:42,320
Am de gând pentru a mări un pic aici,
și voi acum click pe la încercare.

306
00:15:42,320 --> 00:15:45,230
Și patru în test-- nu voi
vă arată codul pentru ea, chiar acum,

307
00:15:45,230 --> 00:15:47,479
dar veți obține, dacă
descărca codul sursă care

308
00:15:47,479 --> 00:15:50,380
este asociată cu această video--
este doar faptul că în buclă

309
00:15:50,380 --> 00:15:52,610
că am văzut doar o
în al doilea rând în urmă pe diapozitiv.

310
00:15:52,610 --> 00:15:54,810
>> Deci, voi faceți clic pe care
buton, și aici,

311
00:15:54,810 --> 00:15:58,440
aici e ceea ce a imprimat în
consolă, 0, unul, doi, trei, patru, cinci,

312
00:15:58,440 --> 00:15:58,940
şase.

313
00:15:58,940 --> 00:16:02,490
Nu am imprima informațiile
în interiorul acele locații matrice,

314
00:16:02,490 --> 00:16:05,180
pentru că am folosit o de loop.

315
00:16:05,180 --> 00:16:10,670
Și în interiorul corpului buclei, am
doar imprimate cheie nu obiecții cheie.

316
00:16:10,670 --> 00:16:18,600
Dar dacă acum clar consola mea, și eu
comuta la pentru a testului, și patru de testare

317
00:16:18,600 --> 00:16:22,500
Eu spun că am folosi pentru a buclei
în schimb și imprima cheie,

318
00:16:22,500 --> 00:16:28,079
dacă faceți clic pe asta, acum am obtinerea de
elemente reale din interiorul obiectului meu

319
00:16:28,079 --> 00:16:29,120
sau array mea în acest caz.

320
00:16:29,120 --> 00:16:31,760
Matrice mea de zile lucrătoare.

321
00:16:31,760 --> 00:16:33,480
Am imprimate luni,
Marti miercuri.

322
00:16:33,480 --> 00:16:36,930
Deci asta e diferența dintre
o în buclă, care afiseaza

323
00:16:36,930 --> 00:16:43,410
doar tastele dacă utilizați doar cheie
în interiorul corpului buclei,

324
00:16:43,410 --> 00:16:46,850
și o pentru a bucla, care imprimă
în valorile dacă utilizați doar

325
00:16:46,850 --> 00:16:48,870
cheie în interiorul corpului buclei.

326
00:16:48,870 --> 00:16:52,380
>> Bine, cum putem acum începe să
înlănțui siruri de caractere și poate amesteca

327
00:16:52,380 --> 00:16:57,220
unele variabile cu interpolare
ca și cum am fost în stare să facă în PHP?

328
00:16:57,220 --> 00:16:59,410
Ei bine, suntem destul de familiar
cu acest din PHP.

329
00:16:59,410 --> 00:17:04,109
Acesta este modul în care ne-ar face folosind
Operatorul punct de înlănțui siruri de caractere.

330
00:17:04,109 --> 00:17:06,260
În JavaScript, însă,
vom folosi de fapt, ceva

331
00:17:06,260 --> 00:17:09,290
numit operatorul plus, care
este poate chiar un pic mai mult

332
00:17:09,290 --> 00:17:10,470
intuitiv, nu?

333
00:17:10,470 --> 00:17:12,609
Suntem adăugarea de o grămadă
de siruri de caractere împreună.

334
00:17:12,609 --> 00:17:14,520
Deci, haideți să ne întoarcem
de peste si a vedea ce aceasta

335
00:17:14,520 --> 00:17:18,693
va imprima dacă noi încercăm să imprima
toate informațiile din săptămână matrice.

336
00:17:18,693 --> 00:17:20,859
Bine, deci sub aici
în șir concatenare,

337
00:17:20,859 --> 00:17:24,822
Am două opțiuni, clădire șir
V1 și V2 apoi construcție șir.

338
00:17:24,822 --> 00:17:26,530
Și vom vedea de ce am
nevoie V2 într-o secundă.

339
00:17:26,530 --> 00:17:28,610
Dar voi să faceți clic pe
șir de construcție V1, care

340
00:17:28,610 --> 00:17:30,360
este codul am fost
a lua doar o privire la,

341
00:17:30,360 --> 00:17:32,980
console.log cu toate plusurile.

342
00:17:32,980 --> 00:17:35,910
Să vedem dacă acest printuri
ce ne asteptam.

343
00:17:35,910 --> 00:17:39,939
>> Luni este numărul zi 01 a săptămânii,
Marți este numărul zi 11 a săptămânii.

344
00:17:39,939 --> 00:17:41,730
Ei bine, ceea ce am încercat
a face nu a fost minim

345
00:17:41,730 --> 00:17:46,280
l pentru a imprima luni este numărul zi
o, marți este ziua pe locul doi.

346
00:17:46,280 --> 00:17:50,140
Dar se pare ca eu sunt
întotdeauna imprimarea unul.

347
00:17:50,140 --> 00:17:51,260
Ei bine, de ce este asta?

348
00:17:51,260 --> 00:17:55,600
Ei bine, se pare, să ia o privire
la acest mic fragment de cod aici.

349
00:17:55,600 --> 00:18:00,160
Observați că am utilizați plus
Operatorul in doua contexte diferite.

350
00:18:00,160 --> 00:18:03,221
>> Și așa că aici e în cazul în care, poate, lucruri
că am fost un fel de a spune,

351
00:18:03,221 --> 00:18:03,970
Oh, e atât de mare.

352
00:18:03,970 --> 00:18:05,910
Nu mai face cu tipuri de date.

353
00:18:05,910 --> 00:18:08,220
Dar aici e în cazul în care faptul
că ne pierdem tipuri de date

354
00:18:08,220 --> 00:18:10,960
poate fi de fapt un pic
de o problemă pentru noi.

355
00:18:10,960 --> 00:18:16,260
Acum că operatorul plus este utilizat pentru a
înlănțui siruri de caractere și se adaugă numere

356
00:18:16,260 --> 00:18:19,550
împreună, JavaScript are
pentru a face cele mai bune ghici sale

357
00:18:19,550 --> 00:18:22,030
cu privire la ceea ce vreau să facă pentru mine.

358
00:18:22,030 --> 00:18:23,900
Și în acest caz, ghicit greșit.

359
00:18:23,900 --> 00:18:29,340
Aceasta zi doar concatenate, care ar fi
0, unul, doi, trei, patru, cinci, sau șase,

360
00:18:29,340 --> 00:18:32,060
și apoi doar concatenate
care apoi concatenate unul.

361
00:18:32,060 --> 00:18:35,020
Nu a fapt adăugați-le împreună.

362
00:18:35,020 --> 00:18:37,320
Și astfel aceste limbi,
PHP și JavaScript,

363
00:18:37,320 --> 00:18:39,196
că rezumate departe
această noțiune de tipuri,

364
00:18:39,196 --> 00:18:40,820
nu trebuie să mai ocupe de ea.

365
00:18:40,820 --> 00:18:43,600
Ei nu au încă tipuri sub capota.

366
00:18:43,600 --> 00:18:46,780
Și putem, în situații
ca aceasta, efectul de levier acest fapt

367
00:18:46,780 --> 00:18:49,240
prin a spune ceva
ca poate acest lucru, care

368
00:18:49,240 --> 00:18:53,210
spune JavaScript, de
Astfel, trata acest lucru ca un întreg,

369
00:18:53,210 --> 00:18:57,100
nu-l trateze ca pe un șir de caractere, chiar
deși suntem amestecarea siruri de caractere

370
00:18:57,100 --> 00:18:58,940
și numere întregi aici.

371
00:18:58,940 --> 00:19:02,204
>> Este doar unul din acele lucruri
că se pare că atât de mare în context

372
00:19:02,204 --> 00:19:04,120
că nu trebuie să
mai face cu tipuri,

373
00:19:04,120 --> 00:19:05,828
dar, uneori, veți
rula într-o situație

374
00:19:05,828 --> 00:19:09,110
exact ca în cazul în care acest lucru faptul că
nu ai control asupra tipuri

375
00:19:09,110 --> 00:19:11,220
poate intoarce impotriva pe tine
dacă nu ești atent.

376
00:19:11,220 --> 00:19:18,285
Și așa dacă ne pop înapoi peste la IDE, eu sunt
O să clar consola mea din nou,

377
00:19:18,285 --> 00:19:20,660
și am de gând să faceți clic pe string
clădire versiune doi, care

378
00:19:20,660 --> 00:19:23,052
este locul unde am folosi această funcție analizare Int.

379
00:19:23,052 --> 00:19:25,260
Acum este imprimarea
informații pe care Aștept.

380
00:19:25,260 --> 00:19:29,330
Luni numarul zi, marți
este ziua numărul doi, și așa mai departe.

381
00:19:29,330 --> 00:19:31,170
>> Deci, hai sa vorbim despre funcțiile din nou.

382
00:19:31,170 --> 00:19:34,790
I-am promis ne-ar vorbi despre anonim
funcții, iar acum contextul pentru care

383
00:19:34,790 --> 00:19:36,360
a sosit în sfârșit.

384
00:19:36,360 --> 00:19:39,980
Deci, înainte de a face acest lucru, hai să vorbim din nou
despre matrice pentru o secundă.

385
00:19:39,980 --> 00:19:42,120
Deci, matrice sunt o specială
cazul unui obiect.

386
00:19:42,120 --> 00:19:45,180
De fapt, totul în
JavaScript este de fapt un obiect.

387
00:19:45,180 --> 00:19:47,190
Deci, sunt un funcții
caz special a unui obiect,

388
00:19:47,190 --> 00:19:49,770
întregi sunt un special
cazul unui obiect,

389
00:19:49,770 --> 00:19:52,152
dar în mod special tablouri
au un număr de metode.

390
00:19:52,152 --> 00:19:55,110
Amintiți-vă că sunt obiecte,
ele pot avea proprietăți și metode.

391
00:19:55,110 --> 00:19:58,600
Ei au o serie de metode care
pot fi aplicate acestor obiecte.

392
00:19:58,600 --> 00:20:01,197
Există o metoda numita
dimensiune, array.size,

393
00:20:01,197 --> 00:20:03,030
care va reveni la
tine, ca te-ar putea aștepta

394
00:20:03,030 --> 00:20:05,120
numărul de elemente din matrice dumneavoastră.

395
00:20:05,120 --> 00:20:08,480
array.pop, un fel de
noțiunea noastră de popping off

396
00:20:08,480 --> 00:20:11,110
de o stivă, dacă vă amintiți
din stive nostru video,

397
00:20:11,110 --> 00:20:13,810
elimină ultimul element din matrice.

398
00:20:13,810 --> 00:20:17,110
Array.push adaugă un element nou
la sfârșitul unei matrice.

399
00:20:17,110 --> 00:20:20,910
array.shift este un fel de
ca DQ, se îmbină în

400
00:20:20,910 --> 00:20:23,610
chiar primul element al unui tablou.

401
00:20:23,610 --> 00:20:27,549
>> Dar există, de asemenea, un alt special
metodă de o serie numită hartă.

402
00:20:27,549 --> 00:20:29,340
Și aceasta este un fel de
concept interesant.

403
00:20:29,340 --> 00:20:30,930
Deci, ce este ideea de o hartă?

404
00:20:30,930 --> 00:20:33,880
Veți vedea de fapt acest lucru
în mai multe alte limbi,

405
00:20:33,880 --> 00:20:38,550
si nu vorbim despre o
un fel de cartografi harta aici,

406
00:20:38,550 --> 00:20:41,480
vorbim despre o funcție de cartografiere.

407
00:20:41,480 --> 00:20:44,110
În contextul suntem
vorbim aici, o hartă

408
00:20:44,110 --> 00:20:47,950
este un noi special operație
poate efectua pe o serie

409
00:20:47,950 --> 00:20:51,630
să aplice o anumită funcție
la fiecare element din matrice.

410
00:20:51,630 --> 00:20:55,190
și așa ne-ar spune în
acest caz, poate array.map,

411
00:20:55,190 --> 00:21:00,330
și în interiorul de ea, suntem trece
în harta este o funcție care ne-o dorim

412
00:21:00,330 --> 00:21:02,430
să fie aplicate la fiecare element:.

413
00:21:02,430 --> 00:21:07,299
Deci, este un fel de analog, folosind
o buclă pentru a itera peste fiecare element de

414
00:21:07,299 --> 00:21:09,340
și se aplică un anumit
funcționează la fiecare element,

415
00:21:09,340 --> 00:21:14,830
tocmai de activarea JavaScript-a construit în acest
noțiune de o cartografiere care pot fi aplicate.

416
00:21:14,830 --> 00:21:19,700
Și aceasta este o mare de context
vorbesc despre o funcție anonim.

417
00:21:19,700 --> 00:21:22,370
>> Așa că haideți să spunem că avem
această matrice de numere întregi.

418
00:21:22,370 --> 00:21:25,370
Se numește Nums, și are cinci
ce este în ea, unu, doi, trei, patru,

419
00:21:25,370 --> 00:21:26,410
cinci.

420
00:21:26,410 --> 00:21:30,620
Acum vreau să harta unele
Funcția pe această matrice.

421
00:21:30,620 --> 00:21:34,337
Vreau să am aplica o funcție
la fiecare element de matrice.

422
00:21:34,337 --> 00:21:37,420
Ei bine, să spunem că ceea ce vreau să
faci este doar dubla toate elementele.

423
00:21:37,420 --> 00:21:42,520
Ceea ce am putea face este doar folosi o buclă
pentru var I este egal cu 0, I este mai mică de

424
00:21:42,520 --> 00:21:47,390
sau egal cu 4, eu plus, plus, și
apoi dublu fiecare număr unic.

425
00:21:47,390 --> 00:21:49,580
Dar pot face, de asemenea, ceva de genul asta.

426
00:21:49,580 --> 00:21:53,420
Pot spune Nums a fost anterior
unu doi trei patru cinci,

427
00:21:53,420 --> 00:21:58,310
acum, însă, mi-ar plăcea să
se aplică o cartografiere pe această matrice

428
00:21:58,310 --> 00:22:00,400
unde doriți
de a dubla fiecare număr.

429
00:22:00,400 --> 00:22:02,540
Și exact
ce se întâmplă aici.

430
00:22:02,540 --> 00:22:06,870
Dar observați ceea ce am trece
ca argument pentru hartă.

431
00:22:06,870 --> 00:22:09,080
Aceasta este o funcție anonim.

432
00:22:09,080 --> 00:22:11,140
Și observați nu am dat
Această funcție un nume,

433
00:22:11,140 --> 00:22:13,290
Am dat-o doar o lista de parametri.

434
00:22:13,290 --> 00:22:16,370
Și astfel acesta este un exemplu
de o funcție anonim.

435
00:22:16,370 --> 00:22:21,270
>> Noi, în general, nu s-ar numi aceasta
Funcția în afara contextului de hartă.

436
00:22:21,270 --> 00:22:24,110
Suntem o definire ca un parametru
la harta, așa că nu prea

437
00:22:24,110 --> 00:22:27,910
trebuie să aibă un nume pentru ea în cazul în care
Singurul lucru care ii pasa este harta

438
00:22:27,910 --> 00:22:30,339
și este definit drept
există în interiorul hartă.

439
00:22:30,339 --> 00:22:31,880
Și astfel aceasta este o funcție anonim.

440
00:22:31,880 --> 00:22:34,680
Noi nu am putut
a face acest lucru în prealabil.

441
00:22:34,680 --> 00:22:38,400
Harta unele funcție care
acceptă un parametru, num,

442
00:22:38,400 --> 00:22:41,890
și ceea ce face ca functia
este întoarce NUM ori 2.

443
00:22:41,890 --> 00:22:45,330
Și așa după acest
cartografiere a fost aplicat,

444
00:22:45,330 --> 00:22:50,090
acest lucru este acum ceea ce arata Nums
cum ar fi, două, patru, șase, opt, 10.

445
00:22:50,090 --> 00:22:52,090
Și vom pop pe la meu
fereastră de browser și doar

446
00:22:52,090 --> 00:22:55,240
aruncăm o privire la acest
foarte repede, de asemenea.

447
00:22:55,240 --> 00:22:58,000
>> Deci, am un alt buton aici
în pagina mea numit dublu.

448
00:22:58,000 --> 00:23:03,570
Și atunci când fac clic dublu, și se spune
mă înainte de a fi unul, doi, trei, patru,

449
00:23:03,570 --> 00:23:07,250
și cinci după două, patru, șase, opt, 10.

450
00:23:07,250 --> 00:23:11,930
Și dacă mă duc înapoi și faceți dublu clic
din nou, două, patru, șase, opt, 10.

451
00:23:11,930 --> 00:23:17,400
Și apoi, după, patru,
opt, 12, 16, și apoi 20.

452
00:23:17,400 --> 00:23:20,440
Și ce fac in aceasta functie?

453
00:23:20,440 --> 00:23:25,210
Ei bine, dacă ne-am pop pe la IDE, și
Am trage funcția mea anonim, aici

454
00:23:25,210 --> 00:23:28,780
pe linia șapte la 13, sunt
a face un lucru fantezie pic aici,

455
00:23:28,780 --> 00:23:32,240
dar eu sunt doar imprimarea
ceea ce este în prezent în matrice.

456
00:23:32,240 --> 00:23:36,580
Apoi, pe linia 16, 17,
și 18, nu e harta mea.

457
00:23:36,580 --> 00:23:40,930
Acest lucru este în cazul în care aplic această dublare
Funcția de fiecare singur element.

458
00:23:40,930 --> 00:23:43,530
Și apoi un pic mai jos,
Eu doar fac același lucru

459
00:23:43,530 --> 00:23:46,640
Făceam înainte, cu excepția acum sunt
imprimarea conținutul matrice

460
00:23:46,640 --> 00:23:48,167
dupa ce.

461
00:23:48,167 --> 00:23:50,500
Dar tot ce am făcut aici este
folosi doar o funcție anonim

462
00:23:50,500 --> 00:23:53,640
pentru a mapa peste o serie intreaga.

463
00:23:53,640 --> 00:23:58,466
>> Deci, încă o temă de mare pentru a vorbi despre în
JavaScript este noțiunea unui eveniment.

464
00:23:58,466 --> 00:24:01,590
Un eveniment este ceva care se întâmplă
atunci când un utilizator interacționează cu dvs. de web

465
00:24:01,590 --> 00:24:04,715
pagină, așa că poate fac clic ceva,
sau poate pagina este terminat de încărcare,

466
00:24:04,715 --> 00:24:07,200
sau poate au mutat
mouse-ul peste ceva,

467
00:24:07,200 --> 00:24:09,290
sau le-am scris ceva
într-un câmp de introducere.

468
00:24:09,290 --> 00:24:14,260
Toate aceste lucruri sunt evenimente
care au loc pe pagina noastră web.

469
00:24:14,260 --> 00:24:17,460
Și JavaScript are
capacitatea de a sprijini ceva

470
00:24:17,460 --> 00:24:21,760
numit o tratare a evenimentului, care
este o funcție de apel invers, care

471
00:24:21,760 --> 00:24:23,329
răspunde la un eveniment html.

472
00:24:23,329 --> 00:24:24,620
Și ce e un funcție de apel invers?

473
00:24:24,620 --> 00:24:27,328
Ei bine, e doar un alt general,
nume pentru o funcție anonim.

474
00:24:27,328 --> 00:24:30,170
Este o funcție care
răspunde la un eveniment.

475
00:24:30,170 --> 00:24:34,130
Și acest lucru este în cazul în care am ajuns la
Ideea de a lega anumite funcții

476
00:24:34,130 --> 00:24:38,060
la un anumit atribut HTML.

477
00:24:38,060 --> 00:24:41,420
Cele mai multe elemente HTML au
sprijin pentru un atribut

478
00:24:41,420 --> 00:24:45,170
că nu a vorbit despre în HTML
videoclip pentru ceva de genul pe clic

479
00:24:45,170 --> 00:24:50,540
sau pe hover sau pe sarcină,
toate aceste evenimente

480
00:24:50,540 --> 00:24:53,120
pe care le puteți scrie apoi funcții
care se ocupă cu aceste evenimente

481
00:24:53,120 --> 00:24:56,090
atunci când aceste evenimente
apar pe pagina dvs. web.

482
00:24:56,090 --> 00:24:59,170
>> Și astfel poate HTML
arata ceva de genul asta.

483
00:24:59,170 --> 00:25:02,240
Și am două butoane aici,
un singur buton și butonul de două,

484
00:25:02,240 --> 00:25:04,620
și aici am în prezent,
nimic definit,

485
00:25:04,620 --> 00:25:11,170
dar acest lucru este în cazul în care atributul pe
clic este aparent o parte din tag meu html.

486
00:25:11,170 --> 00:25:15,220
Deci, se pare că, atunci când am defini ceea ce este
întâmplă în interiorul acestui atribut,

487
00:25:15,220 --> 00:25:18,590
o să fie o JavaScript
funcție care răspunde la eveniment

488
00:25:18,590 --> 00:25:24,360
probabil de clic pe
Butonul unul sau doi buton.

489
00:25:24,360 --> 00:25:28,580
>> Ce fel de misto despre acest lucru este ne
poate scrie un handler eveniment generic.

490
00:25:28,580 --> 00:25:32,370
Și această tratare a evenimentului va
a crea un obiect eveniment.

491
00:25:32,370 --> 00:25:37,000
Și obiectul eveniment ne va spune
care dintre cele două butoane a fost făcut clic.

492
00:25:37,000 --> 00:25:38,064
Acum, cum se că munca?

493
00:25:38,064 --> 00:25:39,730
Ei bine, s-ar putea arata ceva de genul asta.

494
00:25:39,730 --> 00:25:44,860
Deci, vom defini mai întâi butoanele noastre
pentru a avea un răspuns la apel invers

495
00:25:44,860 --> 00:25:47,470
Funcția care va fi numit
atunci când butonul este apăsat,

496
00:25:47,470 --> 00:25:49,520
vom suna eveniment numele de alertă.

497
00:25:49,520 --> 00:25:53,320
Și observa in ambele cazuri suntem
trece în acest parametru eveniment.

498
00:25:53,320 --> 00:25:55,460
Deci noi numim această funcție
sau atunci când această funcție

499
00:25:55,460 --> 00:26:00,330
este declansata de eveniment se întâmplă,
se va crea acest obiect eveniment

500
00:26:00,330 --> 00:26:03,300
și să-l dați ca un
parametru pentru a alerta nume.

501
00:26:03,300 --> 00:26:07,270
Și acel obiect eveniment este
O să conțină informații

502
00:26:07,270 --> 00:26:09,800
despre care buton a fost apasat.

503
00:26:09,800 --> 00:26:11,580
Și cum se face asta?

504
00:26:11,580 --> 00:26:13,654
Ei bine, s-ar putea arata ceva de genul asta.

505
00:26:13,654 --> 00:26:15,570
Deci, acum în separat meu
Fișier JavaScript, aș putea

506
00:26:15,570 --> 00:26:17,420
trebuie să găsească această
Funcția nume de alertă, care

507
00:26:17,420 --> 00:26:19,500
acceptă din nou acest parametru eveniment.

508
00:26:19,500 --> 00:26:24,640
Si apoi aici este locul unde Detectez
Butonul care a fost declanșată,

509
00:26:24,640 --> 00:26:28,100
declanșare var este egal eveniment
dot element sursă.

510
00:26:28,100 --> 00:26:33,150
Care a fost sursa care a creat
acest obiect eveniment, care a fost adoptată în?

511
00:26:33,150 --> 00:26:36,390
A fost un buton sau a fost buton doi?

512
00:26:36,390 --> 00:26:40,710
>> Și apoi aici tot ce fac este
imprimarea trigger.innerhtml.

513
00:26:40,710 --> 00:26:43,860
Ei bine, în acest caz, în acest
context, trigger.innerhtml

514
00:26:43,860 --> 00:26:45,940
este doar ceea ce este scris pe butonul.

515
00:26:45,940 --> 00:26:48,830
Este doar așa se întâmplă dacă sărim
înapoi pentru un al doilea, care ar

516
00:26:48,830 --> 00:26:51,670
fie ce e în între aceste tag-uri buton.

517
00:26:51,670 --> 00:26:54,150
Acesta va fi unul sau buton buton două.

518
00:26:54,150 --> 00:26:57,320
Și haideți să aruncăm o privire la
modul în care acest eveniment ar fi handler

519
00:26:57,320 --> 00:27:01,080
uite dacă am avea-l rulează în practică.

520
00:27:01,080 --> 00:27:03,850
>> Deci, în primul rând, ai
deschis events.js,

521
00:27:03,850 --> 00:27:06,517
care este fișierul JavaScript unde
Am definit această funcție.

522
00:27:06,517 --> 00:27:08,558
Și, după cum puteți vedea, este
destul de mult exact ceea ce

523
00:27:08,558 --> 00:27:10,230
tocmai am vazut pe diapozitiv în urmă cu un al doilea.

524
00:27:10,230 --> 00:27:14,890
Și voi merge pe la
Pagina de start am fost folosind.

525
00:27:14,890 --> 00:27:17,660
Și am aici buton
una și două buton.

526
00:27:17,660 --> 00:27:19,820
Și voi faceți clic pe butonul o.

527
00:27:19,820 --> 00:27:23,930
Ați făcut clic pe butonul unu, dacă
Puteti vedea aici, în alertă.

528
00:27:23,930 --> 00:27:25,810
BINE.

529
00:27:25,810 --> 00:27:28,980
Faceți clic pe butonul doi,
clic pe un buton două.

530
00:27:28,980 --> 00:27:32,150
>> Deci, ambele butoane au
același apel de funcție, nu?

531
00:27:32,150 --> 00:27:35,840
Amândoi au fost nume de alertă
eveniment, dar acest obiect eveniment

532
00:27:35,840 --> 00:27:41,900
care devine creat, atunci când facem click pe
ne spune care a fost apasat butonul.

533
00:27:41,900 --> 00:27:44,650
Noi nu a trebuit să scrie două separate,
funcții sau afacere cu care au

534
00:27:44,650 --> 00:27:46,470
pentru a trece orice informații suplimentare.

535
00:27:46,470 --> 00:27:48,220
Noi doar bazându-se pe
ce JavaScript va

536
00:27:48,220 --> 00:27:53,772
face pentru noi, care este de a crea ca
un fel de obiect de eveniment în numele nostru.

537
00:27:53,772 --> 00:27:56,730
Există o mulțime mai mult decât JavaScript
ceea ce ne-am acoperit în acest film,

538
00:27:56,730 --> 00:27:58,521
dar având aceste
fundamentală ar trebui să te

539
00:27:58,521 --> 00:28:00,690
destul de moduri de mult timp la
tot de învățare vei

540
00:28:00,690 --> 00:28:04,030
trebuie să știți despre acest
limbă interesant.

541
00:28:04,030 --> 00:28:05,000
Sunt Doug Lloyd.

542
00:28:05,000 --> 00:28:07,010
Acest lucru este CS50.

543
00:28:07,010 --> 00:28:09,181