1
00:00:00,000 --> 00:00:03,840
>> [REPRODUCCIÓ DE MÚSICA]

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

3
00:00:05,770 --> 00:00:08,690
>> DOUG LLOYD: Així que per ara som vells
professionals en programació web, no?

4
00:00:08,690 --> 00:00:12,140
I hem cobert diversos
idiomes a vídeos individuals.

5
00:00:12,140 --> 00:00:14,690
I ara farem una més, JavaScript.

6
00:00:14,690 --> 00:00:17,370
>> Primer les bones notícies, JavaScript
és una de programació modern

7
00:00:17,370 --> 00:00:21,410
llenguatge molt com PHP la
sintaxi es deriva de C,

8
00:00:21,410 --> 00:00:22,830
així que és un bon lloc per començar.

9
00:00:22,830 --> 00:00:25,880
És gairebé tan antiga com PHP, així,
havent estat del voltant d'uns 20 anys.

10
00:00:25,880 --> 00:00:28,600
Va ser inventat al voltant
al mateix temps que PHP.

11
00:00:28,600 --> 00:00:32,240
I Javascript és en realitat bastant
fonamental per a l'experiència de l'usuari

12
00:00:32,240 --> 00:00:32,740
del web.

13
00:00:32,740 --> 00:00:34,448
De fet, hi ha
tres llengües que

14
00:00:34,448 --> 00:00:38,480
diria espècie de compensar la
l'experiència de l'usuari d'interactuar

15
00:00:38,480 --> 00:00:42,650
amb el lloc web, html,
CSS i JavaScript.

16
00:00:42,650 --> 00:00:46,030
I ara anem a parlar una
poc sobre JavaScript.

17
00:00:46,030 --> 00:00:50,301
>> La mala notícia, però, amb JavaScript és
que estableix un munt de regles per a si mateix,

18
00:00:50,301 --> 00:00:51,300
i després se les trenca.

19
00:00:51,300 --> 00:00:54,010
I JavaScript pot ser realitat
tipus de repte d'aprendre,

20
00:00:54,010 --> 00:00:57,000
perquè és a diferència de C i
PHP, que són molt estructurat

21
00:00:57,000 --> 00:01:00,270
i tenen regles molt rígides
de com les coses poden funcionar.

22
00:01:00,270 --> 00:01:03,690
JavaScript té classe
de fet tan flexibles

23
00:01:03,690 --> 00:01:06,650
que potser les coses no van a
treballar de la manera que esperem que,

24
00:01:06,650 --> 00:01:09,830
i potser realment no podem aprendre
el nostre primer llenguatge de programació

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

26
00:01:10,769 --> 00:01:12,810
Així que potser ja no ho fa
fixat cap norma,

27
00:01:12,810 --> 00:01:15,754
i en realitat no
reforçar els bons hàbits de codificació.

28
00:01:15,754 --> 00:01:18,170
Però ara que hem desenvolupat amb sort
alguns hàbits bons de codificació,

29
00:01:18,170 --> 00:01:21,470
i així podem començar a incursionar
en JavaScript una mica.

30
00:01:21,470 --> 00:01:25,750
>> Per escriure JavaScript, similar a l'obertura
un arxiu C amb una extensió C dot

31
00:01:25,750 --> 00:01:29,770
o un arxiu PHP amb una extensió de punt PHP,
tot el que necessitem fer és obrir un arxiu

32
00:01:29,770 --> 00:01:31,764
amb l'extensió d'arxiu del punt js.

33
00:01:31,764 --> 00:01:34,430
No necessita tenir cap especial
delimitadors com ho vam fer en PHP.

34
00:01:34,430 --> 00:01:36,750
Aquest tipus d'angle
suport de signe d'interrogació PHP

35
00:01:36,750 --> 00:01:40,300
que estem acostumats d'això, el camí
li diem al nostre navegador que el que tenim és

36
00:01:40,300 --> 00:01:43,502
Javascript és mitjançant la inclusió de
en una etiqueta html,

37
00:01:43,502 --> 00:01:46,210
i anem a veure una mica sobre
com fer això en un moment.

38
00:01:46,210 --> 00:01:48,210
>> L'altra cosa que fa
JavaScript diferent,

39
00:01:48,210 --> 00:01:50,580
però, és que s'executa en el client.

40
00:01:50,580 --> 00:01:53,430
Així que recordar amb PHP que
mai podríem veure realment

41
00:01:53,430 --> 00:01:57,041
el PHP que va subratllar un lloc web.

42
00:01:57,041 --> 00:01:59,040
Si alguna vegada van veure The
font de la pàgina, només ho faria

43
00:01:59,040 --> 00:02:02,830
veure l'html que era
generada per que PHP.

44
00:02:02,830 --> 00:02:04,900
Però JavaScript s'executa en el client.

45
00:02:04,900 --> 00:02:06,710
El vostre JavaScript s'executa a l'ordinador.

46
00:02:06,710 --> 00:02:09,050
I és per això que vostè pot fer
coses com afegir bloquejadors.

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

48
00:02:09,550 --> 00:02:12,704
Bloqueig anunci es fa generalment per
matant a tot el Javascript

49
00:02:12,704 --> 00:02:14,370
que s'executa en un lloc web en particular.

50
00:02:14,370 --> 00:02:19,000
I pel fet que hauria de
executar en el costat del client de la màquina,

51
00:02:19,000 --> 00:02:21,910
només pot aturar la
JavaScript per funcionar del tot.

52
00:02:21,910 --> 00:02:27,030
Això també vol dir que quan s'utilitza
un lloc web que inclou JavaScript,

53
00:02:27,030 --> 00:02:32,450
vostè ha d'enviar el codi JavaScript
codi com a part de la seva resposta http

54
00:02:32,450 --> 00:02:34,159
al client quan ho sol·licitin.

55
00:02:34,159 --> 00:02:35,950
I pel que no podria
voler utilitzar JavaScript

56
00:02:35,950 --> 00:02:38,395
per fer coses molt sensibles
de la mateixa manera que la informació que passa

57
00:02:38,395 --> 00:02:41,020
sobre les contrasenyes dels usuaris cap enrere i
a un altre, perquè són en realitat

58
00:02:41,020 --> 00:02:45,610
va rebre tot el codi font,
no només l'HTML que es genera,

59
00:02:45,610 --> 00:02:49,030
com seria el cas amb, per exemple PHP.

60
00:02:49,030 --> 00:02:51,620
>> Llavors, com incloem JavaScript
en el nostre html per començar?

61
00:02:51,620 --> 00:02:54,520
Bé, similar a CSS, en realitat,
és una espècie de com ho fem aquí.

62
00:02:54,520 --> 00:02:56,190
Amb CSS tenim etiquetes d'estil.

63
00:02:56,190 --> 00:03:00,760
I dins d'aquestes etiquetes d'estil,
podem definir un full d'estils CSS.

64
00:03:00,760 --> 00:03:03,450
De la mateixa manera amb JavaScript
podem obrir etiquetes de script,

65
00:03:03,450 --> 00:03:06,660
altra etiqueta html que no ho vam fer
parlar en el nostre vídeo html,

66
00:03:06,660 --> 00:03:09,720
i escriure en JavaScript
entre aquestes etiquetes de script.

67
00:03:09,720 --> 00:03:13,960
També, però, com CSS, que
podria vincular als afores arxius CSS

68
00:03:13,960 --> 00:03:15,900
i tirar d'ells en el nostre programa d'aquesta manera.

69
00:03:15,900 --> 00:03:18,280
Amb CSS també pot,
perdó, amb Javascript

