1
00:00:00,000 --> 00:00:03,840
>> [MUZIKO Ludante]

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

3
00:00:05,770 --> 00:00:08,690
>> DOUG LLOYD: Do nun ni estas maljunaj
pros ĉe ttt programado, dekstra?

4
00:00:08,690 --> 00:00:12,140
Kaj ni kovris plurajn
lingvoj en unuopaj videoj.

5
00:00:12,140 --> 00:00:14,690
Kaj nun ni faru unu pli, Ĝavoskripto.

6
00:00:14,690 --> 00:00:17,370
>> Unue la bona novaĵo, Ĝavoskripto
estas moderna programado

7
00:00:17,370 --> 00:00:21,410
lingvo multe kiel PHP kies
sintakso derivas el C,

8
00:00:21,410 --> 00:00:22,830
do tio estas bona loko por komenci.

9
00:00:22,830 --> 00:00:25,880
Temas pri malnovega PHP, tiel,
li estis proksimume 20 jarojn.

10
00:00:25,880 --> 00:00:28,600
Ĝi estis inventita ĉirkaŭ
Samtempe kiel PHP.

11
00:00:28,600 --> 00:00:32,240
Kaj JavaScript estas efektive sufiĉe
fundamenta por la uzanto sperto

12
00:00:32,240 --> 00:00:32,740
de la retejo.

13
00:00:32,740 --> 00:00:34,448
Fakte, ekzistas
tri lingvoj kiuj mi

14
00:00:34,448 --> 00:00:38,480
dirus ia konsistigas la
uzanto sperto de interagantaj

15
00:00:38,480 --> 00:00:42,650
kun la retejo, html,
css, kaj JavaScript.

16
00:00:42,650 --> 00:00:46,030
Kaj do nun ni parolu
iomete pri Ĝavoskripto.

17
00:00:46,030 --> 00:00:50,301
>> La malbona novaĵo, kvankam, kun JavaScript estas
ke prende multajn regulojn por si,

18
00:00:50,301 --> 00:00:51,300
kaj tiam rompas ilin.

19
00:00:51,300 --> 00:00:54,010
Kaj JavaScript povas efektive esti
speco de defiado por lerni,

20
00:00:54,010 --> 00:00:57,000
ĉar ĝi estas kontraste C kaj
PHP, kiu estas tre strukturita

21
00:00:57,000 --> 00:01:00,270
kaj havas tre rigidajn regulojn
por kiel aferoj povas funkcii.

22
00:01:00,270 --> 00:01:03,690
Javascript havas specon
de akiris tiom fleksebla

23
00:01:03,690 --> 00:01:06,650
ke eble aĵoj ne tuj
labori la vojon ni atendas ilin,

24
00:01:06,650 --> 00:01:09,830
kaj eble ni vere ne povas lerni
nia unua programlingvo

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

26
00:01:10,769 --> 00:01:12,810
Do eble ĉar ĝi ne
starigis sin ajnan reguloj,

27
00:01:12,810 --> 00:01:15,754
kaj ĝi faras ne vere
efikigi bona kodigo kutimoj.

28
00:01:15,754 --> 00:01:18,170
Sed nun ni espereble disvolvita
iu bona kodigo kutimoj,

29
00:01:18,170 --> 00:01:21,470
kaj tiel ni povas komenci Foray
en JavaScript iomete.

30
00:01:21,470 --> 00:01:25,750
>> Skribi Ĝavoskripto, simila al malfermo
supren C dosieron per punkto C etendo

31
00:01:25,750 --> 00:01:29,770
aŭ PHP dosieron per punkto PHP etendo,
ĉiuj ni devas fari estas malfermi dosieron

32
00:01:29,770 --> 00:01:31,764
kun la skalara js dosiersufikso.

33
00:01:31,764 --> 00:01:34,430
Ni ne bezonas havi neniun specialan
delimitadores kiel ni faris en PHP.

34
00:01:34,430 --> 00:01:36,750
KE speco de angulo
krampo demandosigno PHP

35
00:01:36,750 --> 00:01:40,300
ke ni estas kutimitaj de tio, la vojo
ni diru nia navegador kiu kion ni havas estas

36
00:01:40,300 --> 00:01:43,502
JavaScript estas per inkludante
HTML-etikedo,

37
00:01:43,502 --> 00:01:46,210
kaj ni vidos iomete pri
kiel fari tion en nur momento.

38
00:01:46,210 --> 00:01:48,210
>> La alia afero kiu faras
Ĝavoskripto malsamaj,

39
00:01:48,210 --> 00:01:50,580
tamen, estas ke ĝi kuras kliento flanko.

40
00:01:50,580 --> 00:01:53,430
Do memoru kun PHP kiu
ni neniam povus vere vidi

41
00:01:53,430 --> 00:01:57,041
la PHP kiu substrekis retejon.

42
00:01:57,041 --> 00:01:59,040
Se ni iam vidis la
paĝo fonto, ni nur

43
00:01:59,040 --> 00:02:02,830
vidi la html kiu estis
generitaj per tiu PHP.

44
00:02:02,830 --> 00:02:04,900
Sed Javascript kuras kliento flanko.

45
00:02:04,900 --> 00:02:06,710
Via Javascript kuras en via komputilo.

46
00:02:06,710 --> 00:02:09,050
Kaj tial vi povas fari
Aĵoj kiel aldoni blockers.

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

48
00:02:09,550 --> 00:02:12,704
Ad blokado faras ofte
mortigante ĉiujn la Ĝavoskripto

49
00:02:12,704 --> 00:02:14,370
kiu ruliĝas sur aparta retejo.

50
00:02:14,370 --> 00:02:19,000
Kaj ĉar ĝi devus
kuri sur via maŝino kliento flanko

51
00:02:19,000 --> 00:02:21,910
Vi nur povas halti la
Ĝavoskripto lanĉadon tute.

52
00:02:21,910 --> 00:02:27,030
Tio ankaŭ signifas ke kiam vi uzas
retejo kiu inkludas JavaScript,

53
00:02:27,030 --> 00:02:32,450
vi devas sendi la JavaScript fonto
kodo kiel parto de via http respondo

54
00:02:32,450 --> 00:02:34,159
al la kliento kiam peti ĝin.

55
00:02:34,159 --> 00:02:35,950
Kaj do vi eble ne
volas uzi JavaScript

56
00:02:35,950 --> 00:02:38,395
fari vere sentema aferoj
kiel pasanta informo

57
00:02:38,395 --> 00:02:41,020
pri uzulajn pasvortojn dorso kaj
elirante, ĉar ili estas reale

58
00:02:41,020 --> 00:02:45,610
tuj ricevos ĉiujn la fontkodon,
Ne nur la html kiu generas,

59
00:02:45,610 --> 00:02:49,030
kiel estus la kazo kun diru PHP.

60
00:02:49,030 --> 00:02:51,620
>> Nu do kiel ni inkludas JavaScript
en nia html komenci kun?

61
00:02:51,620 --> 00:02:54,520
Nu, simila al CSS, fakte,
estas speco de kiel ni faros ĝin ĉi tie.

62
00:02:54,520 --> 00:02:56,190
Kun CSS ni havas stilon etikedoj.

63
00:02:56,190 --> 00:03:00,760
Kaj ene de tiuj stilo etikedoj,
ni povas difini CSS stilo folio.

64
00:03:00,760 --> 00:03:03,450
Simile kun JavaScript
ni povas malfermi skripto etikedoj,

65
00:03:03,450 --> 00:03:06,660
alia html etikedo ni ne
raporti en nia html vídeo,

66
00:03:06,660 --> 00:03:09,720
kaj skribi JavaScript en
inter tiuj skripto etikedoj.

67
00:03:09,720 --> 00:03:13,960
Ankaŭ se, kiel CSS, ni
povis ligi en ekster CSS dosierojn

68
00:03:13,960 --> 00:03:15,900
kaj tiris ilin en nian programon tiel.

69
00:03:15,900 --> 00:03:18,280
Kun CSS ni ankaŭ povas,
Pardonu min, kun JavaScript

