1
00:00:00,000 --> 00:00:03,840
>> [Speel van musiek]

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

3
00:00:05,770 --> 00:00:08,690
>> DOUG LLOYD: So nou is ons ou
voor op die web programmering, reg?

4
00:00:08,690 --> 00:00:12,140
En ons het 'n paar gedek
tale in individuele videos.

5
00:00:12,140 --> 00:00:14,690
En nou, laat ons doen een, JavaScript.

6
00:00:14,690 --> 00:00:17,370
>> Eers die goeie nuus, JavaScript
is 'n moderne programmeertaal

7
00:00:17,370 --> 00:00:21,410
taal baie soos PHP wie
sintaksis is afgelei van C,

8
00:00:21,410 --> 00:00:22,830
so dit is 'n goeie plek om te begin.

9
00:00:22,830 --> 00:00:25,880
Dit gaan oor so oud soos PHP, asook,
rondom sowat 20 jaar nadat was.

10
00:00:25,880 --> 00:00:28,600
Dit was rondom uitgevind
dieselfde tyd as PHP.

11
00:00:28,600 --> 00:00:32,240
En JavaScript is eintlik redelik
fundamenteel tot die gebruikers ervaring

12
00:00:32,240 --> 00:00:32,740
van die web.

13
00:00:32,740 --> 00:00:34,448
In werklikheid, daar is
drie tale wat ek

14
00:00:34,448 --> 00:00:38,480
sou soort van sê maak die
gebruikers ervaring van interaksie

15
00:00:38,480 --> 00:00:42,650
met die webwerf, html,
css, en JavaScript.

16
00:00:42,650 --> 00:00:46,030
En so nou kom ons praat 'n
bietjie oor JavaScript.

17
00:00:46,030 --> 00:00:50,301
>> Die slegte nuus, al is, met JavaScript is
dat dit stel 'n baie van die reëls vir homself,

18
00:00:50,301 --> 00:00:51,300
en dan is dit breek hulle.

19
00:00:51,300 --> 00:00:54,010
En JavaScript kan eintlik
soort uitdaging om te leer,

20
00:00:54,010 --> 00:00:57,000
want dit is in teenstelling met C en
PHP, wat baie gestruktureer

21
00:00:57,000 --> 00:01:00,270
en het baie streng reëls
vir hoe dinge kan werk.

22
00:01:00,270 --> 00:01:03,690
JavaScript is soort
van gekry so buigsaam

23
00:01:03,690 --> 00:01:06,650
dat miskien dinge gaan nie
werk die manier waarop ons hulle verwag om,

24
00:01:06,650 --> 00:01:09,830
en miskien kan ons regtig nie leer
ons eerste programmeertaal

25
00:01:09,830 --> 00:01:10,769
as 'n JavaScript.

26
00:01:10,769 --> 00:01:12,810
So miskien omdat dit nie
stel homself enige reëls,

27
00:01:12,810 --> 00:01:15,754
en dit nie regtig
dwing goeie kodering gewoontes.

28
00:01:15,754 --> 00:01:18,170
Maar nou het ons hopelik ontwikkel
'n paar goeie kodering gewoontes,

29
00:01:18,170 --> 00:01:21,470
en so kan ons begin om inval
in JavaScript 'n bietjie.

30
00:01:21,470 --> 00:01:25,750
>> Om JavaScript, soortgelyk aan opening skryf
'n C-lêer met 'n dot C uitbreiding

31
00:01:25,750 --> 00:01:29,770
of 'n PHP lêer met 'n dot PHP uitbreiding,
Al wat ons moet doen is om oop te maak 'n lêer

32
00:01:29,770 --> 00:01:31,764
met die dot js lêer uitbreiding.

33
00:01:31,764 --> 00:01:34,430
Ons het nie nodig om enige spesiale het
delimiters soos ons gedoen het in PHP.

34
00:01:34,430 --> 00:01:36,750
Dat die soort van hoek
bracket vraagteken PHP

35
00:01:36,750 --> 00:01:40,300
wat ons gebruik om uit dat die pad
ons kan inlig oor ons leser dat wat ons het, is

36
00:01:40,300 --> 00:01:43,502
JavaScript is deur die insluiting van
dit in 'n html etiket,

37
00:01:43,502 --> 00:01:46,210
en ons sal 'n bietjie oor te sien
hoe om dit te doen in net 'n oomblik.

38
00:01:46,210 --> 00:01:48,210
>> Die ander ding wat maak
JavaScript verskillende,

39
00:01:48,210 --> 00:01:50,580
al is, is dat dit loop kliënt kant.

40
00:01:50,580 --> 00:01:53,430
So onthou dat met PHP
ons kon nooit regtig sien

41
00:01:53,430 --> 00:01:57,041
die PHP dat 'n webwerf onderstreep.

42
00:01:57,041 --> 00:01:59,040
As ons ooit gesien die
bladsy bron sou ons net

43
00:01:59,040 --> 00:02:02,830
sien die html dit was
gegenereer deur daardie PHP.

44
00:02:02,830 --> 00:02:04,900
Maar JavaScript loop kliënt kant.

45
00:02:04,900 --> 00:02:06,710
Jou JavaScript loop op jou rekenaar.

46
00:02:06,710 --> 00:02:09,050
En dit is die rede waarom jy kan doen
dinge soos blokkers te voeg.

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

48
00:02:09,550 --> 00:02:12,704
Sluit van advertensies word gewoonlik gedoen deur
doodmaak al die JavaScript

49
00:02:12,704 --> 00:02:14,370
wat is wat loop op 'n spesifieke webwerf.

50
00:02:14,370 --> 00:02:19,000
En omdat dit sou hê om
loop op jou rekenaar kliënt kant,

51
00:02:19,000 --> 00:02:21,910
jy kan net stop die
JavaScript vir hardloop heeltemal.

52
00:02:21,910 --> 00:02:27,030
Dit beteken ook dat wanneer jy gebruik
'n webwerf wat JavaScript sluit,

53
00:02:27,030 --> 00:02:32,450
jy het die JavaScript bron stuur
kode as deel van jou http reaksie

54
00:02:32,450 --> 00:02:34,159
aan die kliënt wanneer hulle vra.

55
00:02:34,159 --> 00:02:35,950
En sodat jy kan nie
wil JavaScript gebruik

56
00:02:35,950 --> 00:02:38,395
om werklik sensitiewe dinge te doen
soos verbygaande inligting

57
00:02:38,395 --> 00:02:41,020
oor gebruikers se wagwoorde terug en
uit, want hulle is eintlik

58
00:02:41,020 --> 00:02:45,610
gaan al die bronkode ontvang,
nie net die html wat gegenereer word,

59
00:02:45,610 --> 00:02:49,030
soos wat die geval sou wees met sê PHP.

60
00:02:49,030 --> 00:02:51,620
>> So hoe kan ons sluit JavaScript
in ons html om te begin met?

61
00:02:51,620 --> 00:02:54,520
Wel, soortgelyk aan CSS, eintlik,
is 'n soort van hoe ons hier doen.

62
00:02:54,520 --> 00:02:56,190
Met CSS het ons styl tags.

63
00:02:56,190 --> 00:03:00,760
En binnekant van die styl tags,
kan ons 'n CSS style sheet te definieer.

64
00:03:00,760 --> 00:03:03,450
Net so met JavaScript
kan ons oop script tags,

65
00:03:03,450 --> 00:03:06,660
'n ander html tag het ons nie
praat oor in ons html video,

66
00:03:06,660 --> 00:03:09,720
en skryf JavaScript in
tussen diegene script tags.

67
00:03:09,720 --> 00:03:13,960
Ook al is, soos CSS, ons
kon skakel in buite CSS lêers

68
00:03:13,960 --> 00:03:15,900
en trek hulle in ons program dat die pad.

69
00:03:15,900 --> 00:03:18,280
Met CSS kan ons ook
verskoon my, met JavaScript