70
00:03:18,280 --> 00:03:23,240
també podem especificar l'origen
atribut de l'etiqueta de script

71
00:03:23,240 --> 00:03:25,720
per enllaçar en JavaScript
per separat, de manera que no ho fa

72
00:03:25,720 --> 00:03:27,680
ha de escriure-ho en
entre etiquetes de script, que

73
00:03:27,680 --> 00:03:29,600
pot vincular en l'ús de
que etiqueta script també.

74
00:03:29,600 --> 00:03:33,230
I igual que amb el cas de la CSS, on
recomanem que probablement era

75
00:03:33,230 --> 00:03:36,090
en el seu millor interès per escriure
el teu CSS en un arxiu separat en el cas

76
00:03:36,090 --> 00:03:38,500
que necessita per canviar-lo,
igualment fem recomanem

77
00:03:38,500 --> 00:03:40,720
que escrigui la seva
JavaScript en arxius separats

78
00:03:40,720 --> 00:03:45,460
i l'ús de la font d'etiquetes de script
atribuir a lligar la seva habilitat

79
00:03:45,460 --> 00:03:49,520
en el seu html, la seva pàgina web.

80
00:03:49,520 --> 00:03:52,610
>> Així les variables de JavaScript, anem a
començar a parlar de la sintaxi aquí.

81
00:03:52,610 --> 00:03:53,600
I anirem a través
aquest tipus de forma ràpida,

82
00:03:53,600 --> 00:03:56,640
perquè hem fet això en PHP, de manera que
tot això ha de ser bastant familiar.

83
00:03:56,640 --> 00:03:59,490
Així variables en JavaScript són
molt similar a PHP variables.

84
00:03:59,490 --> 00:04:03,270
No hi ha especificador de tipus, i
quan s'introdueix una variable,

85
00:04:03,270 --> 00:04:05,070
el prefix amb la paraula clau var.

86
00:04:05,070 --> 00:04:07,750
En PHP que anàvem a fer alguna cosa
així, el signe de dòlar x.

87
00:04:07,750 --> 00:04:09,950
Així és com hem indicat
una variable, però no,

88
00:04:09,950 --> 00:04:12,060
no esmenten el tipus
de la variable en absolut.

89
00:04:12,060 --> 00:04:15,124
Ens agradaria dir alguna cosa com
signe de dòlar x és igual a 44 en PHP.

90
00:04:15,124 --> 00:04:17,040
Si fèiem el
el mateix en JavaScript,

91
00:04:17,040 --> 00:04:19,589
diríem var x és igual a 44.

92
00:04:19,589 --> 00:04:22,780
Així var és una mena de camí
d'introduir una variable.

93
00:04:22,780 --> 00:04:26,850
Això és potser una mica més intuïtiu
que només la variable signe de dòlar.

94
00:04:26,850 --> 00:04:29,080
>> Un cop més, ja que no hi ha
tipus de dades, podríem fer això

95
00:04:29,080 --> 00:04:34,490
amb qualsevol tipus de dades, seqüències,
qualsevol altra cosa seria tot ésser var.

96
00:04:34,490 --> 00:04:37,260
Condicionals, tot el nostre
vells amics de C i PHP

97
00:04:37,260 --> 00:04:41,640
encara estan disponibles, pel que tenim si,
else if, else, switch i pregunta

98
00:04:41,640 --> 00:04:42,240
marca de còlon.

99
00:04:42,240 --> 00:04:45,890
Interruptor restant tan flexible com
estava en PHP, però tot això que estàs

100
00:04:45,890 --> 00:04:46,930
coneix a hores d'ara.

101
00:04:46,930 --> 00:04:49,900
I de manera similar amb bucles són
els antics favorits de temps,

102
00:04:49,900 --> 00:04:52,700
fer temps, i per seguir al nostre abast.

103
00:04:52,700 --> 00:04:55,880
Així que ja sabem molt del
espècie JavaScript bàsic de fonaments

104
00:04:55,880 --> 00:05:01,800
pel sol fet de tenir una mica
del coneixement ara sobre C i PHP.

105
00:05:01,800 --> 00:05:03,670
>> Què passa amb les funcions en JavaScript?

106
00:05:03,670 --> 00:05:08,199
Bé, similar a PHP cada funció és
introduïda amb la paraula clau function.

107
00:05:08,199 --> 00:05:10,740
Vostè diu que la funció i, a continuació
començar a definir la seva funció.

108
00:05:10,740 --> 00:05:12,531
Què és una mica diferent
sobre JavaScript,

109
00:05:12,531 --> 00:05:15,700
però, és la capacitat de tenir
el que s'anomena una funció anònima.

110
00:05:15,700 --> 00:05:18,880
Així que vostè pot definir funcions
que no tenen un nom.

111
00:05:18,880 --> 00:05:21,222
Això és una cosa que
realment no han vist abans.

112
00:05:21,222 --> 00:05:23,430
Realment Farem servir el concepte
d'una funció anònima

113
00:05:23,430 --> 00:05:27,880
una mica més endavant en aquest
vídeo, perquè va a

114
00:05:27,880 --> 00:05:31,530
fer una mica més de sentit en el seu context
quan ho veiem en una situació particular

115
00:05:31,530 --> 00:05:33,120
que he Vaig construir aquí.

116
00:05:33,120 --> 00:05:35,710
Però anem a fer una ullada
en el que és una senzilla JavaScript

117
00:05:35,710 --> 00:05:37,850
funció podria ser similar.

118
00:05:37,850 --> 00:05:40,610
>> Així que m'he anat per davant i
obert el meu CS50 IDE

119
00:05:40,610 --> 00:05:43,690
i ja m'he quedat Apache
per començar el meu servidor en execució.

120
00:05:43,690 --> 00:05:46,800
I tinc aquesta imatge
obert anomenat home.html.

121
00:05:46,800 --> 00:05:48,330
I vaig a zoom en una mica aquí.

122
00:05:48,330 --> 00:05:52,090
I en el fons, es pot veure el
Home.html és només un munt de botons.

123
00:05:52,090 --> 00:05:55,291
I estic afirmant en la part superior aquí
que aquesta és la secció JavaScript

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

125
00:05:55,790 --> 00:05:59,490
Així que hi ha un munt de botons d'aquí,
però ¿què aquests botons fan realment?

126
00:05:59,490 --> 00:06:03,662
>> Bé, ens dirigirem al meu IED,
i home.html he obrir aquí.

127
00:06:03,662 --> 00:06:05,620
Al començament,
aquí és on sóc vinculant

128
00:06:05,620 --> 00:06:07,500
en tots els meus arxius de codi font de JavaScript.

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

130
00:06:08,000 --> 00:06:12,440
Així que tinc anonymous.js, clock.js,
Estic usant l'atribut d'origen

131
00:06:12,440 --> 00:06:14,440
de l'etiqueta script per enllaçar a l'arxiu.

132
00:06:14,440 --> 00:06:18,660
Així que no he escrit cap
JavaScript directament en aquest arxiu,

133
00:06:18,660 --> 00:06:21,790
però m'he tirat a tot el
JavaScript he escrit separat.

134
00:06:21,790 --> 00:06:24,540
I si ens desplacem fins aquí, aquest
tots hem de buscar alguna cosa familiar

135
00:06:24,540 --> 00:06:27,090
amb una mica de nova sintaxi.

136
00:06:27,090 --> 00:06:32,655
Tenim aquí etiqueta de capçalera per
funcions i després un botó.

137
00:06:32,655 --> 00:06:35,530
Tinc una entrada que és un botó de tipus,
i pel que sembla quan faig clic,