70
00:03:18,280 --> 00:03:23,240
ni povas ankaŭ specifi la fonto
atributo de la skripto etikedo

71
00:03:23,240 --> 00:03:25,720
ligi en JavaScript
aparte, do vi ne

72
00:03:25,720 --> 00:03:27,680
devas skribi ĝin en
inter skripto etikedoj, ni

73
00:03:27,680 --> 00:03:29,600
povas ligi ĝin en uzanta
ke skripto etikedo ankaŭ.

74
00:03:29,600 --> 00:03:33,230
Kaj same kiel cxe la kazo kun CSS kie
ni rekomendas ke ĝi estis verŝajne

75
00:03:33,230 --> 00:03:36,090
en via plej bona intereso por skribi
vian CSS en aparta dosiero en kazo

76
00:03:36,090 --> 00:03:38,500
vi devas ŝanĝi ĝin,
simile ni rekomendas

77
00:03:38,500 --> 00:03:40,720
ke vi skribu viajn
JavaScript en apartaj dosieroj

78
00:03:40,720 --> 00:03:45,460
kaj uzi la skripto etikedoj fonto
atribui ligi via JavaScript

79
00:03:45,460 --> 00:03:49,520
en via html, via retpaĝo.

80
00:03:49,520 --> 00:03:52,610
>> Do Javascript variabloj, ni
komenci parolante pri la sintakso tie.

81
00:03:52,610 --> 00:03:53,600
Kaj ni iros tra
tian rapide,

82
00:03:53,600 --> 00:03:56,640
ĉar ni jam faris tion en PHP, do
ĉi devus ĉiujn esti bela familiara.

83
00:03:56,640 --> 00:03:59,490
Do variabloj en JavaScript estas
tre simila al PHP variabloj.

84
00:03:59,490 --> 00:04:03,270
Mankas tipo especificación kaj
kiam vi enkondukos variablon,

85
00:04:03,270 --> 00:04:05,070
vi prefiksu ĝin kun la var ŝlosilvorto.

86
00:04:05,070 --> 00:04:07,750
En PHP ni farus ion
kiel tiu, dolaro signo x.

87
00:04:07,750 --> 00:04:09,950
Tiel estas kiel ni indikis
variablo, sed ne, ni

88
00:04:09,950 --> 00:04:12,060
ne mencii la tipo
de la variablo ajn.

89
00:04:12,060 --> 00:04:15,124
Ni dirus ion kiel
dolara signo x egalas 44 en PHP.

90
00:04:15,124 --> 00:04:17,040
Se ni faris la
samon en JavaScript,

91
00:04:17,040 --> 00:04:19,589
ni dirus var x egalas 44.

92
00:04:19,589 --> 00:04:22,780
Do var estas ia nia vojo
enkonduki variablon.

93
00:04:22,780 --> 00:04:26,850
Tio eble iom pli intuicia
ol nur dolaro signo variablo.

94
00:04:26,850 --> 00:04:29,080
>> Denove, ekde ekzistas neniu
datumtipoj, ni povus fari tion

95
00:04:29,080 --> 00:04:34,490
kun ajna datumtipo, kordoj,
io alia ĉiuj estus var.

96
00:04:34,490 --> 00:04:37,260
Conditionals, ĉiuj niaj
malnovaj amikoj de C kaj PHP

97
00:04:37,260 --> 00:04:41,640
estas ankoraŭ havebla, do ni havas se,
alie se, alie, ŝaltilo kaj demando

98
00:04:41,640 --> 00:04:42,240
markon dupunkto.

99
00:04:42,240 --> 00:04:45,890
Ŝaltilo ceteraj kiel fleksebla kiel
Estis en PHP, sed ĉiuj el tiuj vi estas

100
00:04:45,890 --> 00:04:46,930
konanta nun.

101
00:04:46,930 --> 00:04:49,900
Kaj simile kun cikloj estas
la malnovaj favoritos de dum,

102
00:04:49,900 --> 00:04:52,700
fari dum kaj por ankoraŭ disponebla por ni.

103
00:04:52,700 --> 00:04:55,880
Do jam ni scias multon de la
bazaj Javascript ia bazfaktoj

104
00:04:55,880 --> 00:05:01,800
nur virto de havado sufiĉe iomete
de scio nun pri C kaj PHP.

105
00:05:01,800 --> 00:05:03,670
>> Kio pri funkcioj en JavaScript?

106
00:05:03,670 --> 00:05:08,199
Nu, simila al PHP ĉiu funkcio estas
enkondukita kun la funkcion ŝlosilvorto.

107
00:05:08,199 --> 00:05:10,740
Vi diru funkcio, kaj tiam vi
komencas difini vian funkcion.

108
00:05:10,740 --> 00:05:12,531
Kio estas iom malsamaj
pri Ĝavoskripto,

109
00:05:12,531 --> 00:05:15,700
kvankam estas la kapablo havi
kio nomiĝas anonima funkcio.

110
00:05:15,700 --> 00:05:18,880
Do vi povas difini funkciojn
kiuj ne havas nomon.

111
00:05:18,880 --> 00:05:21,222
Tio estas io ni
vere ne vidis antaŭe.

112
00:05:21,222 --> 00:05:23,430
Ni vere uzas la koncepton
de anonima funkcio

113
00:05:23,430 --> 00:05:27,880
iom poste en tiu
video, ĉar ĝi devos

114
00:05:27,880 --> 00:05:31,530
fari iom pli sentita en kunteksto
kiam ni vidas ĝin en aparta situacio

115
00:05:31,530 --> 00:05:33,120
ke mi kreitaj tie.

116
00:05:33,120 --> 00:05:35,710
Sed ni simple rigardu
je kioma simpla Ĝavoskripto

117
00:05:35,710 --> 00:05:37,850
funkcio povus aspekti.

118
00:05:37,850 --> 00:05:40,610
>> Do mi iris antaŭen kaj
malfermis mia CS50 IDE

119
00:05:40,610 --> 00:05:43,690
kaj mi jam ruli Apache
komenci mian servilon kurante.

120
00:05:43,690 --> 00:05:46,800
Kaj mi havas tiun dosieron
malfermita nomita Home.html.

121
00:05:46,800 --> 00:05:48,330
Kaj mi zomi iom tie.

122
00:05:48,330 --> 00:05:52,090
Kaj baze, vi povas vidi la
Home.html estas nur aro da butonoj.

123
00:05:52,090 --> 00:05:55,291
Kaj mi asertas ĉe la supro tie
ke tiu estas la JavaScript sekcio

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

125
00:05:55,790 --> 00:05:59,490
Do ekzistas aro da butonoj tie,
sed kion tiuj butonoj reale fari?

126
00:05:59,490 --> 00:06:03,662
>> Nu, ni estrus super al mia IED,
kaj mi Home.html malfermu tie.

127
00:06:03,662 --> 00:06:05,620
Tuj en la komenco,
jen kien mi kunligi

128
00:06:05,620 --> 00:06:07,500
en ĉiuj miaj Javascript fontodosierojn.

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

130
00:06:08,000 --> 00:06:12,440
Do mi havas anonymous.js, clock.js,
Mi uzas la fonto atributo

131
00:06:12,440 --> 00:06:14,440
de la skripto etikedo por ligi en dosiero.

132
00:06:14,440 --> 00:06:18,660
Do mi ne skribis ajnan
Ĝavoskripto rekte en tiun dosieron,

133
00:06:18,660 --> 00:06:21,790
sed mi tiris en ĉiuj
Ĝavoskripto Mi verkis aparte.

134
00:06:21,790 --> 00:06:24,540
Kaj se ni rulumu malsupren tie, ĉi tiu
devus ĉiuj rigardi iomete familiara

135
00:06:24,540 --> 00:06:27,090
kun iom da novaj sintakso.

136
00:06:27,090 --> 00:06:32,655
Ni havas ĉi tie kaplinio etikedo por
funkcioj kaj tiam butonon.

137
00:06:32,655 --> 00:06:35,530
Mi havas enigaĵoj kiuj estas tipo butono,
kaj ŝajne kiam mi klakas ĝin,