70
00:03:18,280 --> 00:03:23,240
Ons kan ook die bron spesifiseer
kenmerk van die script tag

71
00:03:23,240 --> 00:03:25,720
om te skakel in JavaScript
afsonderlik, sodat jy dit nie doen nie

72
00:03:25,720 --> 00:03:27,680
het om dit te skryf in
tussen script tags, ons

73
00:03:27,680 --> 00:03:29,600
kan dit 'n skakel in die gebruik van
dat script tag so goed.

74
00:03:29,600 --> 00:03:33,230
En net soos met die geval met die CSS waar
Ons het aanbeveel dat dit was waarskynlik

75
00:03:33,230 --> 00:03:36,090
in jou beste belang om te skryf
jou CSS in 'n aparte lêer in die geval

76
00:03:36,090 --> 00:03:38,500
wat jy nodig het om dit te verander,
insgelyks doen ons beveel

77
00:03:38,500 --> 00:03:40,720
dat jy jou
JavaScript in afsonderlike lêers

78
00:03:40,720 --> 00:03:45,460
en gebruik die script tags bron
toe te skryf aan jou JavaScript bind

79
00:03:45,460 --> 00:03:49,520
in jou html, jou webblad.

80
00:03:49,520 --> 00:03:52,610
>> So JavaScript veranderlikes, sal ons
begin praat oor die sintaksis hier.

81
00:03:52,610 --> 00:03:53,600
En ons sal deurgaan
hierdie soort vinnig,

82
00:03:53,600 --> 00:03:56,640
omdat ons dit gedoen het in PHP, so
hierdie moet almal mooi vertroud.

83
00:03:56,640 --> 00:03:59,490
So veranderlikes in JavaScript is
baie soortgelyk aan veranderlikes PHP.

84
00:03:59,490 --> 00:04:03,270
Daar is geen tipe specific, en
wanneer jy 'n veranderlike stel,

85
00:04:03,270 --> 00:04:05,070
jy voorvoegsel by die var navraag.

86
00:04:05,070 --> 00:04:07,750
In PHP sou ons iets doen
soos hierdie, dollar teken x.

87
00:04:07,750 --> 00:04:09,950
Dit is hoe ons aangedui
'n veranderlike, maar nee, ons

88
00:04:09,950 --> 00:04:12,060
nie die tipe nie noem
van die veranderlike nie.

89
00:04:12,060 --> 00:04:15,124
Ons wil sê iets soos
dollar teken x gelyk aan 44 in PHP.

90
00:04:15,124 --> 00:04:17,040
As ons doen die
dieselfde ding in JavaScript,

91
00:04:17,040 --> 00:04:19,589
ons sou sê var x gelyk aan 44.

92
00:04:19,589 --> 00:04:22,780
So var is soort van ons pad
van die instelling van 'n veranderlike.

93
00:04:22,780 --> 00:04:26,850
Dit is dalk 'n bietjie meer intuïtief
as net dollar teken veranderlike.

94
00:04:26,850 --> 00:04:29,080
>> Weer, aangesien daar geen
tipes data, kan ons dit doen

95
00:04:29,080 --> 00:04:34,490
met 'n tipe data, snare,
enigiets anders sou almal var.

96
00:04:34,490 --> 00:04:37,260
Conditionals, almal van ons
ou vriende van C en PHP

97
00:04:37,260 --> 00:04:41,640
is nog beskikbaar, so ons het indien
anders as, anders, skakelaar en die vraag

98
00:04:41,640 --> 00:04:42,240
merk kolon.

99
00:04:42,240 --> 00:04:45,890
Switch oorblywende so buigsaam soos dit
was in PHP, maar al hierdie jy

100
00:04:45,890 --> 00:04:46,930
vertroud is met nou.

101
00:04:46,930 --> 00:04:49,900
En insgelyks met loops is
die ou gunstelinge van ruk,

102
00:04:49,900 --> 00:04:52,700
doen terwyl, en vir nog beskikbaar vir ons.

103
00:04:52,700 --> 00:04:55,880
So al wat ons weet 'n baie van die
basiese JavaScript soort grondbeginsels

104
00:04:55,880 --> 00:05:01,800
net by wyse van 'nogal 'n bietjie
van kennis nou sowat C en PHP.

105
00:05:01,800 --> 00:05:03,670
>> Wat van funksies in JavaScript?

106
00:05:03,670 --> 00:05:08,199
Wel, soortgelyk aan PHP elke funksie is
bekendgestel met die funksie navraag.

107
00:05:08,199 --> 00:05:10,740
Jy sê funksie, en dan moet jy
begin om jou funksie te definieer.

108
00:05:10,740 --> 00:05:12,531
Wat is 'n bietjie anders
oor JavaScript

109
00:05:12,531 --> 00:05:15,700
al is die vermoë om
wat 'n anonieme funksie genoem.

110
00:05:15,700 --> 00:05:18,880
Sodat jy kan definieer funksies
wat nie 'n naam.

111
00:05:18,880 --> 00:05:21,222
Dit is iets wat ons
regtig nie gesien nie.

112
00:05:21,222 --> 00:05:23,430
Ons sal regtig gebruik die konsep
van 'n anonieme funksie

113
00:05:23,430 --> 00:05:27,880
'n bietjie later in hierdie
video, want dit sal

114
00:05:27,880 --> 00:05:31,530
'n bietjie meer sin in konteks
wanneer ons sien dit in 'n bepaalde situasie

115
00:05:31,530 --> 00:05:33,120
dat ek hier gemaak.

116
00:05:33,120 --> 00:05:35,710
Maar laat ons net 'n blik
na wat 'n eenvoudige JavaScript

117
00:05:35,710 --> 00:05:37,850
funksie kan lyk.

118
00:05:37,850 --> 00:05:40,610
>> So ek het vooruit gegaan en
oopgemaak my CS50 IDE

119
00:05:40,610 --> 00:05:43,690
en ek het reeds Apache loop
om my bediener loop begin.

120
00:05:43,690 --> 00:05:46,800
En ek het hierdie lêer
oop genoem home.html.

121
00:05:46,800 --> 00:05:48,330
En ek sal in 'n bietjie zoom hier.

122
00:05:48,330 --> 00:05:52,090
En basies, kan jy sien die
Home.html is net 'n klomp van die knoppies.

123
00:05:52,090 --> 00:05:55,291
En ek beweer aan die bokant hier
dat dit die artikel JavaScript

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

125
00:05:55,790 --> 00:05:59,490
So is daar 'n klomp van die knoppies hier
maar wat doen hierdie knoppies eintlik doen?

126
00:05:59,490 --> 00:06:03,662
>> Wel, sal ons kop bo aan my IED,
en ek het home.html oop hier.

127
00:06:03,662 --> 00:06:05,620
Aan die begin,
hier is waar ek 'n skakel

128
00:06:05,620 --> 00:06:07,500
in al my JavaScript bron lêers.

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

130
00:06:08,000 --> 00:06:12,440
So ek het anonymous.js, clock.js,
Ek gebruik die kenmerk bron

131
00:06:12,440 --> 00:06:14,440
van die script tag om te skakel in die lêer.

132
00:06:14,440 --> 00:06:18,660
So ek het nie geskryf nie
JavaScript direk in hierdie lêer,

133
00:06:18,660 --> 00:06:21,790
maar ek het in al die getrek
JavaScript Ek het afsonderlik geskryf.

134
00:06:21,790 --> 00:06:24,540
En as ons hier blaai, dit neer
almal moet kyk ietwat vertroud

135
00:06:24,540 --> 00:06:27,090
met 'n bietjie van die nuwe sintaksis.

136
00:06:27,090 --> 00:06:32,655
Ons het hier kop tag vir
funksies en dan 'n knoppie.