138
00:06:35,530 --> 00:06:38,130
Vaig a trucar a alguns
funció de la data d'alerta.

139
00:06:38,130 --> 00:06:41,792
I així és com podem espècie de barrejar
una mica de JavaScript i HTML.

140
00:06:41,792 --> 00:06:44,500
En realitat juguen força bé
junts, i el que sembla quan

141
00:06:44,500 --> 00:06:48,730
Faig clic en aquest botó, vaig
per trucar a una data d'alerta funció.

142
00:06:48,730 --> 00:06:53,660
I de la mateixa manera tinc vaig definir comportaments
per a tots els altres botons que

143
00:06:53,660 --> 00:06:56,440
estan en aquesta pàgina home.html,
que seguirem tornant

144
00:06:56,440 --> 00:06:59,172
a durant el curs d'aquest vídeo.

145
00:06:59,172 --> 00:07:00,880
Però tornem a
aquí i fer una ullada

146
00:07:00,880 --> 00:07:03,850
en clock.js, que és el
Arxiu JavaScript que jo

147
00:07:03,850 --> 00:07:07,370
va escriure que té aquesta primera funció
anem a fer una ullada a.

148
00:07:07,370 --> 00:07:11,630
Com es pot veure, començo la meva JavaScript
funcionar amb la funció de la paraula clau,

149
00:07:11,630 --> 00:07:14,560
i jo he donat a aquest un
nom, es diu data d'alerta.

150
00:07:14,560 --> 00:07:18,710
Dins d'allí, pel que sembla, es crea un
nova variable local anomenada data actual.

151
00:07:18,710 --> 00:07:21,500
I jo vaig a assignar
un igual a una nova data.

152
00:07:21,500 --> 00:07:24,430
I podríem entrar en un munt de
detall pel que fa al que és una data,

153
00:07:24,430 --> 00:07:27,060
i realment Javascript és tan
gran que no podem possiblement

154
00:07:27,060 --> 00:07:28,330
cobrir tot en un sol vídeo.

155
00:07:28,330 --> 00:07:32,220
Però n'hi ha prou amb dir, que això va
per tornar a mi un element de dades que

156
00:07:32,220 --> 00:07:35,470
encapsula la data i l'hora actual.

157
00:07:35,470 --> 00:07:39,100
Estic emmagatzemant que en una variable que sóc
pel que sembla va a alertar la data actual.

158
00:07:39,100 --> 00:07:41,300
>> Bé, el que fa d'alerta
data actual sembla?

159
00:07:41,300 --> 00:07:46,460
Anem a fer una ullada a l'arxiu en si
la part posterior sobre la finestra del navegador.

160
00:07:46,460 --> 00:07:49,551
Així que de nou, aquest és el botó que em
s'han vinculat a aquesta funció amb nom.

161
00:07:49,551 --> 00:07:51,800
I faig clic allà i
mira el que va fer, va alertar.

162
00:07:51,800 --> 00:07:56,140
Es va aparèixer aquest tipus de quadre dient
mi que el moment actual és, segons sembla,

163
00:07:56,140 --> 00:07:59,370
que posa el 4 de novembre a les
10:43:43 del matí.

164
00:07:59,370 --> 00:08:02,345
I si faig clic una altra vegada, ara
és uns segons més tard, no?

165
00:08:02,345 --> 00:08:03,720
Així que això és tot el que fa aquesta funció.

166
00:08:03,720 --> 00:08:07,670
Quan faig clic en aquest botó,
fa esclatar cap amunt un missatge d'alerta a mi.

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

168
00:08:13,806 --> 00:08:15,690
Així que en realitat no és
massa a les funcions

169
00:08:15,690 --> 00:08:19,110
això és diferent de PHP,
només una mica de nova sintaxi

170
00:08:19,110 --> 00:08:22,500
que ve amb el treball amb JavaScript.

171
00:08:22,500 --> 00:08:24,650
>> Arrays en Javascript són
bastant senzill.

172
00:08:24,650 --> 00:08:27,200
Per declarar una matriu, s'utilitza
la sintaxi de claudàtors

173
00:08:27,200 --> 00:08:30,090
que estem familiaritzats amb des de PHP.

174
00:08:30,090 --> 00:08:33,432
I similar a PHP, ens
També pot barrejar els tipus de dades.

175
00:08:33,432 --> 00:08:35,140
Així que aquest array, tant
d'aquestes matrius ho faria

176
00:08:35,140 --> 00:08:36,960
ser perfectament legítima JavaScript.

177
00:08:36,960 --> 00:08:42,500
Un que és tots els nombres enters, i que
es barregen diferents tipus de dades.

178
00:08:42,500 --> 00:08:45,020
>> Què és una cosa molt diferent
en JavaScript, encara?

179
00:08:45,020 --> 00:08:47,020
Aquesta és la idea d'un objecte.

180
00:08:47,020 --> 00:08:50,240
Així que potser has sentit parlar de
La programació orientada a objectes.

181
00:08:50,240 --> 00:08:53,370
Nosaltres no fem molt d'això en CS50,
però farem una mica d'ell

182
00:08:53,370 --> 00:08:55,670
aquí en el context de JavaScript.

183
00:08:55,670 --> 00:08:59,100
Ara JavaScript té la capacitat de
comportar-se com una programació orientada a objectes

184
00:08:59,100 --> 00:09:02,615
idioma, però no és en si mateixa
exclusivament un objecte orientat

185
00:09:02,615 --> 00:09:03,490
llenguatge de programació.

186
00:09:03,490 --> 00:09:05,281
I això ve de nou
de nou a per què he dit,

187
00:09:05,281 --> 00:09:10,610
pot ser molt difícil d'aprendre
JavaScript com la seva primera programació

188
00:09:10,610 --> 00:09:13,890
idioma, perquè no fa
adaptar realment un paradigma particular.

189
00:09:13,890 --> 00:09:16,430
>> C D'altra banda és una
llenguatge de programació funcional.

190
00:09:16,430 --> 00:09:22,270
Si volem, les funcions són
una mena de gran cap, no?

191
00:09:22,270 --> 00:09:24,410
Dicten el
succeeix tota la resta.

192
00:09:24,410 --> 00:09:26,600
Volem canviar les variables,
que anomenem funcions.

193
00:09:26,600 --> 00:09:28,220
Fem les coses a les funcions.

194
00:09:28,220 --> 00:09:31,250
Objectes en canvi, en un
llenguatge orientat a objectes,

195
00:09:31,250 --> 00:09:35,937
objectes espècie de convertir-se en l'estrella i
funcions es converteixen en una mena de secundària.

196
00:09:35,937 --> 00:09:38,270
Però el que és un objecte, el que
És aquesta noció d'un objecte?

197
00:09:38,270 --> 00:09:40,880
Bé, si ajuda, pensa
respecte al primer ordenar

198
00:09:40,880 --> 00:09:44,540
així com una estructura de C o una estructura
que hem après abans.

199
00:09:44,540 --> 00:09:47,430
En C, una estructura conté
una sèrie de camps,

200
00:09:47,430 --> 00:09:51,174
i potser ara podria començar a
cridar a aquests camps de propietats.

201
00:09:51,174 --> 00:09:53,590
Però les propietats mai
valer-se per si mateixos, no?

202
00:09:53,590 --> 00:09:56,410
Si defineixo una estructura per a un cotxe
així amb els dos següents

203
00:09:56,410 --> 00:10:00,750
camps o propietats, un 1
sencer per a l'any del cotxe