138
00:06:35,530 --> 00:06:38,130
Mi tuj vokos iuj
funkcii atentigo dato.

139
00:06:38,130 --> 00:06:41,792
Kaj jen kiel ni povas ordigi de miksi supren
iomete de JavaScript kaj HTML.

140
00:06:41,792 --> 00:06:44,500
Ili fakte ludi bele bele
kune, kaj tiel ŝajne kiam

141
00:06:44,500 --> 00:06:48,730
Mi alklakas la butonon, mi tuj
voki iun funkcion atentigo dato.

142
00:06:48,730 --> 00:06:53,660
Kaj simile mi difinis kondutojn
por ĉiuj el la aliaj butonoj kiuj

143
00:06:53,660 --> 00:06:56,440
estas sur tiu home.html paĝo,
kiun ni observu revenanta

144
00:06:56,440 --> 00:06:59,172
al dum la paso de ĉi tiu video.

145
00:06:59,172 --> 00:07:00,880
Sed ni revenu supren
tie kaj rigardu

146
00:07:00,880 --> 00:07:03,850
ĉe clock.js, kiu estas la
JavaScript dosiero kiun mi

147
00:07:03,850 --> 00:07:07,370
skribis ke havas tiun unuan funkcion
ni tuj rigardu.

148
00:07:07,370 --> 00:07:11,630
Kiel vi povas vidi, mi komencas mian Ĝavoskripto
funkcii kun la ŝlosilvorto funkcio,

149
00:07:11,630 --> 00:07:14,560
kaj Mi donos cxi tiun unu a
nomo, ĝi nomiĝas atentigo dato.

150
00:07:14,560 --> 00:07:18,710
Ene de tie, mi ŝajne krei
nova loka variablo nomita aktuala dato.

151
00:07:18,710 --> 00:07:21,500
Kaj mi tuj asigni
egalan al nova dato.

152
00:07:21,500 --> 00:07:24,430
Kaj ni povus enir multajn
detale kia dato estas,

153
00:07:24,430 --> 00:07:27,060
kaj vere JavaScript estas tiom
granda ke ni neniel povas

154
00:07:27,060 --> 00:07:28,330
kovri ĉion en unu video.

155
00:07:28,330 --> 00:07:32,220
Sed sufiĉas diri, ĉi tiu tuj
reveni al mi datumoj ero ke

156
00:07:32,220 --> 00:07:35,470
personigas la aktualan daton kaj tempon.

157
00:07:35,470 --> 00:07:39,100
Mi stokante ke en variablo kiu mi estas
ŝajne tuj alarmos aktuala dato.

158
00:07:39,100 --> 00:07:41,300
>> Nu, kion faras atentigo
aktuala dato aspektas?

159
00:07:41,300 --> 00:07:46,460
Ni rigardu la dosieron mem
malantaŭeniri super en la retumilo fenestro.

160
00:07:46,460 --> 00:07:49,551
Do denove, ĉi tiu estas la butono kiun mi
ili ligis al tiu nomita funkcio.

161
00:07:49,551 --> 00:07:51,800
Kaj mi klakas ĝin tie kaj
rigardi kion ĝi faris, ĝi alarmis.

162
00:07:51,800 --> 00:07:56,140
Ĝi pusxis supren tian skatolon rakontanta
mi ke la nuna tempo estas, ŝajne

163
00:07:56,140 --> 00:07:59,370
ĝi estas novembro 4, je
10:43:43 matene.

164
00:07:59,370 --> 00:08:02,345
Kaj se mi klakas denove, nun
ĝi estas kelkaj sekundoj poste, ĉu ne?

165
00:08:02,345 --> 00:08:03,720
Do jen ĉio ĉi funkcio faras.

166
00:08:03,720 --> 00:08:07,670
Kiam mi klakas la butonon, ĝi
Popoj supren garde mesaĝo al mi.

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

168
00:08:13,806 --> 00:08:15,690
Do ekzistas vere ne
tro funkcioj

169
00:08:15,690 --> 00:08:19,110
jen malsamaj de PHP,
nur iomete da novaj sintakso

170
00:08:19,110 --> 00:08:22,500
kiu venas kun laborado kun JavaScript.

171
00:08:22,500 --> 00:08:24,650
>> Arrays en JavaScript estas
bela simpla.

172
00:08:24,650 --> 00:08:27,200
Deklari tabelo, oni uzu
la rektaj krampoj sintakso

173
00:08:27,200 --> 00:08:30,090
ke ni estas familiara kun de PHP.

174
00:08:30,090 --> 00:08:33,432
Kaj simila al PHP, ni
ankaŭ povas miksi datumtipoj.

175
00:08:33,432 --> 00:08:35,140
Do tiu tabelo, ambaŭ
de tiuj aroj estus

176
00:08:35,140 --> 00:08:36,960
esti perfekte legitima Javascript.

177
00:08:36,960 --> 00:08:42,500
Kiu estas ĉiuj entjeroj, kaj kiu
estas implikata malsamaj datumtipoj.

178
00:08:42,500 --> 00:08:45,020
>> Kio estas io tre malsama
en JavaScript, kvankam?

179
00:08:45,020 --> 00:08:47,020
Tio estas la nocio de objekto.

180
00:08:47,020 --> 00:08:50,240
Do eble vi jam aŭdis pri
objektema programado.

181
00:08:50,240 --> 00:08:53,370
Ni ne faras multe de ĝi en CS50,
sed ni faros iom de ĝi

182
00:08:53,370 --> 00:08:55,670
tie en la kunteksto de JavaScript.

183
00:08:55,670 --> 00:08:59,100
Nun JavaScript havas la kapablon
konduti kiel objekto orientita programado

184
00:08:59,100 --> 00:09:02,615
lingvo, sed ne estas mem
ekskluzive objektema

185
00:09:02,615 --> 00:09:03,490
programlingvo.

186
00:09:03,490 --> 00:09:05,281
Kaj tion denove venas
reen al kial mi diris,

187
00:09:05,281 --> 00:09:10,610
povas esti tre defia por lerni
Ĝavoskripto kiel via unua programado

188
00:09:10,610 --> 00:09:13,890
lingvo, ĉar ĝi ne
vere persvadi apartan paradigmo.

189
00:09:13,890 --> 00:09:16,430
>> C aliflanke estas
funkcia programlingvo.

190
00:09:16,430 --> 00:09:22,270
Se ni volas, funkcioj estas
ia The Big Boss Man, dekstra?

191
00:09:22,270 --> 00:09:24,410
Diktas kion
okazas ĉio alia.

192
00:09:24,410 --> 00:09:26,600
Ni volas ŝanĝi variablojn,
ni nomas funkcioj.

193
00:09:26,600 --> 00:09:28,220
Ni fari aferojn al funkcioj.

194
00:09:28,220 --> 00:09:31,250
Objektoj anstataŭe, en
objektema lingvo,

195
00:09:31,250 --> 00:09:35,937
objektoj ia iĝi la stelo kaj
funkcioj fariĝis ia malĉefa.

196
00:09:35,937 --> 00:09:38,270
Sed kio estas objekto, kio
estas tiu nocio de objekto?

197
00:09:38,270 --> 00:09:40,880
Nu, se ĝi helpas, pensu
pri ĝi ĉe unua speco

198
00:09:40,880 --> 00:09:44,540
de kiel C strukturo aŭ struct
ke ni lernis pri antaŭe.

199
00:09:44,540 --> 00:09:47,430
En C, strukturo enhavas
nombro de kampoj,

200
00:09:47,430 --> 00:09:51,174
kaj eble ni nun povus komenci
nomas tiujn kampojn propraĵoj.

201
00:09:51,174 --> 00:09:53,590
Sed la propraĵoj neniam vere
stari sur siaj propraj, ĉu ne?

202
00:09:53,590 --> 00:09:56,410
Se mi difini strukturon por aŭto
kiel tiu kun la sekvaj du

203
00:09:56,410 --> 00:10:00,750
kampoj aŭ proprietoj, unu al
entjero por la jaro de la aŭto

204
00:10:00,750 --> 00:10:04,290
kaj alia de 10 karaktero
ŝnuro por la modelo de la aŭto,