137
00:06:32,655 --> 00:06:35,530
Ek het 'n inset wat 'n tipe knoppie,
en blykbaar wanneer ek op dit,

138
00:06:35,530 --> 00:06:38,130
Ek gaan 'n paar noem
funksioneer waarskuwing datum.

139
00:06:38,130 --> 00:06:41,792
En dit is hoe ons soort kan meng
'n bietjie van JavaScript en HTML.

140
00:06:41,792 --> 00:06:44,500
Hulle het eintlik speel mooi mooi
bymekaar, en so glo wanneer

141
00:06:44,500 --> 00:06:48,730
Ek op hierdie knoppie, ek gaan
sommige datum funksie waarskuwing noem.

142
00:06:48,730 --> 00:06:53,660
En insgelyks het ek gedefinieer gedrag
vir al die ander knoppies wat

143
00:06:53,660 --> 00:06:56,440
is op daardie home.html bladsy
wat ons sal hou terugkeer

144
00:06:56,440 --> 00:06:59,172
om in die loop van hierdie video.

145
00:06:59,172 --> 00:07:00,880
Maar laat ons teruggaan up
hier en 'n blik

146
00:07:00,880 --> 00:07:03,850
op clock.js, wat is die
JavaScript lêer wat ek

147
00:07:03,850 --> 00:07:07,370
geskryf wat die eerste funksie
ons gaan 'n blik op te neem.

148
00:07:07,370 --> 00:07:11,630
Soos jy kan sien, begin ek my JavaScript
funksioneer met die sleutelwoord funksie,

149
00:07:11,630 --> 00:07:14,560
en ek het hierdie een 'n gegewe
naam, is dit genoem waarskuwing datum.

150
00:07:14,560 --> 00:07:18,710
Binnekant van daar, ek glo skep 'n
nuwe plaaslike veranderlike genoem huidige datum.

151
00:07:18,710 --> 00:07:21,500
En ek gaan wys
'n gelykstaande aan 'n nuwe datum.

152
00:07:21,500 --> 00:07:24,430
En ons kon kry in 'n baie
detail as wat 'n datum is,

153
00:07:24,430 --> 00:07:27,060
en regtig JavaScript is so
groot dat ons nie kan nie moontlik

154
00:07:27,060 --> 00:07:28,330
dek alles in een video.

155
00:07:28,330 --> 00:07:32,220
Maar om te sê, dit gaan
om 'n data-item terug te keer na my

156
00:07:32,220 --> 00:07:35,470
omvat die huidige datum en tyd.

157
00:07:35,470 --> 00:07:39,100
Ek stoor dit in 'n veranderlike wat ek is
blykbaar gaan huidige datum te waarsku.

158
00:07:39,100 --> 00:07:41,300
>> Wel, wat doen waarskuwing
huidige datum lyk?

159
00:07:41,300 --> 00:07:46,460
Kom ons neem 'n blik op die lêer self
terug oor in die venster.

160
00:07:46,460 --> 00:07:49,551
So weer, dit is die knoppie wat ek
vasgebind het om hierdie funksie genoem.

161
00:07:49,551 --> 00:07:51,800
En ek is daar kliek dit en
kyk wat dit gedoen het, is dit gewaarsku.

162
00:07:51,800 --> 00:07:56,140
Dit opgeduik hierdie soort van boks vertel
my dat die huidige tyd is, blykbaar

163
00:07:56,140 --> 00:07:59,370
dit is op November 4
10:43:43 in die oggend.

164
00:07:59,370 --> 00:08:02,345
En as ek op dit weer, nou
dit is 'n paar sekondes later, reg?

165
00:08:02,345 --> 00:08:03,720
So dit is al wat hierdie funksie doen.

166
00:08:03,720 --> 00:08:07,670
As ek op hierdie knoppie, dit
verskyn 'n waarskuwing boodskap aan my.

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

168
00:08:13,806 --> 00:08:15,690
So daar is regtig nie
te veel om funksies

169
00:08:15,690 --> 00:08:19,110
dit is verskillend van PHP,
net 'n bietjie van die nuwe sintaksis

170
00:08:19,110 --> 00:08:22,500
wat kom met die werk met JavaScript.

171
00:08:22,500 --> 00:08:24,650
>> Skikkings in JavaScript is
redelik eenvoudig.

172
00:08:24,650 --> 00:08:27,200
Om 'n verskeidenheid te verklaar, wat jy gebruik
die vierkante hakies sintaksis

173
00:08:27,200 --> 00:08:30,090
dat ons vertroud is met van PHP.

174
00:08:30,090 --> 00:08:33,432
En soortgelyk aan PHP, ons
kan ook tipes data te meng.

175
00:08:33,432 --> 00:08:35,140
So hierdie skikking, sowel
van hierdie skikkings sou

176
00:08:35,140 --> 00:08:36,960
wees volkome wettige JavaScript.

177
00:08:36,960 --> 00:08:42,500
Een wat alle heelgetalle, en een wat
is deurmekaar verskillende tipes data.

178
00:08:42,500 --> 00:08:45,020
>> Wat is iets heel anders
in JavaScript, al is?

179
00:08:45,020 --> 00:08:47,020
Dit is die idee van 'n voorwerp.

180
00:08:47,020 --> 00:08:50,240
So miskien het jy al gehoor van
objekgeoriënteerde programmering.

181
00:08:50,240 --> 00:08:53,370
Ons het nie 'n baie dit te doen in CS50,
maar ons sal 'n bietjie van dit te doen

182
00:08:53,370 --> 00:08:55,670
hier in die konteks van JavaScript.

183
00:08:55,670 --> 00:08:59,100
JavaScript het nou die vermoë om
optree as 'n objekgeoriënteerde programmering

184
00:08:59,100 --> 00:09:02,615
taal, maar dit is nie self
uitsluitlik 'n objekgeoriënteerde

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

186
00:09:03,490 --> 00:09:05,281
En dit kom weer
terug na die rede waarom ek gesê het, dit

187
00:09:05,281 --> 00:09:10,610
kan baie uitdagend wees om te leer
JavaScript as jou eerste programmering

188
00:09:10,610 --> 00:09:13,890
taal, omdat dit nie
regtig inpas 'n bepaalde paradigma.

189
00:09:13,890 --> 00:09:16,430
>> C Aan die ander kant is 'n
funksionele programmeertaal.

190
00:09:16,430 --> 00:09:22,270
As ons wil, funksies
soort van die groot baas man, reg?

191
00:09:22,270 --> 00:09:24,410
Hulle dikteer wat
gebeur alles anders.

192
00:09:24,410 --> 00:09:26,600
Ons wil veranderlikes verander,
ons noem funksies.

193
00:09:26,600 --> 00:09:28,220
Ons doen dinge om funksies.

194
00:09:28,220 --> 00:09:31,250
Voorwerpe plaas, in 'n
objekgeoriënteerde taal,

195
00:09:31,250 --> 00:09:35,937
voorwerpe soort van die ster geword en
funksies geword soort van sekondêre.

196
00:09:35,937 --> 00:09:38,270
Maar wat is 'n voorwerp, wat
is hierdie idee van 'n voorwerp?

197
00:09:38,270 --> 00:09:40,880
Wel, as dit help, dink
oor dit op die eerste soort

198
00:09:40,880 --> 00:09:44,540
soos 'n C struktuur of 'n struct
dat ons geleer het oor voor.

199
00:09:44,540 --> 00:09:47,430
In C, 'n struktuur bevat
'n aantal velde,

200
00:09:47,430 --> 00:09:51,174
en miskien kan ons nou kan begin om
noem hierdie velde eienskappe.

201
00:09:51,174 --> 00:09:53,590
Maar die eienskappe nooit werklik
staan ​​op hul eie, reg?

202
00:09:53,590 --> 00:09:56,410
As ek definieer 'n struktuur vir 'n motor
soos hierdie met die volgende twee