204
00:10:00,750 --> 00:10:04,290
i un altre un personatge 10
cadena per al model del cotxe,

205
00:10:04,290 --> 00:10:07,150
Puc dir alguna cosa com això,
Puc declarar una nova variable

206
00:10:07,150 --> 00:10:10,080
de tipus struct Herbie cotxe.

207
00:10:10,080 --> 00:10:13,730
I llavors puc dir alguna cosa
com a iguals herbie.year 1,963,

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

209
00:10:15,850 --> 00:10:17,000
Està bé.

210
00:10:17,000 --> 00:10:19,680
Estic usant els camps de la
context de l'estructura,

211
00:10:19,680 --> 00:10:22,290
però jo mai podria simplement
dir alguna cosa com això.

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

213
00:10:22,790 --> 00:10:26,836
No puc fer servir el nom del camp
independent de l'estructura.

214
00:10:26,836 --> 00:10:28,210
És una espècie d'una cosa fonamental.

215
00:10:28,210 --> 00:10:32,990
>> Així de ser camps
fonamental a les estructures C

216
00:10:32,990 --> 00:10:39,050
són molt similars a ser propietats
fonamental per a objectes JavaScript.

217
00:10:39,050 --> 00:10:42,080
Però el que els fa
particularment interessant

218
00:10:42,080 --> 00:10:46,230
és que els objectes també poden tenir el
estan cridats mètodes, que són realment

219
00:10:46,230 --> 00:10:50,730
només una paraula elegant per a les funcions que
són inherents a l'objecte també.

220
00:10:50,730 --> 00:10:55,340
Així que és una funció que només pot ser
trucada en el context d'un objecte.

221
00:10:55,340 --> 00:10:59,200
Només un objecte que ha definit
aquesta funció dins del seu,

222
00:10:59,200 --> 00:11:02,020
si vostè pensa sobre un
estructura, la funció

223
00:11:02,020 --> 00:11:05,720
es defineix dins de les que defineixen
claus de l'estructura.

224
00:11:05,720 --> 00:11:07,980
Així que només significa una cosa
a l'estructura.

225
00:11:07,980 --> 00:11:10,960
I això és una mena del que estem fent
aquí amb objectes i mètodes.

226
00:11:10,960 --> 00:11:13,580
És bàsicament com estem
definir una funció que

227
00:11:13,580 --> 00:11:16,670
només té sentit en un
objecte particular, pel que

228
00:11:16,670 --> 00:11:19,440
trucar a un mètode que l'objecte.

229
00:11:19,440 --> 00:11:23,180
I mai podem anomenar a això
funció independent de l'objecte,

230
00:11:23,180 --> 00:11:29,260
de la mateixa manera que no podem dir any o model
independent de l'estructura en C.

231
00:11:29,260 --> 00:11:32,300
>> Així que la programació funcional
paradigmes veuen alguna cosa com això.

232
00:11:32,300 --> 00:11:35,450
Funció i després quan passes
en l'objecte com un paràmetre.

233
00:11:35,450 --> 00:11:38,650
En una programació orientada a objectes
idiomes, aquest tipus de obté

234
00:11:38,650 --> 00:11:43,464
capgirat, i ens agradaria pensar
Com és això, object.function.

235
00:11:43,464 --> 00:11:45,380
Per tant, una mena d'aquest punt
operador de nou el que implica

236
00:11:45,380 --> 00:11:49,540
que es tracta d'algun tipus de propietat
o atribut de l'objecte mateix.

237
00:11:49,540 --> 00:11:53,240
Però això és el que un objecte
llenguatge de programació orientat

238
00:11:53,240 --> 00:11:57,150
podria fer per fer una funció
trucar a un mètode, de nou, que

239
00:11:57,150 --> 00:12:00,260
és només una paraula especial per a una funció
que és inherent a un objecte.

240
00:12:00,260 --> 00:12:03,440
Això és el que
sintaxi podria ser similar.

241
00:12:03,440 --> 00:12:09,360
I així anem a començar a veure alguns
això en el context de JavaScript.

242
00:12:09,360 --> 00:12:12,470
>> També es pot pensar en un objecte
una mena de matriu associativa,

243
00:12:12,470 --> 00:12:14,160
que estem familiaritzats amb des de PHP.

244
00:12:14,160 --> 00:12:17,720
Recordeu una matriu associativa permet
nosaltres tenir parells de valors clau, en lloc

245
00:12:17,720 --> 00:12:23,040
de tenir índexs 0, un, dos, tres,
i així successivament com que estem acostumats de C

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

247
00:12:23,940 --> 00:12:27,472
Les matrius associatives poden assignar
paraules, com en el video PHP,

248
00:12:27,472 --> 00:12:29,180
parlàvem
ingredients de les pizzes.

249
00:12:29,180 --> 00:12:31,180
I així que vam tenir una matriu
anomenats pizzes, i ens

250
00:12:31,180 --> 00:12:36,670
tenia formatge era una clau i 8,99 $ era el
valor, i després de pepperoni era una clau,

251
00:12:36,670 --> 00:12:39,190
9,99 $ era un valor, i així successivament.

252
00:12:39,190 --> 00:12:43,300
I així, també podem pensar en un
objectar tipus de similar a un associativa

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

254
00:12:43,840 --> 00:12:47,020
I així aquesta sintaxi aquí
crearia un nou objecte

255
00:12:47,020 --> 00:12:50,950
anomenada herbie amb de dos
propietats a l'interior de la mateixa.

256
00:12:50,950 --> 00:12:57,310
Any, que s'assigna el valor 1963,
i el model, que s'assigna la cadena de

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

258
00:12:58,140 --> 00:13:01,770
>> I noto aquí que estic fent servir
cometes simples en JavaScript.

259
00:13:01,770 --> 00:13:05,570
Vostè pot utilitzar cometes simples o dobles
quan s'està parlant de cadenes.

260
00:13:05,570 --> 00:13:07,772
És només convencionalment
el cas que la majoria de les vegades

261
00:13:07,772 --> 00:13:10,230
quan estàs escrivint JavaScript,
només ha d'utilitzar cometes simples.

262
00:13:10,230 --> 00:13:15,050
Però podria utilitzar cometes dobles aquí, i
això seria perfectament bé també.

263
00:13:15,050 --> 00:13:17,470
>> Així que recorda com en
PHP vam tenir aquesta idea

264
00:13:17,470 --> 00:13:22,730
d'un per a cada llaç que ens permetria
per repetir tot el valor de la clau

265
00:13:22,730 --> 00:13:25,270
parells d'un associativa
matriu, perquè

266
00:13:25,270 --> 00:13:29,050
no tenen aquesta capacitat d'iterar
a través de 0, un, dos, tres, quatre,

267
00:13:29,050 --> 00:13:30,710
etcètera?

268
00:13:30,710 --> 00:13:35,010
JavaScript té alguna cosa molt similar,
però no diu per a cada bucle,

269
00:13:35,010 --> 00:13:38,960
es diu una en bucles.

270
00:13:38,960 --> 00:13:42,890
Així que si em vaig dir a mi com
això, per a la clau var en l'objecte,

271
00:13:42,890 --> 00:13:48,670
això és tipus de similar a dir
per a cada cosa com alguna cosa.

272
00:13:48,670 --> 00:13:53,850
Però tot el que estic fent aquí és la iteració
a través de totes les claus de la meva objecte.

273
00:13:53,850 --> 00:13:56,070
I a l'interior de l'arrissat
suports allà, ho faria

274
00:13:56,070 --> 00:14:03,410
utilitzar objecte clau entre claudàtors per referir
al valor en aquest lloc clau.