205
00:10:04,290 --> 00:10:07,150
Mi povas diri ion kiel tion,
Mi povas deklari nova variablo

206
00:10:07,150 --> 00:10:10,080
de tipo struct aŭto Herbie.

207
00:10:10,080 --> 00:10:13,730
Kaj tiam mi povas diri ion
kiel herbie.year egalas 1.963,

208
00:10:13,730 --> 00:10:15,850
kaj herbie.model egalas Beetle.

209
00:10:15,850 --> 00:10:17,000
Estas bone.

210
00:10:17,000 --> 00:10:19,680
Mi uzas la kampojn en la
kunteksto de la strukturo,

211
00:10:19,680 --> 00:10:22,290
sed mi neniam povus simple
diri ion kiel tion.

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

213
00:10:22,790 --> 00:10:26,836
Mi ne povas uzi la kampo nomo
sendependa de la strukturo.

214
00:10:26,836 --> 00:10:28,210
Ĝi estas speco de fundamenta afero.

215
00:10:28,210 --> 00:10:32,990
>> Do kampoj esti
fundamenta por C strukturoj

216
00:10:32,990 --> 00:10:39,050
estas tre similaj al propraĵoj esti
fundamenta por Ĝavoskripto objektoj.

217
00:10:39,050 --> 00:10:42,080
Sed kio igas ilin
aparte interesaj

218
00:10:42,080 --> 00:10:46,230
estas ke objektoj povas havi ankaŭ kio
estas nomitaj metodoj, kiuj estas vere

219
00:10:46,230 --> 00:10:50,730
nur ornama vorto por funkcioj kiuj
estas propra al la objekto ankaŭ.

220
00:10:50,730 --> 00:10:55,340
Do ĝi estas funkcio kiu povas nur esti
nomita en la kunteksto de objekto.

221
00:10:55,340 --> 00:10:59,200
Nur objekto kiu difinis
tiu funkcio ene de liaj,

222
00:10:59,200 --> 00:11:02,020
se vi pensas pri
struct, la funkcio

223
00:11:02,020 --> 00:11:05,720
estas difinita ene tiuj difinanta
krispa krampoj de la strukturo.

224
00:11:05,720 --> 00:11:07,980
Do ĝi nur signifas io
al la strukturo.

225
00:11:07,980 --> 00:11:10,960
Kaj tio estas speco de kion ni faras
tie kun celoj kaj metodoj.

226
00:11:10,960 --> 00:11:13,580
Estas esence kiel ni estas
difini funkcio kiu

227
00:11:13,580 --> 00:11:16,670
nur havas sencon en
aparta objekto, kaj tiel ni

228
00:11:16,670 --> 00:11:19,440
voku ke metodo de la objekto.

229
00:11:19,440 --> 00:11:23,180
Kaj ni neniam plu nomas tion
funkcio sendependa de la objekto,

230
00:11:23,180 --> 00:11:29,260
same kiel ni ne povas diri jaro aŭ modelo
sendependa de la struct en C.

231
00:11:29,260 --> 00:11:32,300
>> Do funkcia programado
paradigmoj aspektas tiel.

232
00:11:32,300 --> 00:11:35,450
Funkcio kaj tiam kiam vi pasas
en la celo kiel parametro.

233
00:11:35,450 --> 00:11:38,650
En objektema programado
lingvoj, ĉi tia ricevas

234
00:11:38,650 --> 00:11:43,464
spegulita, kaj ni pensas pri
ĝi ŝatas ĉi, object.function.

235
00:11:43,464 --> 00:11:45,380
Do ia ke skalara
operatoro denove implicante

236
00:11:45,380 --> 00:11:49,540
ke ĝi estas iu speco de proprieto
aŭ atributo de la objekto mem.

237
00:11:49,540 --> 00:11:53,240
Sed jen kion objekto
orientita programlingvo

238
00:11:53,240 --> 00:11:57,150
plenumadu fari funkcio
vokas metodon, denove, kiu

239
00:11:57,150 --> 00:12:00,260
estas nur speciala vorto por funkcio
kiu estas esence propra al objekto.

240
00:12:00,260 --> 00:12:03,440
Jen kion tiu
sintakso povus aspekti.

241
00:12:03,440 --> 00:12:09,360
Kaj tial ni komencas vidi iujn de
tion en la kunteksto de JavaScript.

242
00:12:09,360 --> 00:12:12,470
>> Vi povas ankaŭ pensi pri objekto
ia kiel asocieca tabelo,

243
00:12:12,470 --> 00:12:14,160
kiu ni estas konataj kun de PHP.

244
00:12:14,160 --> 00:12:17,720
Memoru asocieca tabelo permesas
ni havos ŝlosilo valoro paroj, anstataŭ

245
00:12:17,720 --> 00:12:23,040
havi indeksoj 0, unu, du, tri,
kaj tiel plu kiel estas kutimitaj de C

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

247
00:12:23,940 --> 00:12:27,472
Asocia arrays povas mapi
vortoj, kiel en la PHP vídeo,

248
00:12:27,472 --> 00:12:29,180
ni parolis pri
ĉapelaĵoj de picoj.

249
00:12:29,180 --> 00:12:31,180
Kaj do ni havis tabelo
nomita picoj, kaj ni

250
00:12:31,180 --> 00:12:36,670
havis fromaĝo estis ŝlosila kaj $ 8.99 estis la
valoron, kaj tiam pepperoni estis ŝlosila,

251
00:12:36,670 --> 00:12:39,190
$ 9.99 estis valoro, kaj tiel plu.

252
00:12:39,190 --> 00:12:43,300
Kaj tial ni povas pensi ankaŭ pri
kontesti ia simila al asocieca

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

254
00:12:43,840 --> 00:12:47,020
Kaj do ĉi tie sintakso
kreus novan objekton

255
00:12:47,020 --> 00:12:50,950
nomata Herbie kun du
propraĵoj ene de ĝi.

256
00:12:50,950 --> 00:12:57,310
Jaro, kiu estas atribuita la valoro 1963,
kaj modelo, kiu estas atribuita la kordo

257
00:12:57,310 --> 00:12:58,140
Skarabo.

258
00:12:58,140 --> 00:13:01,770
>> Kaj rimarki tie, ke mi uzas
sola citaĵoj en JavaScript.

259
00:13:01,770 --> 00:13:05,570
Vi povas uzi sola aŭ duobla citaĵoj
kiam vi parolas pri kordoj.

260
00:13:05,570 --> 00:13:07,772
Estas nur konvencie
la kazo ke plejfoje

261
00:13:07,772 --> 00:13:10,230
kiam vi verkas JavaScript,
vi simple uzi solan citaĵoj.

262
00:13:10,230 --> 00:13:15,050
Sed mi povus uzi citiloj ĉi tie, kaj
ke estus perfekte bone ankaŭ.

263
00:13:15,050 --> 00:13:17,470
>> Do memoru kiom en
PHP ni havis tiun nocion

264
00:13:17,470 --> 00:13:22,730
de a por ĉiu buklo kiu permesus nin
persisti super ĉiuj el la ŝlosilaj valoro

265
00:13:22,730 --> 00:13:25,270
paroj de asocieca
tabelo, ĉar ni

266
00:13:25,270 --> 00:13:29,050
ne havis tiun kapablecon persisti
tra 0, unu, du, tri, kvar,

267
00:13:29,050 --> 00:13:30,710
kaj tiel Plu?

268
00:13:30,710 --> 00:13:35,010
Javascript havas ion tre simila,
sed ne nomas lin por ĉiu ciklo,

269
00:13:35,010 --> 00:13:38,960
ĝi nomiĝas cxar en cikloj.

270
00:13:38,960 --> 00:13:42,890
Do se mi diris min ŝatas
tiu, por var ŝlosilo en objekto,

271
00:13:42,890 --> 00:13:48,670
tio estas ia simila al jene
por ĉiu ion kiel ion.

272
00:13:48,670 --> 00:13:53,850
Sed ĉiuj mi faras ĉi tie estas ripetanta
tra ĉiuj klavoj de mia objekto.