203
00:09:56,410 --> 00:10:00,750
velde of eiendomme, een 'n
heelgetal vir die jaar van die motor

204
00:10:00,750 --> 00:10:04,290
en 'n ander 'n 10 karakter
string vir die model van die motor,

205
00:10:04,290 --> 00:10:07,150
Ek kan iets soos hierdie te sê,
Ek kan 'n nuwe veranderlike verklaar

206
00:10:07,150 --> 00:10:10,080
van die tipe struct motor Herbie.

207
00:10:10,080 --> 00:10:13,730
En dan kan ek iets sê
soos herbie.year gelyk 1963,

208
00:10:13,730 --> 00:10:15,850
en herbie.model gelyk Beetle.

209
00:10:15,850 --> 00:10:17,000
Dit is OK.

210
00:10:17,000 --> 00:10:19,680
Ek gebruik die velde in die
konteks van die struktuur,

211
00:10:19,680 --> 00:10:22,290
maar ek kon nooit net
iets soos hierdie te sê.

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

213
00:10:22,790 --> 00:10:26,836
Ek kan nie die naam veld gebruik nie
onafhanklik van die struktuur.

214
00:10:26,836 --> 00:10:28,210
Dit is soort van 'n fundamentele ding.

215
00:10:28,210 --> 00:10:32,990
>> So velde om
fundamenteel tot C strukture

216
00:10:32,990 --> 00:10:39,050
is baie soortgelyk aan eiendomme synde
fundamenteel tot JavaScript voorwerpe.

217
00:10:39,050 --> 00:10:42,080
Maar wat maak hulle
veral interessant

218
00:10:42,080 --> 00:10:46,230
is dat voorwerpe ook kan hê wat
genoem metodes, wat werklik is

219
00:10:46,230 --> 00:10:50,730
net 'n fancy woord vir funksies wat
is inherent aan die voorwerp as well.

220
00:10:50,730 --> 00:10:55,340
So dit is 'n funksie wat net kan wees
genoem word in die konteks van 'n voorwerp.

221
00:10:55,340 --> 00:10:59,200
Slegs 'n voorwerp wat gedefinieer
hierdie funksie binne sy,

222
00:10:59,200 --> 00:11:02,020
as jy dink oor 'n
struct, die funksie

223
00:11:02,020 --> 00:11:05,720
is binne-in daardie bepalende gedefinieer
krulhakies van die struktuur.

224
00:11:05,720 --> 00:11:07,980
So dit beteken net iets
aan die struktuur.

225
00:11:07,980 --> 00:11:10,960
En dit is soort van wat ons doen
hier met voorwerpe en metodes.

226
00:11:10,960 --> 00:11:13,580
Dit is basies soos ons is
definisie van 'n funksie wat

227
00:11:13,580 --> 00:11:16,670
net sin maak op 'n
spesifieke voorwerp, en so het ons

228
00:11:16,670 --> 00:11:19,440
noem dat 'n metode van die voorwerp.

229
00:11:19,440 --> 00:11:23,180
En ons kan nooit noem
funksie onafhanklik van die voorwerp,

230
00:11:23,180 --> 00:11:29,260
net soos ons nie jaar of model kan sê
onafhanklik van die struct in C.

231
00:11:29,260 --> 00:11:32,300
>> So funksionele programmering
paradigmas lyk so.

232
00:11:32,300 --> 00:11:35,450
Funksie en dan wanneer jy slaag
in die voorwerp as 'n parameter.

233
00:11:35,450 --> 00:11:38,650
In 'n objekgeoriënteerde programmering
tale, hierdie soort van kry

234
00:11:38,650 --> 00:11:43,464
omgekeer, en ons sal dink oor
dit soos hierdie, object.function.

235
00:11:43,464 --> 00:11:45,380
So is dit soort van dat dot
operateur weer impliseer

236
00:11:45,380 --> 00:11:49,540
dat dit 'n soort van eiendom
of eienskap van die voorwerp self.

237
00:11:49,540 --> 00:11:53,240
Maar dit is wat 'n voorwerp
georiënteerde programmeertaal

238
00:11:53,240 --> 00:11:57,150
kan doen om 'n funksie te maak
'n beroep op 'n metode, weer, wat

239
00:11:57,150 --> 00:12:00,260
is net 'n spesiale woord vir 'n funksie
wat inherent aan 'n voorwerp.

240
00:12:00,260 --> 00:12:03,440
Dit is wat dit
sintaksis lyk.

241
00:12:03,440 --> 00:12:09,360
En so sal ons begin om sommige van sien
dit in die konteks van JavaScript.

242
00:12:09,360 --> 00:12:12,470
>> Jy kan ook dink oor 'n voorwerp
soort van soos 'n assosiatiewe skikking,

243
00:12:12,470 --> 00:12:14,160
wat ons vertroud is met van PHP.

244
00:12:14,160 --> 00:12:17,720
Onthou 'n assosiatiewe skikking kan
ons sleutel waarde pare het, in plaas

245
00:12:17,720 --> 00:12:23,040
van 'indekse 0, een, twee, drie,
en so aan asof ons gebruik om van C

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

247
00:12:23,940 --> 00:12:27,472
Assosiatiewe skikkings kan karteer
woorde, soos in die PHP video,

248
00:12:27,472 --> 00:12:29,180
ons praat oor
toppings van pizzas.

249
00:12:29,180 --> 00:12:31,180
En so het ons 'n skikking
genoem pizzas, en ons

250
00:12:31,180 --> 00:12:36,670
moes kaas was 'n sleutel en $ 8,99 was die
waarde, en dan pepperoni was 'n belangrike,

251
00:12:36,670 --> 00:12:39,190
$ 9,99 'n waarde, en so aan.

252
00:12:39,190 --> 00:12:43,300
En so kan ons ook dink oor 'n
beswaar soort soortgelyk aan 'n assosiatiewe

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

254
00:12:43,840 --> 00:12:47,020
En so gaan dit hier sintaks
sou 'n nuwe voorwerp te skep

255
00:12:47,020 --> 00:12:50,950
genoem Herbie met twee
eienskappe binnekant van dit.

256
00:12:50,950 --> 00:12:57,310
Jaar, wat die waarde 1963 is toegeken,
en model, wat die string opgedra

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

258
00:12:58,140 --> 00:13:01,770
>> En let hier dat ek die gebruik van
enkelaanhalingstekens in JavaScript.

259
00:13:01,770 --> 00:13:05,570
Jy kan enkel of dubbel aanhalings gebruik
wanneer jy praat oor snare.

260
00:13:05,570 --> 00:13:07,772
Dis net konvensioneel
die geval dat die meeste tye

261
00:13:07,772 --> 00:13:10,230
wanneer jy skryf JavaScript,
jy net gebruik aanhalingstekens.

262
00:13:10,230 --> 00:13:15,050
Maar ek kon dubbele aanhalingstekens hier te gebruik, en
wat perfek fyn sou wees as well.

263
00:13:15,050 --> 00:13:17,470
>> So onthou hoe in
PHP ons het hierdie idee

264
00:13:17,470 --> 00:13:22,730
van 'n lus vir elke wat ons sal toelaat
om Itereer oor al die sleutel waarde

265
00:13:22,730 --> 00:13:25,270
pare van 'n assosiatiewe
skikking, want ons

266
00:13:25,270 --> 00:13:29,050
het hierdie vermoë om Itereer nie
deur 0, een, twee, drie, vier,

267
00:13:29,050 --> 00:13:30,710
en so aan?

268
00:13:30,710 --> 00:13:35,010
JavaScript iets baie soortgelyk,
maar dit is nie bekend as 'n vir elke lus,

269
00:13:35,010 --> 00:13:38,960
dit is bekend as 'n in loops.

270
00:13:38,960 --> 00:13:42,890
So as ek sê vir my soos
hierdie, vir var sleutel voorwerp,