275
00:14:03,410 --> 00:14:05,400
>> Com a alternativa, hi ha
fins i tot un altre enfocament.

276
00:14:05,400 --> 00:14:10,880
Si tan sols només es preocupen pel
valors, puc dir amb clau de l'objecte,

277
00:14:10,880 --> 00:14:12,360
i sols recórrer clau dins.

278
00:14:12,360 --> 00:14:17,240
Així que per la clau var en l'objecte, no tinc
utilitzar claudàtors d'objectes

279
00:14:17,240 --> 00:14:19,340
clau dins del bucle.

280
00:14:19,340 --> 00:14:24,580
Per clau var l'objecte, que pugui
només ha d'utilitzar claus dins del bucle,

281
00:14:24,580 --> 00:14:29,040
perquè jo només sóc específicament
parlant dels valors allà.

282
00:14:29,040 --> 00:14:32,630
>> Així que anem a fer una tal
mirar a la diferència

283
00:14:32,630 --> 00:14:35,670
només per mostrar ràpidament
la diferència entre les quatre

284
00:14:35,670 --> 00:14:40,730
en i per la d'un molt específic
matriu, el que tenim aquí, setmana matriu.

285
00:14:40,730 --> 00:14:43,616
Així que he de trobar una nova matriu
que em vaig omplir de set cordes,

286
00:14:43,616 --> 00:14:46,240
Dilluns, Dimarts, Dimecres,
Dijous, Divendres, Dissabte, Diumenge.

287
00:14:46,240 --> 00:14:50,530
I vull ara iterar
a través d'aquesta matriu,

288
00:14:50,530 --> 00:14:53,090
impressió de certa informació.

289
00:14:53,090 --> 00:14:58,780
Si jo faig servir una al bucle
imprimir informació,

290
00:14:58,780 --> 00:15:00,710
¿Què creus que em vaig a posar?

291
00:15:00,710 --> 00:15:01,710
Bé, anem a fer una ullada.

292
00:15:01,710 --> 00:15:05,300
I abans de saltar sobre
a la meva finestra del navegador,

293
00:15:05,300 --> 00:15:08,090
només sé que
console.log és una espècie d'un sol

294
00:15:08,090 --> 00:15:10,630
forma de fer una F d'impressió en JavaScript.

295
00:15:10,630 --> 00:15:12,040
Però, què és la consola?

296
00:15:12,040 --> 00:15:14,940
Bé, això és el que anem
anar a fer una ullada a aquest moment.

297
00:15:14,940 --> 00:15:16,850
>> OK, així que estem de tornada aquí
a la meva finestra del navegador,

298
00:15:16,850 --> 00:15:19,410
i jo vaig a obrir
les meves eines per a desenvolupadors.

299
00:15:19,410 --> 00:15:22,290
Un cop més, només estic colpejant F12
per obrir les eines de desenvolupament.

300
00:15:22,290 --> 00:15:25,670
I adonar-se que aquí al
superior que he triat consola.

301
00:15:25,670 --> 00:15:28,480
Així que aquesta és la noció
d'una consola de desenvolupador,

302
00:15:28,480 --> 00:15:30,500
i ens permetrà
imprimir la informació d'una ullada,

303
00:15:30,500 --> 00:15:33,000
alguna cosa així com el terminal, però
com veurem una mica més endavant,

304
00:15:33,000 --> 00:15:37,720
també podem escriure informació en
per interactuar amb la nostra pàgina web.

305
00:15:37,720 --> 00:15:42,320
Me'n vaig a apropar una mica aquí,
i vaig ara feu clic a en la prova.

306
00:15:42,320 --> 00:15:45,230
I quatre en test-- No vaig a
et mostrarà el codi per a això en aquest moment,

307
00:15:45,230 --> 00:15:47,479
però ho aconseguiràs si
descarregar el codi font que

308
00:15:47,479 --> 00:15:50,380
s'associa amb aquest vídeo--
és només que en el bucle

309
00:15:50,380 --> 00:15:52,610
que vam veure només una
Fa segons en la diapositiva.

310
00:15:52,610 --> 00:15:54,810
>> Així que vaig a clic que
botó i aquí,

311
00:15:54,810 --> 00:15:58,440
això és el que ha imprès en el
consola, 0, un, dos, tres, quatre, cinc,

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

313
00:15:58,940 --> 00:16:02,490
No em imprimeixo la informació
dins d'aquests llocs de la matriu,

314
00:16:02,490 --> 00:16:05,180
perquè vaig utilitzar una al bucle.

315
00:16:05,180 --> 00:16:10,670
I l'interior del cos del bucle, I
simplement imprimir clau no clau objectar.

316
00:16:10,670 --> 00:16:18,600
Però si ara em aclareixo la consola, i jo
canviar a per de prova, i quatre de prova

317
00:16:18,600 --> 00:16:22,500
Dic jo faig servir per de bucle
lloc i imprimir clau,

318
00:16:22,500 --> 00:16:28,079
si faig clic en això, ara m'estic posant la
elements reals dins del meu objecte

319
00:16:28,079 --> 00:16:29,120
o la meva matriu en aquest cas.

320
00:16:29,120 --> 00:16:31,760
La meva sèrie de dies de la setmana.

321
00:16:31,760 --> 00:16:33,480
Vaig imprimir dilluns
Dimarts, dimecres.

322
00:16:33,480 --> 00:16:36,930
Així que aquesta és la diferència entre
una al bucle, que imprimeix

323
00:16:36,930 --> 00:16:43,410
només les claus si només utilitza clau
interior del cos del bucle,

324
00:16:43,410 --> 00:16:46,850
i una per de bucle, que imprimeix
els valors si s'utilitza només

325
00:16:46,850 --> 00:16:48,870
clau a l'interior del cos del bucle.

326
00:16:48,870 --> 00:16:52,380
>> Molt bé, com ara comencem a
concatenar cadenes i potser barrejar

327
00:16:52,380 --> 00:16:57,220
algunes variables amb interpolació
com si fóssim capaços de fer en PHP?

328
00:16:57,220 --> 00:16:59,410
Bé, estem bastant familiaritzats
amb això des de PHP.

329
00:16:59,410 --> 00:17:04,109
Així és com ho faríem amb el
operador punt per concatenar cadenes.

330
00:17:04,109 --> 00:17:06,260
En JavaScript, però,
realment fem servir una mica

331
00:17:06,260 --> 00:17:09,290
anomenada l'operador més, que
és potser fins i tot una mica més

332
00:17:09,290 --> 00:17:10,470
intuïtiva, oi?

333
00:17:10,470 --> 00:17:12,609
Estem afegint un munt
de cadenes junts.

334
00:17:12,609 --> 00:17:14,520
Així que anem al capdavant cap enrere
una vegada i veure el que aquest

335
00:17:14,520 --> 00:17:18,693
imprimirà si estem tractant d'imprimir
tota la informació en setmanes fallida.

336
00:17:18,693 --> 00:17:20,859
Molt bé, així que aquí baix
sota la concatenació de cadenes,

337
00:17:20,859 --> 00:17:24,822
Tinc dues opcions, la construcció de la cadena
V1 V2 i després edifici cadena.

338
00:17:24,822 --> 00:17:26,530
I anem a veure per què
necessitarà V2 en un segon.

339
00:17:26,530 --> 00:17:28,610
Però vaig clic a
edifici V1 cadena, que

340
00:17:28,610 --> 00:17:30,360
El codi estàvem
Només fer una ullada a,