273
00:13:53,850 --> 00:13:56,070
Kaj ene de la frizita
krampoj tie, mi farus

274
00:13:56,070 --> 00:14:03,410
uzi objekton kvadrataj krampoj ŝlosilo por rilati
al la valoro je tiu ŝlosilo situon.

275
00:14:03,410 --> 00:14:05,400
>> Alternative, ekzistas
eĉ alian alproksimiĝon.

276
00:14:05,400 --> 00:14:10,880
Se mi nur nur zorgas pri la
valoroj, mi povas diri por ŝlosilo de objekto,

277
00:14:10,880 --> 00:14:12,360
kaj nur uzi ŝlosilon ene.

278
00:14:12,360 --> 00:14:17,240
Do por var ŝlosilo en objekto, mi havas
uzi objekton rektaj krampoj

279
00:14:17,240 --> 00:14:19,340
ŝlosilo ene la buklo.

280
00:14:19,340 --> 00:14:24,580
Por var ŝlosilo de objekto, mi povas
nur uzi ŝlosilon ene la buklo,

281
00:14:24,580 --> 00:14:29,040
ĉar mi estas nur intence
parolante pri la valoroj tie.

282
00:14:29,040 --> 00:14:32,630
>> Do ni eble prenos
rigardu la diferencon

283
00:14:32,630 --> 00:14:35,670
nur por rapide montri vin
la diferenco inter kvar

284
00:14:35,670 --> 00:14:40,730
en kaj por el kun tre specifa
tabelo, kiun ni havas ĉi tie, semajno tabelo.

285
00:14:40,730 --> 00:14:43,616
Do mi devos trovi novan tabelo
ke mi plenigis kun sep kordoj,

286
00:14:43,616 --> 00:14:46,240
Lundo, mardo, merkredo,
Ĵaŭdo, vendredo, sabato, dimanĉo.

287
00:14:46,240 --> 00:14:50,530
Kaj mi volas nun persisti
tra ĉi tabelo,

288
00:14:50,530 --> 00:14:53,090
presi el certaj informoj.

289
00:14:53,090 --> 00:14:58,780
Se mi uzas por en buklo
elprinti informo,

290
00:14:58,780 --> 00:15:00,710
Kio vi pensas mi tuj ricevis?

291
00:15:00,710 --> 00:15:01,710
Nu, ni rigardu.

292
00:15:01,710 --> 00:15:05,300
Kaj antaŭ ol ni salti super
al mia retumilo fenestro,

293
00:15:05,300 --> 00:15:08,090
nur koni ke
console.log estas ia unu

294
00:15:08,090 --> 00:15:10,630
maniero fari print F en JavaScript.

295
00:15:10,630 --> 00:15:12,040
Sed kio estas la konzolo?

296
00:15:12,040 --> 00:15:14,940
Nu, jen kion ni iras
iri rigardu nun.

297
00:15:14,940 --> 00:15:16,850
>> Bone, do ni estas reen tie
en mia retumilo fenestro,

298
00:15:16,850 --> 00:15:19,410
kaj mi tuj malfermu
mian programisto iloj.

299
00:15:19,410 --> 00:15:22,290
Denove, mi simple frapanta F12
malfermiĝi programisto iloj.

300
00:15:22,290 --> 00:15:25,670
Kaj rimarki ke tie ĉe la
supro mi elektis konzolo.

301
00:15:25,670 --> 00:15:28,480
Do tiu estas la nocio
de desarrollador konzolon,

302
00:15:28,480 --> 00:15:30,500
kaj ĝi permesos nin
presi informon eksteren,

303
00:15:30,500 --> 00:15:33,000
ia kiel la terminalo, sed
kiel vi vidos iom poste,

304
00:15:33,000 --> 00:15:37,720
ni povas ankaŭ tajpi informo en
interagi kun nia retpaĝo.

305
00:15:37,720 --> 00:15:42,320
Mi tuj zomi iom tie,
kaj mi estas gonna nun alklaku cxar en testo.

306
00:15:42,320 --> 00:15:45,230
Kaj kvar en test-- mi ne gonna
montri al vi la kodon por ĝi nun,

307
00:15:45,230 --> 00:15:47,479
sed vi ricevos ĝin se vi
elŝuti la fontkodon ke

308
00:15:47,479 --> 00:15:50,380
asociita kun ĉi video--
Estas nur ke por en buklo

309
00:15:50,380 --> 00:15:52,610
ke ni vidis nur
dua antaŭe sur la glito.

310
00:15:52,610 --> 00:15:54,810
>> Do mi estas gonna klako ke
butonon, kaj super tie,

311
00:15:54,810 --> 00:15:58,440
jen kion estas presita en la
konzolon, 0, unu, du, tri, kvar, kvin,

312
00:15:58,440 --> 00:15:58,940
ses.

313
00:15:58,940 --> 00:16:02,490
Mi ne presi la informo
interne tiuj tabelo lokoj,

314
00:16:02,490 --> 00:16:05,180
ĉar mi uzis cxar en buklo.

315
00:16:05,180 --> 00:16:10,670
Kaj ene de la korpo de la ciklo, mi
nur presita eksteren ŝlosilo ne kontestas ŝlosilo.

316
00:16:10,670 --> 00:16:18,600
Sed se mi nun purigi mian konzolon, kaj mi
ŝanĝi al cxar de testo, kaj kvar de testo

317
00:16:18,600 --> 00:16:22,500
Mi diras mi uzas por buklo
anstataŭ kaj elprinti ŝlosilo,

318
00:16:22,500 --> 00:16:28,079
se mi klakas ke, nun mi ricevas la
faktaj elementoj interne de mia objekto

319
00:16:28,079 --> 00:16:29,120
aŭ mia tabelo en ĉi tiu kazo.

320
00:16:29,120 --> 00:16:31,760
Mia tabelo de semajno tagoj.

321
00:16:31,760 --> 00:16:33,480
Mi presis el lundo,
Mardo, merkredo.

322
00:16:33,480 --> 00:16:36,930
Do jen la diferenco inter
a por buklo en kiu presas el

323
00:16:36,930 --> 00:16:43,410
nur la klavoj se vi simple uzi ŝlosilo
ene de la korpo de la ciklo,

324
00:16:43,410 --> 00:16:46,850
kaj por buklo, kio presaĵoj
el la valoroj se vi uzas nur

325
00:16:46,850 --> 00:16:48,870
ŝlosilo ene la korpo de la iteracio.

326
00:16:48,870 --> 00:16:52,380
>> Bone, kiel ni nun komencas
concatenate kordoj kaj eble miksi supren

327
00:16:52,380 --> 00:16:57,220
iuj variabloj kun interpolado
kiel ni povis fari en PHP?

328
00:16:57,220 --> 00:16:59,410
Nu, ni estas bela familiara
kun tiu de PHP.

329
00:16:59,410 --> 00:17:04,109
Jen kiel ni farus ĝin uzante la
skalara operatoro al concatenate kordoj.

330
00:17:04,109 --> 00:17:06,260
En JavaScript, kvankam,
ni fakte uzi ion

331
00:17:06,260 --> 00:17:09,290
nomata plus operatoro, kiu
Estas eble eĉ iomete pli

332
00:17:09,290 --> 00:17:10,470
intuicia, dekstra?

333
00:17:10,470 --> 00:17:12,609
Ni aldonante faskon
de kordoj kune.

334
00:17:12,609 --> 00:17:14,520
Do ni direktas denove
transiri kaj vidi kion ĉi

335
00:17:14,520 --> 00:17:18,693
presos se ni provas presi
ĉiuj la informo en semajno tabelo.

336
00:17:18,693 --> 00:17:20,859
Bone, do sub tien
sub kordoj kunmeto,

337
00:17:20,859 --> 00:17:24,822
Mi havas du eblojn, kordoj konstruaĵo
V1 kaj tiam string konstruaĵo V2.

338
00:17:24,822 --> 00:17:26,530
Kaj ni vidos kial ni
bezonas V2 en sekundo.