271
00:13:42,890 --> 00:13:48,670
Dit is soort van soos gesê
vir elke iets so iets.

272
00:13:48,670 --> 00:13:53,850
Maar al wat ek hier doen, is iterating
deur al die sleutels van my voorwerp.

273
00:13:53,850 --> 00:13:56,070
En binnekant van die krullerige
draadjies daar, sou ek

274
00:13:56,070 --> 00:14:03,410
gebruik voorwerp vierkantige hakies sleutel tot verwys
om die waarde wat die sleutel plek.

275
00:14:03,410 --> 00:14:05,400
>> Alternatiewelik, is daar
selfs 'n ander benadering.

276
00:14:05,400 --> 00:14:10,880
As ek maar net omgee vir die
waardes, kan ek sê vir die sleutel voorwerp,

277
00:14:10,880 --> 00:14:12,360
en net gebruik sleutel binne-in.

278
00:14:12,360 --> 00:14:17,240
So vir var sleutel voorwerp, ek het
om voorwerp vierkantige hakies gebruik

279
00:14:17,240 --> 00:14:19,340
sleutel binne-in die lus.

280
00:14:19,340 --> 00:14:24,580
Vir var sleutel van voorwerp, ek kan
net gebruik sleutel binne-in die lus,

281
00:14:24,580 --> 00:14:29,040
want ek is net spesifiek
praat oor die waardes is daar.

282
00:14:29,040 --> 00:14:32,630
>> So laat miskien neem 'n
kyk na die verskil

283
00:14:32,630 --> 00:14:35,670
net om te wys jy vinnig
die verskil tussen vier

284
00:14:35,670 --> 00:14:40,730
in en vir van met 'n baie spesifieke
skikking, wat ons hier het, week skikking.

285
00:14:40,730 --> 00:14:43,616
So ek het 'n nuwe reeks vind
dat ek gevul met sewe snare,

286
00:14:43,616 --> 00:14:46,240
Maandag, Dinsdag, Woensdag,
Donderdag, Vrydag, Saterdag, Sondag.

287
00:14:46,240 --> 00:14:50,530
En ek wil nou Itereer
deur middel van hierdie verskeidenheid,

288
00:14:50,530 --> 00:14:53,090
uit te druk sekere inligting.

289
00:14:53,090 --> 00:14:58,780
As ek 'n lus vir die in
om uit te druk inligting,

290
00:14:58,780 --> 00:15:00,710
wat dink jy ek gaan kry?

291
00:15:00,710 --> 00:15:01,710
Wel, laat ons neem 'n blik.

292
00:15:01,710 --> 00:15:05,300
En voor ons spring oor
my blaaier,

293
00:15:05,300 --> 00:15:08,090
weet net dat
console.log is 'n soort van 'n

294
00:15:08,090 --> 00:15:10,630
manier van doen 'n afdruk F in JavaScript.

295
00:15:10,630 --> 00:15:12,040
Maar wat is die konsole?

296
00:15:12,040 --> 00:15:14,940
Wel, dit is wat ons gaan
om te gaan 'n blik op die oomblik.

297
00:15:14,940 --> 00:15:16,850
>> OK, so ons is hier terug
in my blaaier,

298
00:15:16,850 --> 00:15:19,410
en ek gaan om oop te maak
my ontwikkelaar gereedskap.

299
00:15:19,410 --> 00:15:22,290
Weereens, ek is net slaan F12
om oop te maak ontwikkelaar gereedskap.

300
00:15:22,290 --> 00:15:25,670
En agterkom dat hier by die
top Ek het gekies console.

301
00:15:25,670 --> 00:15:28,480
So, dit is die idee
van 'n ontwikkelaar console,

302
00:15:28,480 --> 00:15:30,500
en dit sal ons toelaat om
druk inligting uit

303
00:15:30,500 --> 00:15:33,000
soort van soos die terminaal nie, maar
as jy later sal sien 'n bietjie,

304
00:15:33,000 --> 00:15:37,720
ons kan ook inligting tik in
om met ons webblad.

305
00:15:37,720 --> 00:15:42,320
Ek gaan in 'n bietjie om te vergroot hier
en ek gaan klik nou op in toets.

306
00:15:42,320 --> 00:15:45,230
En vier in test-- Ek is nie gonna
wys jou die kode vir dit reg nou,

307
00:15:45,230 --> 00:15:47,479
maar jy sal dit kry as jy
laai die bronkode wat

308
00:15:47,479 --> 00:15:50,380
geassosieer met hierdie video--
is net dat in lus

309
00:15:50,380 --> 00:15:52,610
wat ons gesien het net 'n
tweede gelede op die skyfie.

310
00:15:52,610 --> 00:15:54,810
>> So ek gaan kliek wat
knoppie, en hier,

311
00:15:54,810 --> 00:15:58,440
hier is wat uit gedruk in die
console, 0, een, twee, drie, vier, vyf,

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

313
00:15:58,940 --> 00:16:02,490
Ek het nie die druk van die inligting
binne die verskeidenheid plekke,

314
00:16:02,490 --> 00:16:05,180
want ek het 'n in lus.

315
00:16:05,180 --> 00:16:10,670
En binne-in die liggaam van die lus, ek
net gedruk sleutel sleutel nie beswaar.

316
00:16:10,670 --> 00:16:18,600
Maar as ek nou duidelik my troos, en ek
oorskakel na vir toets, en vier van die toets

317
00:16:18,600 --> 00:16:22,500
Ek sê ek vir lus
plaas en druk die sleutel,

318
00:16:22,500 --> 00:16:28,079
as ek dit op, nou is ek kry die
werklike elemente binnekant van my voorwerp

319
00:16:28,079 --> 00:16:29,120
of my opgestel in hierdie geval.

320
00:16:29,120 --> 00:16:31,760
My verskeidenheid van week dae.

321
00:16:31,760 --> 00:16:33,480
Ek gedruk Maandag,
Dinsdag, Woensdag.

322
00:16:33,480 --> 00:16:36,930
So wat is die verskil tussen
'n in lus, wat druk uit

323
00:16:36,930 --> 00:16:43,410
net die sleutels as jy net gebruik sleutel
binnekant van die liggaam van die lus,

324
00:16:43,410 --> 00:16:46,850
en 'n lus vir die van wat afdrukke
die waardes as jy net gebruik

325
00:16:46,850 --> 00:16:48,870
sleutel binne-in die liggaam van die lus.

326
00:16:48,870 --> 00:16:52,380
>> Alle reg, hoe kan ons nou begin om
koppel snare en miskien meng

327
00:16:52,380 --> 00:16:57,220
sommige veranderlikes met interpolasie
soos wat ons in staat was om te doen in PHP?

328
00:16:57,220 --> 00:16:59,410
Wel, ons is redelik vertroud
met hierdie van PHP.

329
00:16:59,410 --> 00:17:04,109
Dit is hoe ons dit sou doen met die
dot operateur snare koppel.

330
00:17:04,109 --> 00:17:06,260
In JavaScript, al is,
ons eintlik iets te gebruik

331
00:17:06,260 --> 00:17:09,290
genoem die plus operateur, wat
is dalk selfs 'n bietjie meer

332
00:17:09,290 --> 00:17:10,470
intuïtief, reg?

333
00:17:10,470 --> 00:17:12,609
Ons voeg 'n klomp
snare saam.

334
00:17:12,609 --> 00:17:14,520
So laat kop terug
oor en sien wat hierdie

335
00:17:14,520 --> 00:17:18,693
sal druk as ons probeer om uit te druk
al die inligting in week skikking.

336
00:17:18,693 --> 00:17:20,859
Alle reg, sodat onder hier
onder string aaneenskakellling,

337
00:17:20,859 --> 00:17:24,822
Ek het twee opsies, string gebou
V1 en dan string gebou V2.

338
00:17:24,822 --> 00:17:26,530
En ons sal sien waarom ons
moet V2 in 'n tweede.