341
00:17:30,360 --> 00:17:32,980
el console.log amb tots els avantatges.

342
00:17:32,980 --> 00:17:35,910
Anem a veure si aquesta gravats
el que esperem.

343
00:17:35,910 --> 00:17:39,939
>> El dilluns és el dia número 01 de la setmana,
Dimarts és el dia número 11 de la setmana.

344
00:17:39,939 --> 00:17:41,730
Bé, el que jo estava tractant
a fer allà era arribar

345
00:17:41,730 --> 00:17:46,280
per imprimir Dilluns és el nombre dies
un, dimarts és el dia número dos.

346
00:17:46,280 --> 00:17:50,140
Però sembla com si jo fos
sempre imprimir un.

347
00:17:50,140 --> 00:17:51,260
Bé, per què és això?

348
00:17:51,260 --> 00:17:55,600
Bé, resulta que fer un altre cop d'ull
en aquest petit fragment de codi aquí.

349
00:17:55,600 --> 00:18:00,160
Cal notar que estem fent servir el signe més
operador en dos contextos diferents.

350
00:18:00,160 --> 00:18:03,221
>> I aquí és on potser les coses
quin tipus de hem estat dient,

351
00:18:03,221 --> 00:18:03,970
oh, és tan gran.

352
00:18:03,970 --> 00:18:05,910
Nosaltres no tractem amb els tipus de dades més.

353
00:18:05,910 --> 00:18:08,220
Però aquí és on el fet
que perdem tipus de dades

354
00:18:08,220 --> 00:18:10,960
en realitat pot ser una mica
d'un problema per a nosaltres.

355
00:18:10,960 --> 00:18:16,260
Ara que l'operador de suma s'utilitza per
concatenar cadenes i afegir números

356
00:18:16,260 --> 00:18:19,550
junts, Javascript
per fer la seva millor conjectura

357
00:18:19,550 --> 00:18:22,030
en quant al que jo vull que faci per mi.

358
00:18:22,030 --> 00:18:23,900
I en aquest cas, que va endevinar malament.

359
00:18:23,900 --> 00:18:29,340
És dia només concatenats, que seria
0, un, dos, tres, quatre, cinc, o sis,

360
00:18:29,340 --> 00:18:32,060
i llavors, només es concatena
això i després concatenen un.

361
00:18:32,060 --> 00:18:35,020
No posar realment junts.

362
00:18:35,020 --> 00:18:37,320
I pel que aquestes llengües,
PHP i JavaScript,

363
00:18:37,320 --> 00:18:39,196
que abstreu
aquesta noció de tipus,

364
00:18:39,196 --> 00:18:40,820
vostè no ha de tractar amb ell mai més.

365
00:18:40,820 --> 00:18:43,600
Ells encara tenen tipus sota el capó.

366
00:18:43,600 --> 00:18:46,780
I podem, en situacions
així, aprofitar aquest fet

367
00:18:46,780 --> 00:18:49,240
dient alguna cosa
com potser això, que

368
00:18:49,240 --> 00:18:53,210
està dient JavaScript, pel
manera, tractar això com un sencer,

369
00:18:53,210 --> 00:18:57,100
no tractar-lo com una cadena, fins i tot
tot i que estem barrejant cadenes

370
00:18:57,100 --> 00:18:58,940
i sencers aquí.

371
00:18:58,940 --> 00:19:02,204
>> És només una d'aquestes coses
que sembla tan gran en el seu context

372
00:19:02,204 --> 00:19:04,120
que nosaltres no hem de
tractar amb tipus més,

373
00:19:04,120 --> 00:19:05,828
però de vegades hauràs
executar en una situació

374
00:19:05,828 --> 00:19:09,110
exactament com aquesta, on el fet que
vostè no té control sobre els tipus

375
00:19:09,110 --> 00:19:11,220
pot tornar-se en contra de vostè
si no vas amb compte.

376
00:19:11,220 --> 00:19:18,285
I pel que si ens pop tornar a IDE, estic
va a netejar la meva consola de nou,

377
00:19:18,285 --> 00:19:20,660
i jo vaig a fer clic cordes
edifici de la versió 2, que

378
00:19:20,660 --> 00:19:23,052
és on jo faig servir aquesta funció parse int.

379
00:19:23,052 --> 00:19:25,260
Ara s'està imprimint
informació que estic esperant.

380
00:19:25,260 --> 00:19:29,330
Nombre de dia de dilluns, dimarts
és dia número dos, i així successivament.

381
00:19:29,330 --> 00:19:31,170
>> Així que anem a parlar sobre les funcions de nou.

382
00:19:31,170 --> 00:19:34,790
Li vaig prometre que parlaríem d'anònims
funcions, i ara el context perquè

383
00:19:34,790 --> 00:19:36,360
per fi ha arribat.

384
00:19:36,360 --> 00:19:39,980
Així que abans de fer-ho, anem a parlar de nou
sobre les matrius per només un segon.

385
00:19:39,980 --> 00:19:42,120
Així arrays són una especial
cas d'un objecte.

386
00:19:42,120 --> 00:19:45,180
De fet, tot en
Javascript és en realitat un objecte.

387
00:19:45,180 --> 00:19:47,190
Així funcions són una
cas especial d'un objecte,

388
00:19:47,190 --> 00:19:49,770
sencers són un especial
cas d'un objecte,

389
00:19:49,770 --> 00:19:52,152
però matrius específicament
tenir un nombre de mètodes.

390
00:19:52,152 --> 00:19:55,110
Recordeu perquè són objectes,
poden tenir propietats i mètodes.

391
00:19:55,110 --> 00:19:58,600
Tenen un nombre de mètodes que
es pot aplicar a aquests objectes.

392
00:19:58,600 --> 00:20:01,197
Hi ha un mètode anomenat
mida, array.size,

393
00:20:01,197 --> 00:20:03,030
que tornarà a
que com era d'esperar

394
00:20:03,030 --> 00:20:05,120
el nombre d'elements en la matriu.

395
00:20:05,120 --> 00:20:08,480
Array.pop, una mena de
la nostra idea de fer esclatar apagat

396
00:20:08,480 --> 00:20:11,110
d'una pila, si recordes
des del nostre vídeo piles,

397
00:20:11,110 --> 00:20:13,810
Elimina l'últim element de la matriu.

398
00:20:13,810 --> 00:20:17,110
Array.push afegeix un nou element
al final d'una matriu.

399
00:20:17,110 --> 00:20:20,910
Array.shift és una espècie de
com DQ, s'empalma a terme

400
00:20:20,910 --> 00:20:23,610
el primer element d'una matriu.

401
00:20:23,610 --> 00:20:27,549
>> Però hi ha també un altre especial
mètode d'un array anomenat mapa.

402
00:20:27,549 --> 00:20:29,340
I això és una espècie de
concepte interessant.

403
00:20:29,340 --> 00:20:30,930
Llavors, ¿quina és la idea d'un mapa?

404
00:20:30,930 --> 00:20:33,880
Segur que va a veure això
en diversos altres idiomes,

405
00:20:33,880 --> 00:20:38,550
i no estem parlant d'un
tipus de cartògrafs mapa aquí,

406
00:20:38,550 --> 00:20:41,480
estem parlant d'una funció de mapeig.

407
00:20:41,480 --> 00:20:44,110
En el context que estem
parlant aquí, un mapa

408
00:20:44,110 --> 00:20:47,950
és una operació especial que
pot dur a terme en una sèrie

409
00:20:47,950 --> 00:20:51,630
per aplicar una funció particular
a cada element de la matriu.