339
00:17:26,530 --> 00:17:28,610
Sed mi estas gonna alklaku
string konstruaĵo V1, kiu

340
00:17:28,610 --> 00:17:30,360
estas la kodo ni estis
nur prenante rigardu,

341
00:17:30,360 --> 00:17:32,980
la console.log kun ĉiuj de la plusoj.

342
00:17:32,980 --> 00:17:35,910
Ni vidu se ĉi presaĵoj
kion ni atendas.

343
00:17:35,910 --> 00:17:39,939
>> Lundo estas tago numero 01 de la semajno,
Mardo estas tago numero 11 de la semajno.

344
00:17:39,939 --> 00:17:41,730
Nu, kion mi provis
fari estis akiri

345
00:17:41,730 --> 00:17:46,280
ĝi presi lundo estas tago nombro
unu, Mardo estas tago numero du.

346
00:17:46,280 --> 00:17:50,140
Sed ŝajnas kiel mi
ĉiam presi el tiu.

347
00:17:50,140 --> 00:17:51,260
Nu, kial do?

348
00:17:51,260 --> 00:17:55,600
Nu, tio rezultas, preni alian rigardon
ĉe ĉi tiu malgranda fragmento de kodo tie.

349
00:17:55,600 --> 00:18:00,160
Rimarku ke ni uzas la alpago
operatoro en du malsamaj kuntekstoj.

350
00:18:00,160 --> 00:18:03,221
>> Kaj do tie estas kie eble aferoj
ke ni ia estintaj dirante:

351
00:18:03,221 --> 00:18:03,970
Ho, estas tiel granda.

352
00:18:03,970 --> 00:18:05,910
Ni ne trakti datumtipoj anymore.

353
00:18:05,910 --> 00:18:08,220
Sed ĉi tie estas kie la fakto
ke ni perdas datumtipoj

354
00:18:08,220 --> 00:18:10,960
povas efektive esti iom
de problemo por ni.

355
00:18:10,960 --> 00:18:16,260
Nun ke la plus operatoro estas uzata por
concatenate kordoj kaj aldoni nombroj

356
00:18:16,260 --> 00:18:19,550
kune, JavaScript havas
fari lian plej bonan divenon

357
00:18:19,550 --> 00:18:22,030
kiel al kion mi volas fari por mi.

358
00:18:22,030 --> 00:18:23,900
Kaj en ĉi tiu kazo, ĝi divenis malĝuste.

359
00:18:23,900 --> 00:18:29,340
Ĝi ĵus seria tago, kio estus
0, unu, du, tri, kvar, kvin, aŭ ses,

360
00:18:29,340 --> 00:18:32,060
kaj tiam ĝi simple kroĉitaj
ke kaj tiam kroĉitaj unu.

361
00:18:32,060 --> 00:18:35,020
Ĝi ne fakte adicii ilin kune.

362
00:18:35,020 --> 00:18:37,320
Kaj tial tiuj lingvoj,
PHP kaj Javascript,

363
00:18:37,320 --> 00:18:39,196
ke abstrae for
ĉi nocio de tipoj,

364
00:18:39,196 --> 00:18:40,820
vi ne devas trakti ĝin anymore.

365
00:18:40,820 --> 00:18:43,600
Ili ankoraŭ havas tipojn sub la kapuĉo.

366
00:18:43,600 --> 00:18:46,780
Kaj ni povas, en situacioj
kiel tiu, utiligi tiun fakton

367
00:18:46,780 --> 00:18:49,240
dirante ion
kiel eble tiun, kiu

368
00:18:49,240 --> 00:18:53,210
estas diranta Ĝavoskripto, per la
maniero, trakti tion kiel entjero,

369
00:18:53,210 --> 00:18:57,100
ne traktas ĝin kiel linio, eĉ
kvankam ni miksante kune kordoj

370
00:18:57,100 --> 00:18:58,940
kaj entjeroj tie.

371
00:18:58,940 --> 00:19:02,204
>> Estas nur unu el tiuj aĵoj
ke ĝi ŝajnas tiel granda en kunteksto

372
00:19:02,204 --> 00:19:04,120
ke ni ne devas
trakti tipoj plu,

373
00:19:04,120 --> 00:19:05,828
Sed foje vi instruos vin
kolizii situacio

374
00:19:05,828 --> 00:19:09,110
precize kiel tiu kie la fakto ke
vi ne havas kontrolon super tipoj

375
00:19:09,110 --> 00:19:11,220
povas miskarburi sur vi
se vi ne estas zorgema.

376
00:19:11,220 --> 00:19:18,285
Kaj do se ni pop reen inte al IDE, mi estas
tuj liberigi el mia konzolo denove,

377
00:19:18,285 --> 00:19:20,660
kaj mi tuj klaku kordo
konstruaĵo versio du, kiu

378
00:19:20,660 --> 00:19:23,052
Tie estas kie mi uzas ke parse int funkcio.

379
00:19:23,052 --> 00:19:25,260
Nun ĝi estas presi el
informo kiun mi atendis.

380
00:19:25,260 --> 00:19:29,330
Lundo la tago numero unu, mardo
estas tago numero du, kaj tiel plu.

381
00:19:29,330 --> 00:19:31,170
>> Do ni parolu pri funkcioj denove.

382
00:19:31,170 --> 00:19:34,790
Mi promesis ni parolus pri anonima
funkcioj, kaj nun la kunteksto por ke

383
00:19:34,790 --> 00:19:36,360
finfine alvenis.

384
00:19:36,360 --> 00:19:39,980
Do antaŭ ol ni faras tion, ni parolu alian fojon
pri arrays por nur sekundo.

385
00:19:39,980 --> 00:19:42,120
Do tabeloj estas speciala
kazo de objekto.

386
00:19:42,120 --> 00:19:45,180
Fakte, ĉiu en
JavaScript estas fakte objekto.

387
00:19:45,180 --> 00:19:47,190
Do funkcioj estas
speciala kazo de objekto,

388
00:19:47,190 --> 00:19:49,770
entjeroj estas speciala
kazo de objekto,

389
00:19:49,770 --> 00:19:52,152
sed arrays specife
havas kelkajn metodojn.

390
00:19:52,152 --> 00:19:55,110
Memoru ĉar ili estas objektoj,
ili povas havi proprietojn kaj metodoj.

391
00:19:55,110 --> 00:19:58,600
Ili havas kelkajn metodojn kiuj
povas esti aplikata al tiuj celoj.

392
00:19:58,600 --> 00:20:01,197
Ekzistas metodo nomata
grandeco, array.size,

393
00:20:01,197 --> 00:20:03,030
kiu redonos al
vin kiel vi povus atendi

394
00:20:03,030 --> 00:20:05,120
la nombro de elementoj en via tabelo.

395
00:20:05,120 --> 00:20:08,480
array.pop, ia kiel
nia nocio de krevanta for

396
00:20:08,480 --> 00:20:11,110
de stako, se vi memoras
el niaj stakoj vídeo,

397
00:20:11,110 --> 00:20:13,810
forigas la lasta elemento de la tabelo.

398
00:20:13,810 --> 00:20:17,110
array.push aldonas novan elementon
al la fino de tabelo.

399
00:20:17,110 --> 00:20:20,910
array.shift estas ia
kiel DQ, ĝi splisas eksteren

400
00:20:20,910 --> 00:20:23,610
la unua elemento de tabelo.

401
00:20:23,610 --> 00:20:27,549
>> Sed ekzistas ankaŭ alia speciala
metodo de tabelo nomata mapo.

402
00:20:27,549 --> 00:20:29,340
Kaj ĉi tiu estas speco de
Interesa koncepto.

403
00:20:29,340 --> 00:20:30,930
Do kio estas la ideo de mapo?

404
00:20:30,930 --> 00:20:33,880
Vi vere vidi ĉi
en pluraj aliaj lingvoj,

405
00:20:33,880 --> 00:20:38,550
kaj ni ne parolas pri
ia cartógrafos mapi tie,

406
00:20:38,550 --> 00:20:41,480
ni parolas pri surĵeto funkcio.

407
00:20:41,480 --> 00:20:44,110
En la kunteksto ni estas
parolas tie, mapo