339
00:17:26,530 --> 00:17:28,610
Maar ek gaan klik op
string gebou V1, wat

340
00:17:28,610 --> 00:17:30,360
is die kode wat ons was
net 'n blik op,

341
00:17:30,360 --> 00:17:32,980
die console.log met al die plus punte.

342
00:17:32,980 --> 00:17:35,910
Kom ons kyk of hierdie afdrukke
uit wat ons verwag.

343
00:17:35,910 --> 00:17:39,939
>> Maandag is die dag nommer 01 van die week,
Dinsdag is die dag nommer 11 van die week.

344
00:17:39,939 --> 00:17:41,730
Wel, wat ek probeer
om te doen was daar te kry

345
00:17:41,730 --> 00:17:46,280
dit uit te druk Maandag is die dag nommer
een, Dinsdag dag is nommer twee.

346
00:17:46,280 --> 00:17:50,140
Maar dit lyk asof ek
altyd uit te druk een.

347
00:17:50,140 --> 00:17:51,260
Wel, hoekom is dit?

348
00:17:51,260 --> 00:17:55,600
Wel, dit blyk uit, neem 'n ander kyk
op hierdie klein brokkie van die kode hier.

349
00:17:55,600 --> 00:18:00,160
Let daarop dat ons met behulp van die plus
operateur in twee verskillende kontekste.

350
00:18:00,160 --> 00:18:03,221
>> En so hier is waar dinge dalk
wat ons het soort van is gesê:

351
00:18:03,221 --> 00:18:03,970
Ag, dit is so groot.

352
00:18:03,970 --> 00:18:05,910
Ons het nie meer hanteer tipes data.

353
00:18:05,910 --> 00:18:08,220
Maar hier is waar die feit
dat ons verloor datatipes

354
00:18:08,220 --> 00:18:10,960
kan eintlik 'n bietjie wees
van 'n probleem vir ons.

355
00:18:10,960 --> 00:18:16,260
Nou dat die plus operateur gebruik word om
koppel snare en getalle te voeg

356
00:18:16,260 --> 00:18:19,550
saam, JavaScript het
om sy beste raaiskoot maak

357
00:18:19,550 --> 00:18:22,030
as wat ek wil om dit te doen vir my.

358
00:18:22,030 --> 00:18:23,900
En in hierdie geval, is dit geraai verkeerd.

359
00:18:23,900 --> 00:18:29,340
Dit is net aaneen dag, wat sou wees
0, een, twee, drie, vier, vyf, ses of,

360
00:18:29,340 --> 00:18:32,060
en dan is dit net saamgevoeg
dit en dan saamgevoeg een.

361
00:18:32,060 --> 00:18:35,020
Dit het nie eintlik voeg hulle saam.

362
00:18:35,020 --> 00:18:37,320
En so hierdie tale,
PHP en JavaScript,

363
00:18:37,320 --> 00:18:39,196
dat abstraheer weg
hierdie idee van tipes,

364
00:18:39,196 --> 00:18:40,820
jy hoef nie meer te hanteer.

365
00:18:40,820 --> 00:18:43,600
Hulle het nog tipes onder die enjinkap.

366
00:18:43,600 --> 00:18:46,780
En ons kan, in situasies
soos hierdie, hefboom feit

367
00:18:46,780 --> 00:18:49,240
deur iets te sê
soos miskien is hierdie, wat

368
00:18:49,240 --> 00:18:53,210
vertel JavaScript, deur die
manier te behandel dit as 'n heelgetal is,

369
00:18:53,210 --> 00:18:57,100
dit nie hanteer as 'n string, selfs
al ons saam te meng snare

370
00:18:57,100 --> 00:18:58,940
en heelgetalle hier.

371
00:18:58,940 --> 00:19:02,204
>> Dit is net een van daardie dinge
dat dit lyk so groot in konteks

372
00:19:02,204 --> 00:19:04,120
dat ons nie hoef te
hanteer tipes nie,

373
00:19:04,120 --> 00:19:05,828
maar soms jy sal
loop in 'n situasie

374
00:19:05,828 --> 00:19:09,110
hierdie presies soos waar die feit dat
jy nie beheer oor tipes het

375
00:19:09,110 --> 00:19:11,220
kan boemerang op jou
as jy nie versigtig is nie.

376
00:19:11,220 --> 00:19:18,285
En so as ons pop terug na IDE, ek is
gaan weer uit te duidelik my troos,

377
00:19:18,285 --> 00:19:20,660
en ek gaan klik string
gebou weergawe twee, wat

378
00:19:20,660 --> 00:19:23,052
is waar ek die gebruik dat parse int funksie.

379
00:19:23,052 --> 00:19:25,260
Nou is dit uit te druk
inligting wat ek verwag het nie.

380
00:19:25,260 --> 00:19:29,330
Maandag se dag nommer een, Dinsdag
dag is nommer twee, en so aan.

381
00:19:29,330 --> 00:19:31,170
>> So laat ons praat oor funksies weer.

382
00:19:31,170 --> 00:19:34,790
Ek belowe ons sal praat oor anonieme
funksies, en nou is die konteks vir daardie

383
00:19:34,790 --> 00:19:36,360
het uiteindelik aangebreek.

384
00:19:36,360 --> 00:19:39,980
So voordat ons dit doen, laat ons praat weer
oor skikkings vir net 'n sekonde.

385
00:19:39,980 --> 00:19:42,120
So skikkings is 'n spesiale
geval van 'n voorwerp.

386
00:19:42,120 --> 00:19:45,180
Trouens, alles in
JavaScript is eintlik 'n voorwerp.

387
00:19:45,180 --> 00:19:47,190
So funksies is 'n
spesiale geval van 'n voorwerp,

388
00:19:47,190 --> 00:19:49,770
heelgetalle is 'n spesiale
geval van 'n voorwerp,

389
00:19:49,770 --> 00:19:52,152
maar skikkings spesifiek
'n aantal van die metodes.

390
00:19:52,152 --> 00:19:55,110
Onthou, want hulle is voorwerpe,
hulle kan eienskappe en metodes.

391
00:19:55,110 --> 00:19:58,600
Hulle het 'n aantal van die metodes wat
aangewend kan word om die voorwerpe.

392
00:19:58,600 --> 00:20:01,197
Daar is 'n metode genoem
grootte, array.size,

393
00:20:01,197 --> 00:20:03,030
wat sal terugkeer na
jou as wat jy kan verwag

394
00:20:03,030 --> 00:20:05,120
die aantal elemente in jou skikking.

395
00:20:05,120 --> 00:20:08,480
array.pop, soort van soos
ons idee van knal af

396
00:20:08,480 --> 00:20:11,110
van 'n stapel, as jy onthou
van ons stapels video,

397
00:20:11,110 --> 00:20:13,810
verwyder die laaste element van die skikking.

398
00:20:13,810 --> 00:20:17,110
array.push voeg 'n nuwe element
tot aan die einde van 'n skikking.

399
00:20:17,110 --> 00:20:20,910
array.shift is soort van
soos DQ, dit display toon uit

400
00:20:20,910 --> 00:20:23,610
die heel eerste element van 'n skikking.

401
00:20:23,610 --> 00:20:27,549
>> Maar daar is ook 'n ander spesiale
metode van 'n skikking met die naam kaart.

402
00:20:27,549 --> 00:20:29,340
En dit is soort van 'n
interessante konsep.

403
00:20:29,340 --> 00:20:30,930
So, wat is die idee van 'n kaart?

404
00:20:30,930 --> 00:20:33,880
Jy sal hierdie eintlik sien
in verskeie ander tale,

405
00:20:33,880 --> 00:20:38,550
en ons praat nie oor 'n
soort van kartograwe karteer hier

406
00:20:38,550 --> 00:20:41,480
ons praat oor 'n kartering funksie.