410
00:20:51,630 --> 00:20:55,190
i així diríem en
aquest cas, potser array.map,

411
00:20:55,190 --> 00:21:00,330
i dins d'ella, estem passant
en mapa és una funció que volem

412
00:21:00,330 --> 00:21:02,430
per a ser aplicat a cada element.

413
00:21:02,430 --> 00:21:07,299
Així que és una espècie d'anàleg a usar
un bucle per iterar sobre cada element

414
00:21:07,299 --> 00:21:09,340
i aplicar una determinada
funcionar a cada element,

415
00:21:09,340 --> 00:21:14,830
simplement Javascript està construïda en
noció d'un mapatge que es pot aplicar.

416
00:21:14,830 --> 00:21:19,700
I aquest és un gran context per
parlar d'una funció anònima.

417
00:21:19,700 --> 00:21:22,370
>> Així que anem a dir que tenim
aquesta matriu d'enters.

418
00:21:22,370 --> 00:21:25,370
Es diu nums, i que té cinc anys
coses en ell, un, dos, tres, quatre,

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

420
00:21:26,410 --> 00:21:30,620
Ara vull traçar alguns
funció a aquesta matriu.

421
00:21:30,620 --> 00:21:34,337
Vull tenir aplica una funció
a cada element de la matriu.

422
00:21:34,337 --> 00:21:37,420
Bé, diguem que el que vull
fer és doblar tots els elements.

423
00:21:37,420 --> 00:21:42,520
El que podria fer és utilitzar un bucle
per var I és igual a 0, I és menor que

424
00:21:42,520 --> 00:21:47,390
o igual a 4, I més, més, i
després doblegar cada número individual.

425
00:21:47,390 --> 00:21:49,580
Però també puc fer alguna cosa com això.

426
00:21:49,580 --> 00:21:53,420
Puc dir nums era abans
un dos tres quatre cinc,

427
00:21:53,420 --> 00:21:58,310
ara, però, m'agradaria que t'agradaria
aplicar un mapatge en aquesta matriu

428
00:21:58,310 --> 00:22:00,400
on m'agradaria que
duplicar cada número.

429
00:22:00,400 --> 00:22:02,540
I això és exactament
¿Què està passant aquí.

430
00:22:02,540 --> 00:22:06,870
Però noto que estic passant
en com argument al mapa.

431
00:22:06,870 --> 00:22:09,080
Aquesta és una funció anònima.

432
00:22:09,080 --> 00:22:11,140
I noto que no he donat
aquesta funció un nom,

433
00:22:11,140 --> 00:22:13,290
Jo només he donat una llista de paràmetres.

434
00:22:13,290 --> 00:22:16,370
I pel que aquest és un exemple
d'una funció anònima.

435
00:22:16,370 --> 00:22:21,270
>> En general, no cridaria a això
funció fora del context del mapa.

436
00:22:21,270 --> 00:22:24,110
Estem definint-lo com un paràmetre
per cartografiar, pel que en realitat no

437
00:22:24,110 --> 00:22:27,910
necessita tenir un nom per a ell si el
L'única cosa que li importa és el mapa

438
00:22:27,910 --> 00:22:30,339
i es va definir la dreta
existeix dins del mapa.

439
00:22:30,339 --> 00:22:31,880
I el que aquesta és una funció anònima.

440
00:22:31,880 --> 00:22:34,680
No hem pogut
per fer això abans.

441
00:22:34,680 --> 00:22:38,400
Ubicació alguna funció que
accepta un paràmetre, num,

442
00:22:38,400 --> 00:22:41,890
i el que fa que la funció
es torna num 2 cops.

443
00:22:41,890 --> 00:22:45,330
I així, després d'aquesta
mapatge s'ha aplicat,

444
00:22:45,330 --> 00:22:50,090
això és ara el que sembla nums
com, dos, quatre, sis, vuit, 10.

445
00:22:50,090 --> 00:22:52,090
I anem a pop al meu
finestra del navegador i just

446
00:22:52,090 --> 00:22:55,240
fer una ullada a aquest
molt ràpid també.

447
00:22:55,240 --> 00:22:58,000
>> Així que tinc un altre botó aquí
a la meva pàgina d'inici anomenada doble.

448
00:22:58,000 --> 00:23:03,570
I quan faig clic doble, i es diu
jo abans era un, dos, tres, quatre,

449
00:23:03,570 --> 00:23:07,250
cinc després de dos, quatre, sis, vuit, 10.

450
00:23:07,250 --> 00:23:11,930
I si torno i feu clic doble
de nou, dos, quatre, sis, vuit, 10.

451
00:23:11,930 --> 00:23:17,400
I després, després, quatre,
08:00, 12, 16, 20 i, a continuació.

452
00:23:17,400 --> 00:23:20,440
I el que estic fent en aquesta funció?

453
00:23:20,440 --> 00:23:25,210
Bé, si només pop a IDE i
Jo aixeco la meva funció anònima, aquí

454
00:23:25,210 --> 00:23:28,780
en la línia del 7 al 13, jo sóc
fent una obra de fantasia poc aquí,

455
00:23:28,780 --> 00:23:32,240
però jo només estic imprimint
el que hi ha actualment a la matriu.

456
00:23:32,240 --> 00:23:36,580
Després en la línia 16, 17,
i 18, aquí està el meu mapa.

457
00:23:36,580 --> 00:23:40,930
Aquí és on estic aplicant aquesta duplicació
funció per a cada element.

458
00:23:40,930 --> 00:23:43,530
I després una mica més avall,
Només estic fent el mateix

459
00:23:43,530 --> 00:23:46,640
Que estava fent abans, excepte que ara estic
imprimir el contingut de la matriu

460
00:23:46,640 --> 00:23:48,167
després.

461
00:23:48,167 --> 00:23:50,500
Però tot el que he fet aquí és
només ha d'utilitzar una funció anònima

462
00:23:50,500 --> 00:23:53,640
per mapear a través de tota una matriu.

463
00:23:53,640 --> 00:23:58,466
>> Així que una més gran tema per parlar en
Javascript és la noció d'un esdeveniment.

464
00:23:58,466 --> 00:24:01,590
Un esdeveniment és una cosa que simplement succeeix
quan un usuari interactua amb la seva web

465
00:24:01,590 --> 00:24:04,715
pàgina, així que potser feu clic en alguna cosa,
o potser la pàgina hagi acabat de carregar-se,

466
00:24:04,715 --> 00:24:07,200
o potser s'han mogut
el ratolí sobre alguna cosa,

467
00:24:07,200 --> 00:24:09,290
o que hagi escrit alguna cosa
en un camp d'entrada.

468
00:24:09,290 --> 00:24:14,260
Totes aquestes coses són esdeveniments
que s'estan produint a la nostra pàgina web.

469
00:24:14,260 --> 00:24:17,460
I JavaScript té la
capacitat de suportar alguna cosa

470
00:24:17,460 --> 00:24:21,760
anomenat un controlador d'esdeveniments, que
és una funció de devolució de trucada que

471
00:24:21,760 --> 00:24:23,329
respon a un esdeveniment html.

472
00:24:23,329 --> 00:24:24,620
I el que és una funció de devolució de trucada?

473
00:24:24,620 --> 00:24:27,328
Bé, en general és més que un altre
nom per a una funció anònima.

474
00:24:27,328 --> 00:24:30,170
És una funció que
respon a un esdeveniment.

475
00:24:30,170 --> 00:24:34,130
I aquí és on arribem a la
idea de la unió de certes funcions

476
00:24:34,130 --> 00:24:38,060
a un atribut html en particular.