408
00:20:44,110 --> 00:20:47,950
estas speciala operacio ni
povas rezulti sur tabelo

409
00:20:47,950 --> 00:20:51,630
apliki aparta funkcio
por ĉiu ero de tiu tabelo.

410
00:20:51,630 --> 00:20:55,190
kaj do ni dirus en
ĉi kazo, eble array.map,

411
00:20:55,190 --> 00:21:00,330
kaj ene de ĝi, ni pasante
en mapo estas funkcio kiu ni volas

412
00:21:00,330 --> 00:21:02,430
esti aplikita al ĉiu unuopa elemento.

413
00:21:02,430 --> 00:21:07,299
Do ĝi estas speco de analogaj al uzanta
buklo persisti super ĉiu ero

414
00:21:07,299 --> 00:21:09,340
kaj apliki apartan
funkcii al ĉiu ero,

415
00:21:09,340 --> 00:21:14,830
nur JavaScript havas ĉi enkonstruita
nocio de surĵeto kiu povas esti aplikita.

416
00:21:14,830 --> 00:21:19,700
Kaj tiu estas granda kunteksto
paroli pri anonima funkcio.

417
00:21:19,700 --> 00:21:22,370
>> Do diru ni havas
tiu tabelo de entjeroj.

418
00:21:22,370 --> 00:21:25,370
Ĝi nomiĝas núms, kaj ĝi estas atingis kvin
aferoj en ĝi, oni, du, tri, kvar,

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

420
00:21:26,410 --> 00:21:30,620
Nun mi volas mapi iuj
funkcio sur al ĉi tabelo.

421
00:21:30,620 --> 00:21:34,337
Mi volas havi funkcion apliki
por ĉiu ero de la tabelo.

422
00:21:34,337 --> 00:21:37,420
Nu, ni diru ke kion mi volas
fari estas simple duobligi ĉiujn la elementoj.

423
00:21:37,420 --> 00:21:42,520
Kion mi povus fari estas simple uzi buklo
por var mi egalas 0, mi estas malpli ol

424
00:21:42,520 --> 00:21:47,390
aŭ egala al 4, mi plie, pli, kaj
tiam duobligi ĉiun numeron.

425
00:21:47,390 --> 00:21:49,580
Sed mi povas ankaŭ fari ion kiel tiu.

426
00:21:49,580 --> 00:21:53,420
Mi povas diri núms antaŭe
unu, du, tri, kvar, kvin,

427
00:21:53,420 --> 00:21:58,310
Nuntempe, tamen, mi ŝatus ke vi
apliki surĵeto sur ĉi tabelo

428
00:21:58,310 --> 00:22:00,400
kie mi ŝatus vin
duobligi ĉiun numeron.

429
00:22:00,400 --> 00:22:02,540
Kaj tio estas ĝuste
kio okazas ĉi tie.

430
00:22:02,540 --> 00:22:06,870
Sed rimarki kion mi pasante
en kiel la argumento por mapi.

431
00:22:06,870 --> 00:22:09,080
Jen anonima funkcio.

432
00:22:09,080 --> 00:22:11,140
Kaj rimarki mi ne donis
tiu funkcio nomon,

433
00:22:11,140 --> 00:22:13,290
Mi nur donis gxin parametro listo.

434
00:22:13,290 --> 00:22:16,370
Kaj tiel tio estas ekzemplo
de anonima funkcio.

435
00:22:16,370 --> 00:22:21,270
>> Ni ĝenerale neniam nomas tiun
funkcio ekster la kunteksto de mapo.

436
00:22:21,270 --> 00:22:24,110
Ni difinante ĝin kiel parametro
mapi, kaj do ni ne vere

437
00:22:24,110 --> 00:22:27,910
bezonas havi nomon por ĝi, se la
Lin sola kiu lin importas estas mapo

438
00:22:27,910 --> 00:22:30,339
kaj ĝin difinis dekstra
tie interne de mapo.

439
00:22:30,339 --> 00:22:31,880
Kaj tiel tio estas anonima funkcio.

440
00:22:31,880 --> 00:22:34,680
Ni ne povis
fari tion antaŭe.

441
00:22:34,680 --> 00:22:38,400
Mapo iu funkcio kiu
akceptas unu parametro, num,

442
00:22:38,400 --> 00:22:41,890
kaj kion tiu funkcio faras
Estas revenas num fojojn 2.

443
00:22:41,890 --> 00:22:45,330
Kaj do post tiu
mapado estis aplikita,

444
00:22:45,330 --> 00:22:50,090
tiu estas nun kio núms rigardoj
kiel, du, kvar, ses, ok, 10.

445
00:22:50,090 --> 00:22:52,090
Kaj ni vidos pop super al mia
retumilo fenestro kaj ĵus

446
00:22:52,090 --> 00:22:55,240
rigardu ĉi
vere rapide tiel.

447
00:22:55,240 --> 00:22:58,000
>> Do mi havas alian butono tie
en mia hejmpaĝo nomas duobla.

448
00:22:58,000 --> 00:23:03,570
Kiam mi klakas duobla, kaj ĝi rakontas
mi antaux gxi estis unu, du, tri, kvar,

449
00:23:03,570 --> 00:23:07,250
kvin post du, kvar, ses, ok, 10.

450
00:23:07,250 --> 00:23:11,930
Kaj se mi iros tien kaj klaku duobla
denove, du, kvar, ses, ok, 10.

451
00:23:11,930 --> 00:23:17,400
Kaj tiam poste, kvar,
ok, 12, 16, kaj tiam 20.

452
00:23:17,400 --> 00:23:20,440
Kaj kion mi faras en ĉi tiu funkcio?

453
00:23:20,440 --> 00:23:25,210
Nu, se ni nur malfermu super al IDE, kaj
Mi eltiros mian anoniman funkcion, tie

454
00:23:25,210 --> 00:23:28,780
sur linio sep tra 13, mi estas
faranta iomete delikataĵon tie,

455
00:23:28,780 --> 00:23:32,240
sed mi simple presi el
kio estas aktuale en la tabelo.

456
00:23:32,240 --> 00:23:36,580
Tiam sur linio 16, 17,
kaj 18, tie estas mia mapo.

457
00:23:36,580 --> 00:23:40,930
Tie estas kie mi aplikanta ĉi duobligo
funkcio por ĉiu ununura ero.

458
00:23:40,930 --> 00:23:43,530
Kaj tiam iom pli sube,
Mi nur faras la samon

459
00:23:43,530 --> 00:23:46,640
Mi faris antaŭe, krom nun mi estas
presi el la enhavon de la tabelo

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

461
00:23:48,167 --> 00:23:50,500
Sed ĉiuj mi faris tie estas
nur uzi anonima funkcio

462
00:23:50,500 --> 00:23:53,640
mapi tra tuta tabelo.

463
00:23:53,640 --> 00:23:58,466
>> Do unu pli granda temo por raporti en
JavaScript estas la nocio de okazaĵo.

464
00:23:58,466 --> 00:24:01,590
Okazaĵo estas iu kiu nur okazas
kiam uzanto interagas kun via retejo

465
00:24:01,590 --> 00:24:04,715
paĝo, do eble ili klaku io,
aŭ eble la paĝo estas finita ŝarĝo,

466
00:24:04,715 --> 00:24:07,200
aŭ eble ili jam kopiis
ilian muson super io,

467
00:24:07,200 --> 00:24:09,290
aŭ ili tajpis ion
en eniga kampo.

468
00:24:09,290 --> 00:24:14,260
Ĉiuj de ĉi tiuj aferoj estas okazaĵoj
kiu donas sur nia retpaĝo.

469
00:24:14,260 --> 00:24:17,460
Kaj JavaScript havas la
kapablon apogi ion

470
00:24:17,460 --> 00:24:21,760
nomata eventa traktilo, kion
Estas callback funkcio kiu

471
00:24:21,760 --> 00:24:23,329
respondas html okazaĵo.

472
00:24:23,329 --> 00:24:24,620
Kaj kio estas callback funkcio?