407
00:20:41,480 --> 00:20:44,110
In die konteks ons
praat hier, 'n kaart

408
00:20:44,110 --> 00:20:47,950
is 'n spesiale operasie ons
kan uitvoer op 'n verskeidenheid

409
00:20:47,950 --> 00:20:51,630
om 'n spesifieke funksie van toepassing
elke element van daardie skikking.

410
00:20:51,630 --> 00:20:55,190
en so sal ons sê in
hierdie geval, miskien array.map,

411
00:20:55,190 --> 00:21:00,330
en binnekant van dit, ons verby
in kaart is 'n funksie wat ons wil

412
00:21:00,330 --> 00:21:02,430
toegepas moet word om elke enkele element.

413
00:21:02,430 --> 00:21:07,299
So dit is soort van analoog aan die gebruik van
'n lus om Itereer oor elke element

414
00:21:07,299 --> 00:21:09,340
en toe te pas 'n bepaalde
funksioneer om elke element,

415
00:21:09,340 --> 00:21:14,830
net JavaScript het hierdie gebou in
idee van 'n kartering wat toegepas kan word.

416
00:21:14,830 --> 00:21:19,700
En dit is 'n groot konteks
praat oor 'n anonieme funksie.

417
00:21:19,700 --> 00:21:22,370
>> So kom ons sê ons het
hierdie verskeidenheid van heelgetalle.

418
00:21:22,370 --> 00:21:25,370
Dit is bekend as nume en dit het vyf
dinge in dit, een, twee, drie, vier,

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

420
00:21:26,410 --> 00:21:30,620
Nou wil ek 'n paar te karteer
funksie om hierdie skikking.

421
00:21:30,620 --> 00:21:34,337
Ek wil 'n funksie van toepassing is
elke element van die skikking.

422
00:21:34,337 --> 00:21:37,420
Wel, laat ons sê dat wat ek wil
doen is net al die elemente te verdubbel.

423
00:21:37,420 --> 00:21:42,520
Wat ek kan doen is net gebruik om 'n lus
vir var ek gelyk 0, ek is minder as

424
00:21:42,520 --> 00:21:47,390
of gelyk aan 4, ek plus, plus, en
dan verdubbel elke enkele nommer.

425
00:21:47,390 --> 00:21:49,580
Maar ek kan ook iets soos dit te doen.

426
00:21:49,580 --> 00:21:53,420
Ek kan sê nume was voorheen
een twee drie vier vyf,

427
00:21:53,420 --> 00:21:58,310
nou, al is, wil ek hê jy moet
'n afbeelding van toepassing op hierdie verskeidenheid

428
00:21:58,310 --> 00:22:00,400
waar ek wil jou
elke getal te verdubbel.

429
00:22:00,400 --> 00:22:02,540
En dit is presies
wat gebeur hier.

430
00:22:02,540 --> 00:22:06,870
Maar let op wat ek verby
in die argument te karteer.

431
00:22:06,870 --> 00:22:09,080
Dit is 'n anonieme funksie.

432
00:22:09,080 --> 00:22:11,140
En sien ek het nie gegee
hierdie funksie 'n naam,

433
00:22:11,140 --> 00:22:13,290
Ek het net dit gegee 'n parameter lys.

434
00:22:13,290 --> 00:22:16,370
En so is dit 'n voorbeeld
van 'n anonieme funksie.

435
00:22:16,370 --> 00:22:21,270
>> Ons wil die algemeen nooit hierdie skakel
funksie buite die konteks van kaart.

436
00:22:21,270 --> 00:22:24,110
Ons definieer dit as 'n parameter
na die kaart, en so het ons nie regtig

437
00:22:24,110 --> 00:22:27,910
nodig om 'n naam vir dit as die
enigste ding wat omgee is kaart

438
00:22:27,910 --> 00:22:30,339
en dit is reg gedefinieer
daar binnekant van kaart.

439
00:22:30,339 --> 00:22:31,880
En so is dit 'n anonieme funksie.

440
00:22:31,880 --> 00:22:34,680
Ons het nie in staat was
hierdie voorheen doen nie.

441
00:22:34,680 --> 00:22:38,400
Kaart 'n funksie wat
een parameter aanvaar, num,

442
00:22:38,400 --> 00:22:41,890
en wat daardie funksie nie
is opbrengste NUM keer 2.

443
00:22:41,890 --> 00:22:45,330
En so na hierdie
kartering toegepas is,

444
00:22:45,330 --> 00:22:50,090
dit is nou wat nume lyk
soos, twee, vier, ses, agt, 10.

445
00:22:50,090 --> 00:22:52,090
En ons sal oor my pop
venster en net

446
00:22:52,090 --> 00:22:55,240
neem 'n blik op hierdie
regtig vinnig as well.

447
00:22:55,240 --> 00:22:58,000
>> So ek het 'n ander knoppie hier
in my tuisblad genoem dubbel.

448
00:22:58,000 --> 00:23:03,570
En wanneer ek op dubbel, en dit vertel
my voor dit was een, twee, drie, vier,

449
00:23:03,570 --> 00:23:07,250
vyf na twee, vier, ses, agt, 10.

450
00:23:07,250 --> 00:23:11,930
En as ek gaan terug en klik dubbel
weer, twee, vier, ses, agt, 10.

451
00:23:11,930 --> 00:23:17,400
En dan na vier,
agt, 12, 16, 20 en dan.

452
00:23:17,400 --> 00:23:20,440
En wat doen ek in hierdie funksie?

453
00:23:20,440 --> 00:23:25,210
Wel, as ons pop net meer om IDE, en
Ek trek my anonieme funksie hier

454
00:23:25,210 --> 00:23:28,780
op die lyn sewe deur 13, ek is
doen 'n bietjie fancy werk hier,

455
00:23:28,780 --> 00:23:32,240
maar ek is net uit te druk
Wat is tans in die skikking.

456
00:23:32,240 --> 00:23:36,580
Dan op die lyn 16, 17,
en 18, is daar my kaart.

457
00:23:36,580 --> 00:23:40,930
Dit is waar ek die toepassing van hierdie verdubbeling
funksie om elke enkele element.

458
00:23:40,930 --> 00:23:43,530
En dan 'n bietjie verder af,
Ek is net doen dieselfde ding

459
00:23:43,530 --> 00:23:46,640
Ek het voor doen nie, behalwe nou is ek
druk die inhoud van die skikking

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

461
00:23:48,167 --> 00:23:50,500
Maar al wat ek hier gedoen is
net gebruik 'n anonieme funksie

462
00:23:50,500 --> 00:23:53,640
na die kaart in 'n hele reeks.

463
00:23:53,640 --> 00:23:58,466
>> So een groot onderwerp om oor te praat in
JavaScript is die idee van 'n gebeurtenis.

464
00:23:58,466 --> 00:24:01,590
'N gebeurtenis is iets wat net gebeur
wanneer 'n gebruiker op jou web

465
00:24:01,590 --> 00:24:04,715
bladsy, so miskien het hulle op iets,
of dalk die bladsy laai,

466
00:24:04,715 --> 00:24:07,200
of miskien het hulle verskuif
hul muis oor iets,

467
00:24:07,200 --> 00:24:09,290
of hulle het iets getik
in 'n invoer veld.

468
00:24:09,290 --> 00:24:14,260
Al hierdie dinge is gebeure
wat plaasvind op ons webblad.

469
00:24:14,260 --> 00:24:17,460
En JavaScript het die
vermoë om iets te ondersteun

470
00:24:17,460 --> 00:24:21,760
genoem 'n event handler, wat
is 'n terugbel funksie wat

471
00:24:21,760 --> 00:24:23,329
reageer op 'n html gebeurtenis.

472
00:24:23,329 --> 00:24:24,620
En wat is 'n terugbelfunksie?

473
00:24:24,620 --> 00:24:27,328
Wel, dit is oor die algemeen net 'n ander
naam vir 'n anonieme funksie.