477
00:24:38,060 --> 00:24:41,420
La majoria dels elements HTML tenen
suport a un atribut

478
00:24:41,420 --> 00:24:45,170
que no ens parlem al html
vídeo per a alguna cosa com el clic

479
00:24:45,170 --> 00:24:50,540
o en vol estacionari o en la càrrega,
tots aquests esdeveniments

480
00:24:50,540 --> 00:24:53,120
que a continuació, pot escriure funcions
que tenen a veure amb aquests esdeveniments

481
00:24:53,120 --> 00:24:56,090
quan aquests esdeveniments
produir a la teva pàgina web.

482
00:24:56,090 --> 00:24:59,170
>> I el que potser el seu html
es veu alguna cosa com això.

483
00:24:59,170 --> 00:25:02,240
I tinc dos botons d'aquí,
un botó i el botó de dos,

484
00:25:02,240 --> 00:25:04,620
i aquí tinc actualment
res definit,

485
00:25:04,620 --> 00:25:11,170
però aquí és on l'atribut de
clic és aparentment part de la meva etiqueta html.

486
00:25:11,170 --> 00:25:15,220
Així que pel que sembla quan em defineixo el que és
passant dins d'aquest atribut,

487
00:25:15,220 --> 00:25:18,590
que serà una cosa de JavaScript
funció que respon a l'esdeveniment

488
00:25:18,590 --> 00:25:24,360
presumiblement de fer clic a
botó d'un sol botó o dos.

489
00:25:24,360 --> 00:25:28,580
>> Què és una mena de fresc sobre això és que
pot escriure un controlador d'esdeveniments genèric.

490
00:25:28,580 --> 00:25:32,370
I aquest controlador d'esdeveniments
crear un objecte d'esdeveniment.

491
00:25:32,370 --> 00:25:37,000
I l'objecte d'esdeveniment ens dirà
quin dels dos botons es fa clic.

492
00:25:37,000 --> 00:25:38,064
Ara, com funciona això?

493
00:25:38,064 --> 00:25:39,730
Bé, podria ser alguna cosa com això.

494
00:25:39,730 --> 00:25:44,860
Així que definirem en primer lloc els nostres botons
per tenir una resposta a la devolució de trucada

495
00:25:44,860 --> 00:25:47,470
funció que es diu
quan es fa clic al botó,

496
00:25:47,470 --> 00:25:49,520
anomenarem esdeveniment Nom d'alerta.

497
00:25:49,520 --> 00:25:53,320
I notar en els dos casos estem
passar en aquest paràmetre d'esdeveniment.

498
00:25:53,320 --> 00:25:55,460
Així que cridem a aquesta funció
o quan aquesta funció

499
00:25:55,460 --> 00:26:00,330
és provocada per l'esdeveniment succeeixi,
que crearà aquest objecte d'esdeveniment

500
00:26:00,330 --> 00:26:03,300
i passar-ho com
paràmetre per alertar nom.

501
00:26:03,300 --> 00:26:07,270
I això és objecte d'esdeveniment
va a contenir informació

502
00:26:07,270 --> 00:26:09,800
sobre el qual es va fer clic al botó.

503
00:26:09,800 --> 00:26:11,580
¿I com es fa això?

504
00:26:11,580 --> 00:26:13,654
Bé, podria ser alguna cosa com això.

505
00:26:13,654 --> 00:26:15,570
Així que ara en el meu separada
Arxiu JavaScript, podria

506
00:26:15,570 --> 00:26:17,420
de trobar aquest
Nom de la funció d'alerta, el que

507
00:26:17,420 --> 00:26:19,500
de nou accepta que paràmetre d'esdeveniment.

508
00:26:19,500 --> 00:26:24,640
I llavors aquí és on sóc detectant
quin botó s'activa,

509
00:26:24,640 --> 00:26:28,100
gallet var equival esdeveniment
element d'origen de punts.

510
00:26:28,100 --> 00:26:33,150
Quina va ser la font que va crear
aquest objecte d'esdeveniment que va ser aprovada en?

511
00:26:33,150 --> 00:26:36,390
Va ser el botó un o dos botons era ella?

512
00:26:36,390 --> 00:26:40,710
>> I llavors aquí tot el que estic fent és
imprimir trigger.innerhtml.

513
00:26:40,710 --> 00:26:43,860
Doncs bé, en aquest cas, en aquest
context, trigger.innerhtml

514
00:26:43,860 --> 00:26:45,940
és just el que està escrit en el botó.

515
00:26:45,940 --> 00:26:48,830
El que passa si saltem
esquena per un segon, que ho faria

516
00:26:48,830 --> 00:26:51,670
ser el que està en entre aquestes etiquetes de botons.

517
00:26:51,670 --> 00:26:54,150
Serà botó d'un o dos botons.

518
00:26:54,150 --> 00:26:57,320
I anem a fer una ullada a
com aquest controlador d'esdeveniments faria

519
00:26:57,320 --> 00:27:01,080
mirar si haguéssim de funcioni en la pràctica.

520
00:27:01,080 --> 00:27:03,850
>> Així, en primer lloc, que hi hagi
obertes events.js,

521
00:27:03,850 --> 00:27:06,517
que és l'arxiu JavaScript al
He definit aquesta funció.

522
00:27:06,517 --> 00:27:08,558
I com es pot veure, és
gairebé exactament el

523
00:27:08,558 --> 00:27:10,230
que acabem de veure en la diapositiva fa un segon.

524
00:27:10,230 --> 00:27:14,890
I vaig a anar a la
pàgina d'inici que hem estat utilitzant.

525
00:27:14,890 --> 00:27:17,660
I tinc aquí el botó
Un i dos botons.

526
00:27:17,660 --> 00:27:19,820
I vaig a fer clic en un botó.

527
00:27:19,820 --> 00:27:23,930
Va fer clic al botó d'un, si
pot veure aquí a l'alerta.

528
00:27:23,930 --> 00:27:25,810
D'ACORD.

529
00:27:25,810 --> 00:27:28,980
Feu clic al botó de dos,
fet clic en un botó de dos.

530
00:27:28,980 --> 00:27:32,150
>> Així que els dos botons tenen la
mateixa crida a la funció, no?

531
00:27:32,150 --> 00:27:35,840
Tots dos estaven nom d'alerta
esdeveniment, però aquest objecte d'esdeveniment

532
00:27:35,840 --> 00:27:41,900
que es crea quan fem clic a
que ens diu quin botó es va fer clic.

533
00:27:41,900 --> 00:27:44,650
Nosaltres no hem d'escriure dos per separat
funcions o fer front a tenir

534
00:27:44,650 --> 00:27:46,470
per passar qualsevol informació addicional.

535
00:27:46,470 --> 00:27:48,220
Estem confiant en
ho farà JavaScript

536
00:27:48,220 --> 00:27:53,772
fer per nosaltres, que és crear aquesta
tipus d'esdeveniment objecte en el nostre nom.

537
00:27:53,772 --> 00:27:56,730
Hi ha molt més per a JavaScript de
el que hem cobert en aquest vídeo,

538
00:27:56,730 --> 00:27:58,521
però tenir aquests
fonamental ha de aconseguir-

539
00:27:58,521 --> 00:28:00,690
un llarg camí força a
aprendre tot el que

540
00:28:00,690 --> 00:28:04,030
necessita saber sobre aquest
llenguatge interessant.

541
00:28:04,030 --> 00:28:05,000
Sóc Doug Lloyd.

542
00:28:05,000 --> 00:28:07,010
Això és CS50.

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