473
00:24:24,620 --> 00:24:27,328
Nu, estas ĝenerale nur alia
citi por anonima funkcio.

474
00:24:27,328 --> 00:24:30,170
Ĝi estas funkcio kiu
Respondas al okazaĵo.

475
00:24:30,170 --> 00:24:34,130
Kaj tio estas kie ni atingos la
ideo de ligado certaj funkcioj

476
00:24:34,130 --> 00:24:38,060
al aparta html atributo.

477
00:24:38,060 --> 00:24:41,420
Plej html elementoj havas
subteno por atributo

478
00:24:41,420 --> 00:24:45,170
ke ni ne parolis pri en la html
vídeo por iu kiel sur klako

479
00:24:45,170 --> 00:24:50,540
aŭ sur ŝvebado aŭ sur ŝarĝo,
ĉiuj el tiuj okazaĵoj

480
00:24:50,540 --> 00:24:53,120
ke vi povas tiam skribi funkcioj
kiu traktas tiujn eventojn

481
00:24:53,120 --> 00:24:56,090
kiam tiuj okazaĵoj
okazas sur via retpaĝo.

482
00:24:56,090 --> 00:24:59,170
>> Kaj do eble via html
aspektas io tiamaniere.

483
00:24:59,170 --> 00:25:02,240
Kaj mi havas du butonojn tie,
butono unu kaj butono du,

484
00:25:02,240 --> 00:25:04,620
kaj tie mi havas aktuale
difinita nenion,

485
00:25:04,620 --> 00:25:11,170
sed ĉi tiu estas kie la atributo sur
klako estas ŝajne parto de mia html etikedo.

486
00:25:11,170 --> 00:25:15,220
Do ŝajne kiam mi difini kio estas
daŭriganta ene de tiu atributo,

487
00:25:15,220 --> 00:25:18,590
ĝi tuj estos kelkaj Ĝavoskripto
funkcio kiu respondas al la okazaĵo

488
00:25:18,590 --> 00:25:24,360
supozeble de klakanta sur
butono unu aŭ butono du.

489
00:25:24,360 --> 00:25:28,580
>> Kio estas speco de cool pri ĉi estas ni
povas skribi genérico okazaĵo traktilo.

490
00:25:28,580 --> 00:25:32,370
Kaj tiu evento Handler volo
krei eventon objekto.

491
00:25:32,370 --> 00:25:37,000
Kaj la evento objekto informos nin
kiu el la du butonoj estis klakita.

492
00:25:37,000 --> 00:25:38,064
Nun kiel faras tiun laboron?

493
00:25:38,064 --> 00:25:39,730
Nu, ĝi eble aspektas tiel.

494
00:25:39,730 --> 00:25:44,860
Do ni unue difini nian butonoj
havi respondon al la callback

495
00:25:44,860 --> 00:25:47,470
funkcio kiu nomos
kiam la butono estas klakita,

496
00:25:47,470 --> 00:25:49,520
ni vokos okazaĵo atentigo nomo.

497
00:25:49,520 --> 00:25:53,320
Kaj rimarki en ambaŭ kazoj ni
pasante en tiu okazaĵo parametro.

498
00:25:53,320 --> 00:25:55,460
Do ni nomas tiun funkcion
aŭ kiam ĉi tiu funkcio

499
00:25:55,460 --> 00:26:00,330
Estas lanĉita de la okazaĵo okazas,
ĝi tuj kreos tiun eventon objekto

500
00:26:00,330 --> 00:26:03,300
kaj fordoni kiel
parametro atentigi nomo.

501
00:26:03,300 --> 00:26:07,270
Kaj tiu evento estas objekto
tuj enhavos informon

502
00:26:07,270 --> 00:26:09,800
pri kiu butono estis klakita.

503
00:26:09,800 --> 00:26:11,580
Kaj kiel ĝi faras tion?

504
00:26:11,580 --> 00:26:13,654
Nu, ĝi eble aspektas tiel.

505
00:26:13,654 --> 00:26:15,570
Do nun en mia aparta
JavaScript dosiero, mi povus

506
00:26:15,570 --> 00:26:17,420
devos trovi tiun
funkcio alert nomon,

507
00:26:17,420 --> 00:26:19,500
denove akceptas ke okazaĵo parametro.

508
00:26:19,500 --> 00:26:24,640
Kaj tiam tie estas kie mi estas eltrovanta
kiu butono estis ekigita,

509
00:26:24,640 --> 00:26:28,100
var ellasilon egalas okazaĵo
skalara fonto elemento.

510
00:26:28,100 --> 00:26:33,150
Kio estis la fonto kiu kreis
tiu okazaĵo objekto kiu estis pasita en?

511
00:26:33,150 --> 00:26:36,390
Ĉu butono aŭ ĉu butono du?

512
00:26:36,390 --> 00:26:40,710
>> Kaj tiam tie ĉiuj mi faras estas
presi el trigger.innerhtml.

513
00:26:40,710 --> 00:26:43,860
Nu, en tiu kazo, en ĉi
kunteksto, trigger.innerhtml

514
00:26:43,860 --> 00:26:45,940
Estas ĝuste kio estas skribita sur la butono.

515
00:26:45,940 --> 00:26:48,830
Ĝi nur do okazas se ni saltas
reen por dua, kiu volus

516
00:26:48,830 --> 00:26:51,670
esti kio estas en inter tiuj butono etikedoj.

517
00:26:51,670 --> 00:26:54,150
Estos butono aŭ butono du.

518
00:26:54,150 --> 00:26:57,320
Kaj ni rigardu
kiel tiu evento traktilo volus

519
00:26:57,320 --> 00:27:01,080
aspektas kvazaŭ ni havis ĝin kurante en praktiko.

520
00:27:01,080 --> 00:27:03,850
>> Do unue, vi havas
malfermis events.js,

521
00:27:03,850 --> 00:27:06,517
kiu estas la JavaScript dosiero kie
Mi difinis ĉi funkcio.

522
00:27:06,517 --> 00:27:08,558
Kaj kiel vi pritondas vidi, estas
preskaux precize kion

523
00:27:08,558 --> 00:27:10,230
ni nur vidis sur la glito duan antaŭe.

524
00:27:10,230 --> 00:27:14,890
Kaj mi iros al la
hejmpaĝo ni uzis.

525
00:27:14,890 --> 00:27:17,660
Kaj mi havas tie butono
unu kaj butono du.

526
00:27:17,660 --> 00:27:19,820
Kaj mi alklakas butono unu.

527
00:27:19,820 --> 00:27:23,930
Vi alklakis butono unu, se vi
povas vidi tie en la atentigo.

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

529
00:27:25,810 --> 00:27:28,980
Alklaku sur la butono du, vin
alklakis butonon du.

530
00:27:28,980 --> 00:27:32,150
>> Do ambaŭ butonoj havas la
sama funkcio alvoko, dekstra?

531
00:27:32,150 --> 00:27:35,840
Ili ambaŭ estis garde nomon
okazaĵo, sed tiu okazaĵo objekto

532
00:27:35,840 --> 00:27:41,900
ke gets kreita kiam ni alklakas
ĝi rakontas nin kion butono estis klakita.

533
00:27:41,900 --> 00:27:44,650
Ni ne devis skribi du apartajn
funkcioj aŭ interkonsento kun havanta

534
00:27:44,650 --> 00:27:46,470
pasi ajna aldona informo.

535
00:27:46,470 --> 00:27:48,220
Ni simple fidanta sur
kio Javascript volo

536
00:27:48,220 --> 00:27:53,772
fari por ni, kiuj estas krei ke
ia evento objekto pro ni.

537
00:27:53,772 --> 00:27:56,730
Estas multe pli al JavaScript ol
kion ni kovras en tiu video,

538
00:27:56,730 --> 00:27:58,521
sed havante tiujn
fundamentaj devus akiri vin

539
00:27:58,521 --> 00:28:00,690
sufiĉe longan manieroj
lerni ĉion kion vi

540
00:28:00,690 --> 00:28:04,030
devas scii pri tio
interesa lingvo.

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

542
00:28:05,000 --> 00:28:07,010
Jen CS50.

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