474
00:24:27,328 --> 00:24:30,170
Dit is 'n funksie wat
reageer op 'n gebeurtenis.

475
00:24:30,170 --> 00:24:34,130
En dit is waar ons kom na die
idee van bindende sekere funksies

476
00:24:34,130 --> 00:24:38,060
om 'n bepaalde eienskap html.

477
00:24:38,060 --> 00:24:41,420
Die meeste html elemente
ondersteuning vir 'n kenmerk

478
00:24:41,420 --> 00:24:45,170
dat ons nie praat oor die html
video vir iets soos op kliek

479
00:24:45,170 --> 00:24:50,540
of op hover of op las,
al hierdie gebeure

480
00:24:50,540 --> 00:24:53,120
wat jy dan kan skryf funksies
wat handel oor die gebeure

481
00:24:53,120 --> 00:24:56,090
wanneer daardie gebeure
voorkom op jou webblad.

482
00:24:56,090 --> 00:24:59,170
>> En so miskien is jou html
lyk iets soos hierdie.

483
00:24:59,170 --> 00:25:02,240
En ek het hier twee knoppies,
knoppie een en twee knoppie,

484
00:25:02,240 --> 00:25:04,620
en hier Ek het tans
gedefinieer niks

485
00:25:04,620 --> 00:25:11,170
maar dit is waar die kenmerk op
kliek is blykbaar deel van my html tag.

486
00:25:11,170 --> 00:25:15,220
So glo toe ek definieer wat is
gaan op die binnekant van daardie kenmerk,

487
00:25:15,220 --> 00:25:18,590
dit gaan om 'n paar JavaScript wees
funksie wat reageer op die gebeurtenis

488
00:25:18,590 --> 00:25:24,360
vermoedelik van te kliek
knoppie een of twee knoppie.

489
00:25:24,360 --> 00:25:28,580
>> Wat is gaaf oor hierdie is ons
kan 'n generiese event handler skryf.

490
00:25:28,580 --> 00:25:32,370
En hierdie gebeurtenis sal Handler
skep 'n geleentheid voorwerp.

491
00:25:32,370 --> 00:25:37,000
En die gebeurtenis voorwerp sal ons vertel
watter van die twee knoppies is gedruk.

492
00:25:37,000 --> 00:25:38,064
Nou hoe werk dit?

493
00:25:38,064 --> 00:25:39,730
Wel, dit kan iets soos hierdie.

494
00:25:39,730 --> 00:25:44,860
So sal ons eers ons knoppies definieer
om 'n reaksie op die terugbel het

495
00:25:44,860 --> 00:25:47,470
funksie wat genoem sal word
wanneer die knoppie geklik word,

496
00:25:47,470 --> 00:25:49,520
ons sal gebeurtenis waarskuwing noem.

497
00:25:49,520 --> 00:25:53,320
En in kennis beide gevalle is ons
verby in hierdie parameter gebeurtenis.

498
00:25:53,320 --> 00:25:55,460
So hierdie funksie noem
of wanneer hierdie funksie

499
00:25:55,460 --> 00:26:00,330
is veroorsaak deur die gebeurtenis gebeur,
dit gaan om hierdie geleentheid te skep voorwerp

500
00:26:00,330 --> 00:26:03,300
en slaag dit as 'n
parameter naam te waarsku.

501
00:26:03,300 --> 00:26:07,270
En so 'n geval voorwerp
gaan inligting bevat

502
00:26:07,270 --> 00:26:09,800
waaroor knoppie is gekliek.

503
00:26:09,800 --> 00:26:11,580
En hoe dit te doen?

504
00:26:11,580 --> 00:26:13,654
Wel, dit kan iets soos hierdie.

505
00:26:13,654 --> 00:26:15,570
So nou in my aparte
JavaScript lêer, kan ek

506
00:26:15,570 --> 00:26:17,420
het om hierdie te vind
funksie waarskuwing naam, wat

507
00:26:17,420 --> 00:26:19,500
weer aanvaar dat parameter gebeurtenis.

508
00:26:19,500 --> 00:26:24,640
En dan is hier waar ek die opsporing
watter knoppie is geaktiveer,

509
00:26:24,640 --> 00:26:28,100
var sneller gelyk gebeurtenis
dot bron element.

510
00:26:28,100 --> 00:26:33,150
Wat was die bron wat geskep
hierdie gebeurtenis voorwerp wat geslaag is in?

511
00:26:33,150 --> 00:26:36,390
Was dit knoppie een of was dit knoppie twee?

512
00:26:36,390 --> 00:26:40,710
>> En dan hier al wat ek doen, is
uit te druk trigger.innerhtml.

513
00:26:40,710 --> 00:26:43,860
Wel, in hierdie geval, in hierdie
konteks, trigger.innerhtml

514
00:26:43,860 --> 00:26:45,940
is net wat geskryf is op die knoppie.

515
00:26:45,940 --> 00:26:48,830
Dit gebeur net so as ons spring
terug vir 'n tweede, wat sou

516
00:26:48,830 --> 00:26:51,670
wees wat in tussen die knoppie tags.

517
00:26:51,670 --> 00:26:54,150
Dit sal knoppie een of twee knoppie te wees.

518
00:26:54,150 --> 00:26:57,320
En laat ons 'n blik op
hoe hierdie gebeurtenis hanteerder sou

519
00:26:57,320 --> 00:27:01,080
kyk, as ons het dit loop in die praktyk.

520
00:27:01,080 --> 00:27:03,850
>> So die eerste van alles, jy het
oopgemaak events.js,

521
00:27:03,850 --> 00:27:06,517
wat is die JavaScript-lêer waar
Ek het hierdie funksie gedefinieer.

522
00:27:06,517 --> 00:27:08,558
En soos jy kan sien, is dit
pretty much presies wat

523
00:27:08,558 --> 00:27:10,230
sien ons net op die skyfie 'n tweede gelede.

524
00:27:10,230 --> 00:27:14,890
En Ek sal oor gaan na die
tuisblad ons het al met behulp van.

525
00:27:14,890 --> 00:27:17,660
En ek het hier knoppie
een en twee knoppie.

526
00:27:17,660 --> 00:27:19,820
En Ek sal op die knoppie net een kliek.

527
00:27:19,820 --> 00:27:23,930
Jy het op 'n knoppie, as jy
kan hier in die waarskuwing te sien.

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

529
00:27:25,810 --> 00:27:28,980
Klik op die knoppie twee, het jy
kliek op 'n knoppie twee.

530
00:27:28,980 --> 00:27:32,150
>> Sodat beide knoppies die
dieselfde funksie oproep, reg?

531
00:27:32,150 --> 00:27:35,840
Hulle was albei waarskuwing naam
geval, maar hierdie gebeurtenis voorwerp

532
00:27:35,840 --> 00:27:41,900
wat kry geskep wanneer ons kliek
dit vertel ons watter knoppie is gekliek.

533
00:27:41,900 --> 00:27:44,650
Ons het nie om te skryf twee afsonderlike
funksies of deal met wat

534
00:27:44,650 --> 00:27:46,470
om enige bykomende inligting te slaag.

535
00:27:46,470 --> 00:27:48,220
Ons is net vertrou op
wat JavaScript

536
00:27:48,220 --> 00:27:53,772
vir ons doen, wat is om te skep wat
soort gebeurtenis voorwerp namens ons.

537
00:27:53,772 --> 00:27:56,730
Daar is 'n baie meer om JavaScript as
wat ons het wat in hierdie video,

538
00:27:56,730 --> 00:27:58,521
maar met hierdie
fundamentele moet jy

539
00:27:58,521 --> 00:28:00,690
nogal 'n lang maniere om
leer alles wat jy

540
00:28:00,690 --> 00:28:04,030
nodig om te weet oor hierdie
interessante taal.

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

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

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