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

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

3
00:00:05,770 --> 00:00:08,690
>> DOUG LLOYD: Kaya sa ngayon hindi namin lumang
kalamangan sa web programming, di ba?

4
00:00:08,690 --> 00:00:12,140
At kami sakop ng ilang mga
mga wika sa mga indibidwal na video.

5
00:00:12,140 --> 00:00:14,690
At gawin ang isa pa, JavaScript ngayon hayaan.

6
00:00:14,690 --> 00:00:17,370
>> Una ang mabuting balita, JavaScript
ay isang modernong programming

7
00:00:17,370 --> 00:00:21,410
wika na halos tulad ng PHP na ang
syntax ay nagmula mula sa C,

8
00:00:21,410 --> 00:00:22,830
kaya na ang isang magandang lugar upang magsimula.

9
00:00:22,830 --> 00:00:25,880
Ito ay tungkol sa mga lumang bilang PHP, pati na rin,
pagiging sa paligid ng mga 20 taon.

10
00:00:25,880 --> 00:00:28,600
Ito ay imbento sa paligid
sa parehong oras na PHP.

11
00:00:28,600 --> 00:00:32,240
At JavaScript ay talagang pretty
pangunahing sa karanasan ng gumagamit

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

13
00:00:32,740 --> 00:00:34,448
Sa katunayan, may mga
tatlong mga wika na ako

14
00:00:34,448 --> 00:00:38,480
sasabihin uri ng bumubuo sa
karanasan ng gumagamit ng pakikipag-ugnay

15
00:00:38,480 --> 00:00:42,650
sa mga website, html,
css, at JavaScript.

16
00:00:42,650 --> 00:00:46,030
At makipag-usap ng isang kaya ngayon hayaan
nang kaunti tungkol sa JavaScript.

17
00:00:46,030 --> 00:00:50,301
>> Ang masamang balita, bagaman, na may JavaScript ay
na ito ay nagtatakda ng isang pulutong ng mga panuntunan para sa kanyang sarili,

18
00:00:50,301 --> 00:00:51,300
at pagkatapos ay ito break ang mga ito.

19
00:00:51,300 --> 00:00:54,010
At JavaScript ay maaari talagang maging
uri ng mahirap upang matuto,

20
00:00:54,010 --> 00:00:57,000
dahil sa ito ay hindi katulad ng C at
PHP, na kung saan ay tunay na nakabalangkas

21
00:00:57,000 --> 00:01:00,270
at may tunay matibay patakaran
para sa kung paano gumagana ang mga bagay.

22
00:01:00,270 --> 00:01:03,690
JavaScript ay may uri
ng tapat na paraan upang flexible

23
00:01:03,690 --> 00:01:06,650
na siguro ang mga bagay ay hindi pagpunta sa
gumagana ang paraan na inaasahan namin sa kanila na,

24
00:01:06,650 --> 00:01:09,830
at marahil hindi talaga namin maaaring malaman
ang aming unang wika programming

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

26
00:01:10,769 --> 00:01:12,810
Kaya marahil dahil ito ay hindi
set mismo anumang mga patakaran,

27
00:01:12,810 --> 00:01:15,754
at ito ay hindi tunay
ipatupad ang magandang coding gawi.

28
00:01:15,754 --> 00:01:18,170
Ngunit ngayon na sana ay nakabuo ng
ang ilang mga magandang coding gawi,

29
00:01:18,170 --> 00:01:21,470
at upang maaari naming simulan na pandarambong
sa JavaScript nang kaunti.

30
00:01:21,470 --> 00:01:25,750
>> Upang magsulat ng JavaScript, na katulad ng pagbubukas
up ng isang C file sa isang tuldok C extension

31
00:01:25,750 --> 00:01:29,770
o isang PHP file na may extension ng dot PHP,
ang lahat ng kailangan naming gawin ay buksan ang isang file

32
00:01:29,770 --> 00:01:31,764
may extension file ang tuldok js.

33
00:01:31,764 --> 00:01:34,430
Hindi natin kailangan na magkaroon ng anumang mga espesyal na
delimiters tulad ng ginawa namin sa PHP.

34
00:01:34,430 --> 00:01:36,750
Na uri ng anggulo
bracket tandang pananong PHP

35
00:01:36,750 --> 00:01:40,300
na kami ay ginagamit upang sa na, ang mga paraan
sabihin natin ang ating mga browser na kung ano ang mayroon tayo ay

36
00:01:40,300 --> 00:01:43,502
Ang JavaScript ay sa pamamagitan ng kasama
ito sa isang html tag,

37
00:01:43,502 --> 00:01:46,210
at kami na makita nang kaunti tungkol sa
kung paano gawin na sa ilang saglit lamang.

38
00:01:46,210 --> 00:01:48,210
>> Ang iba pang mga bagay na gumagawa ng
JavaScript naiiba,

39
00:01:48,210 --> 00:01:50,580
bagaman, ay na ito ay nagpapatakbo ng client side.

40
00:01:50,580 --> 00:01:53,430
Kaya isipin na may PHP na
maaaring hindi namin talaga makita

41
00:01:53,430 --> 00:01:57,041
ang PHP na nakasalungguhit isang website.

42
00:01:57,041 --> 00:01:59,040
Kung namin kailanman tiningnan ang
pinagmulang pahina, gagawin lamang namin

43
00:01:59,040 --> 00:02:02,830
makita ang mga html na
na nabuo sa pamamagitan ng na PHP.

44
00:02:02,830 --> 00:02:04,900
Ngunit JavaScript tumatakbo client side.

45
00:02:04,900 --> 00:02:06,710
Ang iyong JavaScript ay tumatakbo sa iyong computer.

46
00:02:06,710 --> 00:02:09,050
At iyon ang dahilan kung bakit maaari mong gawin
mga bagay na gusto magdagdag ng blockers.

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

48
00:02:09,550 --> 00:02:12,704
Blocking Ad ay karaniwang ginagawa sa pamamagitan ng
pagpatay ng lahat ng JavaScript

49
00:02:12,704 --> 00:02:14,370
na tumatakbo sa isang partikular na website.

50
00:02:14,370 --> 00:02:19,000
At dahil ito ay kailangang
tumakbo sa iyong tabi machine client,

51
00:02:19,000 --> 00:02:21,910
Maaari mo lamang ihinto ang
JavaScript para sa pagpapatakbo ng lahat.

52
00:02:21,910 --> 00:02:27,030
Ito ay nangangahulugan din na kapag ikaw ay gumagamit ng
isang website na kasama JavaScript,

53
00:02:27,030 --> 00:02:32,450
kailangan mong ipadala ang pinagmulan JavaScript
code bilang bahagi ng iyong tugon http

54
00:02:32,450 --> 00:02:34,159
sa client kapag sila ay humiling ito.

55
00:02:34,159 --> 00:02:35,950
At kaya hindi mo maaaring
nais na gumamit ng JavaScript

56
00:02:35,950 --> 00:02:38,395
na gawin talagang sensitive bagay
tulad ng pagpapasa ng impormasyon

57
00:02:38,395 --> 00:02:41,020
tungkol sa likod ng mga password ng gumagamit at
pa, dahil ang mga ito ang tunay na

58
00:02:41,020 --> 00:02:45,610
pagpunta upang makatanggap ng lahat ng mga source code,
hindi lamang ang mga html na nabuo,

59
00:02:45,610 --> 00:02:49,030
tulad ay ang kaso sa mga sinasabi PHP.

60
00:02:49,030 --> 00:02:51,620
>> Kaya paano namin isama JavaScript
sa aming html na magsimula sa?

61
00:02:51,620 --> 00:02:54,520
Well, katulad ng CSS, talaga,
ay uri ng kung paano namin ito dito.

62
00:02:54,520 --> 00:02:56,190
Sa CSS kami estilo ng mga tag.

63
00:02:56,190 --> 00:03:00,760
At sa loob ng mga estilo ng mga tag,
maaari naming tukuyin ang CSS style sheet.

64
00:03:00,760 --> 00:03:03,450
Katulad nito sa JavaScript
maaaring buksan up namin script tag,

65
00:03:03,450 --> 00:03:06,660
isa pang html na tag kami ay hindi
makipag-usap tungkol sa aming mga html video,

66
00:03:06,660 --> 00:03:09,720
at isulat ang JavaScript sa
sa pagitan ng mga script tag.

67
00:03:09,720 --> 00:03:13,960
Bagaman Gayundin, tulad ng CSS, namin
maaaring mag-link sa labas CSS file

68
00:03:13,960 --> 00:03:15,900
at hilahin ang mga ito sa aming programa na paraan.

69
00:03:15,900 --> 00:03:18,280
Sa CSS maaari din namin,
patawarin ninyo ako, sa JavaScript

70
00:03:18,280 --> 00:03:23,240
maaari rin naming tukuyin ang pinagmulan
katangian ng tag script

71
00:03:23,240 --> 00:03:25,720
mag-link sa JavaScript
hiwalay, kaya hindi mo

72
00:03:25,720 --> 00:03:27,680
kung isulat ito sa
pagitan ng mga script tag, kami

73
00:03:27,680 --> 00:03:29,600
Maaaring i-link ang mga ito sa paggamit ng
na script tag pati na rin.

74
00:03:29,600 --> 00:03:33,230
At tulad sa mga kaso na may CSS kung saan
inirerekomenda namin na ito ay marahil

75
00:03:33,230 --> 00:03:36,090
sa iyong pinakamahusay na interes na magsulat
iyong CSS sa isang hiwalay na file sa kaso

76
00:03:36,090 --> 00:03:38,500
kailangan mong palitan ang mga ito,
katulad ng ginagawa namin pinapayo

77
00:03:38,500 --> 00:03:40,720
na isulat ang iyong
Ang JavaScript sa hiwalay na mga file

78
00:03:40,720 --> 00:03:45,460
at gamitin ang source script tag
attribute upang itali ang iyong JavaScript

79
00:03:45,460 --> 00:03:49,520
sa iyong html, ang iyong mga web page.

80
00:03:49,520 --> 00:03:52,610
>> Variable So JavaScript, bibigyan namin ng
magsimula ng pakikipag-usap tungkol sa syntax dito.

81
00:03:52,610 --> 00:03:53,600
At kami ay pumunta sa pamamagitan ng
ang ganitong uri ng mabilis,

82
00:03:53,600 --> 00:03:56,640
dahil tapos na namin ito sa PHP, kaya
ito ay dapat na medyo pamilyar sa lahat.

83
00:03:56,640 --> 00:03:59,490
Kaya variable sa JavaScript ay
halos katulad sa PHP variable.

84
00:03:59,490 --> 00:04:03,270
Walang type specifier, at
kapag ipakilala mo ang isang variable,

85
00:04:03,270 --> 00:04:05,070
prefix mo ito gamit ang var keyword.

86
00:04:05,070 --> 00:04:07,750
Sa PHP nais naming gawin ang isang bagay
tulad nito, dollar sign x.

87
00:04:07,750 --> 00:04:09,950
Iyon ay kung paano namin na ipinahiwatig
isang variable, ngunit hindi, kami ay

88
00:04:09,950 --> 00:04:12,060
hindi banggitin ang uri
mga variable sa lahat.

89
00:04:12,060 --> 00:04:15,124
Gusto naming sabihin isang bagay tulad ng
sign x dollar ay katumbas ng 44 sa PHP.

90
00:04:15,124 --> 00:04:17,040
Kung kami ay ginagawa ang
parehong bagay sa JavaScript,

91
00:04:17,040 --> 00:04:19,589
gusto naming sabihin var x ay katumbas ng 44.

92
00:04:19,589 --> 00:04:22,780
Kaya var ay uri ng aming mga paraan
ng pagpapasok ng isang variable.

93
00:04:22,780 --> 00:04:26,850
Iyan ay marahil ng isang bit mas madaling maunawaan
pa sa dollar sign variable.

94
00:04:26,850 --> 00:04:29,080
>> Muli, dahil walang
mga uri ng data, maaari naming gawin ito

95
00:04:29,080 --> 00:04:34,490
sa anumang uri ng data, string,
kahit ano pa ang magiging var lahat.

96
00:04:34,490 --> 00:04:37,260
Conditionals, ang lahat ng aming mga
lumang mga kaibigan mula sa C at PHP

97
00:04:37,260 --> 00:04:41,640
ay magagamit pa rin, kaya kami ay kung,
iba kung, iba pa, lumipat at katanungan

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

99
00:04:42,240 --> 00:04:45,890
Lumipat natitirang bilang nababaluktot na ito
ay sa PHP, ngunit ang lahat ng mga ito ikaw ay

100
00:04:45,890 --> 00:04:46,930
pamilyar sa pamamagitan ng ngayon.

101
00:04:46,930 --> 00:04:49,900
At katulad sa loop ay
ang mga lumang mga paborito ng mga habang,

102
00:04:49,900 --> 00:04:52,700
gawin habang, at para pa rin magagamit sa amin.

103
00:04:52,700 --> 00:04:55,880
Kaya namin na malaman ng isang pulutong ng mga
basic JavaScript uri ng batayan

104
00:04:55,880 --> 00:05:01,800
lamang sa pamamagitan ng kabutihan ng pagkakaroon ng isang lubos na piraso
ng kaalaman ngayon ay tungkol sa C at PHP.

105
00:05:01,800 --> 00:05:03,670
>> Ano ang tungkol sa mga pag-andar sa JavaScript?

106
00:05:03,670 --> 00:05:08,199
Well, katulad sa PHP bawat function ay
ipinakilala sa mga function na keyword.

107
00:05:08,199 --> 00:05:10,740
Sabihin mo function, at pagkatapos ay sa iyo
simulan upang tukuyin ang iyong function.

108
00:05:10,740 --> 00:05:12,531
Ano ang isang maliit na naiiba
tungkol JavaScript,

109
00:05:12,531 --> 00:05:15,700
bagaman ay ang kakayahan upang magkaroon ng
ano ang tinatawag na isang hindi nakikilalang function.

110
00:05:15,700 --> 00:05:18,880
Kaya maaari mong tukuyin ang mga function
na hindi magkaroon ng isang pangalan.

111
00:05:18,880 --> 00:05:21,222
Ito ang isang bagay na namin
talagang hindi nakita bago.

112
00:05:21,222 --> 00:05:23,430
Ipapakita namin talagang gamitin ang mga konsepto
ng isang hindi nakikilalang function

113
00:05:23,430 --> 00:05:27,880
isang maliit na mamaya sa
video, dahil makikita ito

114
00:05:27,880 --> 00:05:31,530
gumawa ng kaunti pa ng kahulugan sa konteksto
kapag nakita namin ang mga ito sa isang partikular na sitwasyon

115
00:05:31,530 --> 00:05:33,120
na na-crafted ko dito.

116
00:05:33,120 --> 00:05:35,710
Ngunit ipaalam sa tumagal lamang ng isang pagtingin
sa kung ano ang isang simpleng JavaScript

117
00:05:35,710 --> 00:05:37,850
maaaring magmukhang function.

118
00:05:37,850 --> 00:05:40,610
>> Kaya ko na wala na magpatuloy at
binuksan ang aking CS50 IDE

119
00:05:40,610 --> 00:05:43,690
at na ako na tumakbo ako Apache
upang magsimulang tumakbo ang aking mga server.

120
00:05:43,690 --> 00:05:46,800
At ako ay may file na ito
buksan tinatawag home.html.

121
00:05:46,800 --> 00:05:48,330
At kukunin ko na mag-zoom in ng kaunti dito.

122
00:05:48,330 --> 00:05:52,090
At isa lamang, maaari mong makita ang
Home.html ay lamang ng isang grupo ng mga buttons.

123
00:05:52,090 --> 00:05:55,291
At ako na nagke-claim sa tuktok dito
na ito ay ang seksyon JavaScript

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

125
00:05:55,790 --> 00:05:59,490
Kaya mayroong isang grupo ng mga buttons dito,
ngunit ano ang mga button na ito talagang gawin?

126
00:05:59,490 --> 00:06:03,662
>> Well, kami ay tumuloy sa aking IED,
at home.html ko pa buksan dito.

127
00:06:03,662 --> 00:06:05,620
Sa simula pa lamang,
narito ang kung saan ako ng pag-uugnay

128
00:06:05,620 --> 00:06:07,500
sa lahat ng aking mga file source JavaScript.

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

130
00:06:08,000 --> 00:06:12,440
Kaya ko anonymous.js, clock.js,
Gumagamit ako ng source attribute

131
00:06:12,440 --> 00:06:14,440
ng tag script na mag-link sa file.

132
00:06:14,440 --> 00:06:18,660
Kaya hindi ako nakasulat ng anumang
JavaScript direkta sa file na ito,

133
00:06:18,660 --> 00:06:21,790
ngunit ko na nakuha ko sa lahat ng
JavaScript ko na nakasulat sa hiwalay.

134
00:06:21,790 --> 00:06:24,540
At kung mag-scroll namin down dito, ito
dapat tumingin lahat medyo pamilyar

135
00:06:24,540 --> 00:06:27,090
na may isang maliit na piraso ng bagong syntax.

136
00:06:27,090 --> 00:06:32,655
Mayroon kaming dito header tag para sa
function at pagkatapos ay isang button.

137
00:06:32,655 --> 00:06:35,530
Mayroon akong isang input na ang isang button type,
at tila kapag nag-click ako sa mga ito,

138
00:06:35,530 --> 00:06:38,130
Pupunta ako sa tawagan ang ilang
gumana date alert.

139
00:06:38,130 --> 00:06:41,792
At ito ay kung paano namin ang uri ng mga halu-up
isang maliit na piraso ng JavaScript at html.

140
00:06:41,792 --> 00:06:44,500
Sila ay aktwal na i-play pretty mabuti
sama-sama, at iba tila kapag

141
00:06:44,500 --> 00:06:48,730
Ako mag-click sa button na ito, pupuntahan ko
upang tawagan ang ilang mga petsa sa pag-andar ng alerto.

142
00:06:48,730 --> 00:06:53,660
At katulad na may nakatakda na akong pag-uugali
para sa lahat ng iba pang mga pindutan na

143
00:06:53,660 --> 00:06:56,440
nasa na ang pahina na home.html,
na kung saan kami ay patuloy na bumabalik

144
00:06:56,440 --> 00:06:59,172
sa panahon ng kurso ng video na ito.

145
00:06:59,172 --> 00:07:00,880
Subalit bumalik up hayaan
dito at tingnan

146
00:07:00,880 --> 00:07:03,850
sa clock.js, na kung saan ay ang
JavaScript file na ako

147
00:07:03,850 --> 00:07:07,370
sinulat na ito ay may unang function
kami ay pagpunta sa tumagal ng isang pagtingin sa.

148
00:07:07,370 --> 00:07:11,630
Tulad ng iyong nakikita, magsisimula ang aking JavaScript
gumana gamit ang function na keyword,

149
00:07:11,630 --> 00:07:14,560
at ibinigay ko na ang isang ito ng
pangalan, ito ay tinatawag na petsa ng alerto.

150
00:07:14,560 --> 00:07:18,710
Sa loob ng doon, tila ba akong lumikha ng isang
mga bagong lokal na variable na tinatawag na kasalukuyang petsa.

151
00:07:18,710 --> 00:07:21,500
At ako pagpunta sa italaga
isang pantay sa isang bagong petsa.

152
00:07:21,500 --> 00:07:24,430
At kami ay maaaring makakuha ng sa isang pulutong ng mga
detalye sa kung ano ang isang petsa ay,

153
00:07:24,430 --> 00:07:27,060
at talagang JavaScript ay kaya
malaki na hindi namin maaaring posibleng

154
00:07:27,060 --> 00:07:28,330
masakop ang lahat sa isang video.

155
00:07:28,330 --> 00:07:32,220
Ngunit magkasiya ito upang sabihin, ito ay pagpunta
upang bumalik sa akin ng isang item ng data na

156
00:07:32,220 --> 00:07:35,470
pinapalooban ang kasalukuyang petsa at oras.

157
00:07:35,470 --> 00:07:39,100
Ako sa pag-iimbak na sa isang variable na ako
tila pagpunta upang alertuhan kasalukuyang petsa.

158
00:07:39,100 --> 00:07:41,300
>> Well, kung ano ang ginagawa ng alerto
kasalukuyang hitsura ng petsa tulad ng?

159
00:07:41,300 --> 00:07:46,460
Tingnan natin ang isang hitsura at ang mismong file
i-back sa ibabaw sa window ng browser.

160
00:07:46,460 --> 00:07:49,551
Kaya muli, ito ay ang button na ako
may nakatali na, ito pinangalanan function.

161
00:07:49,551 --> 00:07:51,800
At i-click ko ito doon at
tingnan kung ano ang ginawa ito, humanda ito.

162
00:07:51,800 --> 00:07:56,140
Ito pop up na ito uri ng box na nagsasabi
sa akin na ang mga kasalukuyang time ay, tila

163
00:07:56,140 --> 00:07:59,370
ito ay Nobyembre 4 sa
10:43:43 sa umaga.

164
00:07:59,370 --> 00:08:02,345
At kung ako mag-click itong muli, ngayon
ito ay isang ilang segundo mamaya, di ba?

165
00:08:02,345 --> 00:08:03,720
Kaya na ang lahat ng mga function na ito ay.

166
00:08:03,720 --> 00:08:07,670
Kapag nag-click ako sa button na ito, ito
nagpa-pop up ang isang mensahe ng alerto sa akin.

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

168
00:08:13,806 --> 00:08:15,690
Kaya mayroong talagang hindi
masyadong marami sa mga pag-andar

169
00:08:15,690 --> 00:08:19,110
na naiiba mula sa PHP,
lamang ng isang maliit na piraso ng bagong syntax

170
00:08:19,110 --> 00:08:22,500
na nanggagaling sa mga nagtatrabaho sa JavaScript.

171
00:08:22,500 --> 00:08:24,650
>> Ang mga array sa JavaScript ay
medyo direkta.

172
00:08:24,650 --> 00:08:27,200
Upang maipahayag ang isang array, gamitin mo
ang mga square bracket syntax

173
00:08:27,200 --> 00:08:30,090
na hindi namin pamilyar sa mula sa PHP.

174
00:08:30,090 --> 00:08:33,432
At katulad sa PHP, namin
Maaari ring ihalo uri ng data.

175
00:08:33,432 --> 00:08:35,140
Kaya ito array, parehong
ng mga array ng gagawin

176
00:08:35,140 --> 00:08:36,960
maging ganap na ganap lehitimong JavaScript.

177
00:08:36,960 --> 00:08:42,500
Isa na ang lahat integer, at isa na
ay halo-halong up ng iba't ibang mga uri ng data.

178
00:08:42,500 --> 00:08:45,020
>> Ano ang isang bagay na ibang
sa JavaScript, bagaman?

179
00:08:45,020 --> 00:08:47,020
Iyon ang mga kuru-kuro ng isang bagay.

180
00:08:47,020 --> 00:08:50,240
Kaya marahil mo na narinig ng
object oriented programming.

181
00:08:50,240 --> 00:08:53,370
Hindi namin gawin ng maraming mga ito sa CS50,
ngunit gagawin namin ang isang maliit na piraso ng ito

182
00:08:53,370 --> 00:08:55,670
dito sa konteksto ng JavaScript.

183
00:08:55,670 --> 00:08:59,100
Ngayon JavaScript ay may kakayahan na
kumilos bilang isang bagay na nakatuon sa programming

184
00:08:59,100 --> 00:09:02,615
wika, ngunit ito ay hindi mismo
eksklusibo isang object oriented

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

186
00:09:03,490 --> 00:09:05,281
At ito ay dumating muli
bumalik sa kung bakit sinabi ko, ito

187
00:09:05,281 --> 00:09:10,610
maaaring maging lubhang mahirap upang malaman
JavaScript bilang iyong unang programming

188
00:09:10,610 --> 00:09:13,890
wika, dahil ito ay hindi
talagang magkasya sa isang partikular tularan.

189
00:09:13,890 --> 00:09:16,430
>> C Sa kabilang banda ay isang
functional programming language.

190
00:09:16,430 --> 00:09:22,270
Kung gusto naming, function ay
uri ng malaking boss na tao, di ba?

191
00:09:22,270 --> 00:09:24,410
Magdikta nila kung ano ang
mangyayari lahat ng iba pa.

192
00:09:24,410 --> 00:09:26,600
Gusto naming baguhin variable,
ang tawag namin sa mga pag-andar.

193
00:09:26,600 --> 00:09:28,220
Ginagawa namin ang mga bagay na pag-andar.

194
00:09:28,220 --> 00:09:31,250
Objects sa halip, sa isang
object oriented wika,

195
00:09:31,250 --> 00:09:35,937
mga object ng uri ng maging ang mga bituin at
function na maging uri ng pangalawang.

196
00:09:35,937 --> 00:09:38,270
Ngunit kung ano ang isang bagay, kung ano ang
ay ang paniwala na ito ng isang bagay?

197
00:09:38,270 --> 00:09:40,880
Well, kung ito ay tumutulong, sa tingin
tungkol ito sa unang uri

198
00:09:40,880 --> 00:09:44,540
ng tulad ng isang C istraktura o isang struct
na aming natutunan tungkol sa bago.

199
00:09:44,540 --> 00:09:47,430
Sa C, ang isang istraktura ay naglalaman ng
ng isang bilang ng mga patlang,

200
00:09:47,430 --> 00:09:51,174
at marahil na namin ngayon ay maaaring magsimula sa
tumawag sa mga ari-arian na mga patlang.

201
00:09:51,174 --> 00:09:53,590
Ngunit ang ari-arian ay hindi kailanman talagang
tumayo sa kanilang mga sarili, right?

202
00:09:53,590 --> 00:09:56,410
Kung ako tukuyin ang isang istraktura para sa isang kotse
tulad nito na may mga sumusunod na dalawang

203
00:09:56,410 --> 00:10:00,750
parang, o ari-arian, ang isa sa isang
integer para sa mga taon ng kotse

204
00:10:00,750 --> 00:10:04,290
at isa pa sa isang 10 na karakter
string para sa mga modelo ng kotse,

205
00:10:04,290 --> 00:10:07,150
Maaari ko bang sabihin ng isang bagay na tulad nito,
Maaari ko bang magpahayag ng isang bagong variable

206
00:10:07,150 --> 00:10:10,080
ng uri herbie struct kotse.

207
00:10:10,080 --> 00:10:13,730
At pagkatapos ay maaari kong sabihin ng isang bagay
tulad herbie.year katumbas 1963,

208
00:10:13,730 --> 00:10:15,850
at herbie.model katumbas salaginto.

209
00:10:15,850 --> 00:10:17,000
Iyon ang OK.

210
00:10:17,000 --> 00:10:19,680
Gumagamit ako ng mga patlang sa
konteksto ng istraktura,

211
00:10:19,680 --> 00:10:22,290
ngunit maaari ko lamang ay hindi kailanman
sabihin ng isang bagay tulad nito.

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

213
00:10:22,790 --> 00:10:26,836
Hindi ko magamit ang mga pangalan ng patlang
independiyenteng ng istraktura.

214
00:10:26,836 --> 00:10:28,210
Ito ay uri ng isang pangunahing bagay.

215
00:10:28,210 --> 00:10:32,990
>> Kaya patlang na
pangunahing sa C istruktura

216
00:10:32,990 --> 00:10:39,050
ay katulad ng sa mga katangian ng pagiging
pundamental na mga bagay JavaScript.

217
00:10:39,050 --> 00:10:42,080
Ngunit kung ano ang gumagawa ng mga ito
partikular na interesante

218
00:10:42,080 --> 00:10:46,230
ay na bagay ay maaari ding magkaroon ng kung ano
ito ay tinatawag na mga pamamaraan, na kung saan ay tunay na

219
00:10:46,230 --> 00:10:50,730
lamang ng isang magarbong salita para sa mga pag-andar na
likas sa mga object rin.

220
00:10:50,730 --> 00:10:55,340
Kaya ito ay isang function na ay maaari lamang maging
tinatawag na sa konteksto ng isang bagay.

221
00:10:55,340 --> 00:10:59,200
Isang bagay lamang na may tinukoy
mga function na ito sa loob ng kanyang,

222
00:10:59,200 --> 00:11:02,020
kung sa tingin mo tungkol sa isang
struct, ang function

223
00:11:02,020 --> 00:11:05,720
ay tinukoy sa loob ng mga pagtukoy
curly braces ng istraktura.

224
00:11:05,720 --> 00:11:07,980
Kaya ito ay nangangahulugan lamang ng isang bagay
sa istraktura.

225
00:11:07,980 --> 00:11:10,960
At na uri ng kung ano ang aming ginagawa
dito may mga bagay at pamamaraan.

226
00:11:10,960 --> 00:11:13,580
Ito ay isa lamang tulad ng hindi namin
pagtukoy ng isang function na

227
00:11:13,580 --> 00:11:16,670
lamang ang akma sa isang
partikular na bagay, at sa gayon kami ay

228
00:11:16,670 --> 00:11:19,440
tumawag na isang paraan ng object.

229
00:11:19,440 --> 00:11:23,180
At hindi namin maaaring tumawag na
function na independiyenteng ng mga bagay,

230
00:11:23,180 --> 00:11:29,260
tulad ng hindi namin maaaring sabihin na taon o modelo
independiyenteng ng struct sa C.

231
00:11:29,260 --> 00:11:32,300
>> Kaya functional programming
Tumingin paradigms bagay tulad nito.

232
00:11:32,300 --> 00:11:35,450
Function at pagkatapos ay kapag kayo na ipasa ang
sa bagay bilang isang parameter.

233
00:11:35,450 --> 00:11:38,650
Sa isang bagay na nakatuon sa programming
wika, ang ganitong uri ng makakakuha

234
00:11:38,650 --> 00:11:43,464
Binaligtad, at gusto naming isipin ang tungkol sa
ito tulad ng ito, object.function.

235
00:11:43,464 --> 00:11:45,380
Kaya ito uri ng na tuldok
operator muli nagpapahiwatig

236
00:11:45,380 --> 00:11:49,540
na ito ay ilang uri ng mga ari-arian
o katangian ng bagay mismo.

237
00:11:49,540 --> 00:11:53,240
Ngunit ito ay kung ano ang isang bagay
oriented programming language

238
00:11:53,240 --> 00:11:57,150
maaaring gawin upang gawin ang isang function
tumawag sa isang paraan na ito, muli, na

239
00:11:57,150 --> 00:12:00,260
ay lamang ng isang espesyal na salita para sa isang function
na likas sa isang bagay.

240
00:12:00,260 --> 00:12:03,440
Ito ay kung ano na ang
maaaring magmukhang syntax.

241
00:12:03,440 --> 00:12:09,360
At kaya makikita namin simulan upang makita ang ilan sa
ito sa konteksto ng JavaScript.

242
00:12:09,360 --> 00:12:12,470
>> Maaari mo ring isipin ang tungkol sa isang bagay
uri ng tulad ng isang nag-uugnay array,

243
00:12:12,470 --> 00:12:14,160
na kung saan kami ay pamilyar sa mula sa PHP.

244
00:12:14,160 --> 00:12:17,720
Tandaan nagpapahintulot sa isang nag-uugnay array
amin upang magkaroon ng pangunahing mga pares ng halaga, sa halip

245
00:12:17,720 --> 00:12:23,040
ng pagkakaroon ng index 0, isa, dalawa, tatlo,
at iba pa tulad ng kami ay ginagamit upang mula sa C

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

247
00:12:23,940 --> 00:12:27,472
Uugnay array ay maaaring mapa
salita, tulad ng sa video PHP,

248
00:12:27,472 --> 00:12:29,180
kami ay pakikipag-usap tungkol sa
toppings ng pizza.

249
00:12:29,180 --> 00:12:31,180
At kaya kami ay nagkaroon ng isang array
tinatawag na pizza, at kami

250
00:12:31,180 --> 00:12:36,670
nagkaroon keso ay isang susi at $ 8.99 ay ang
halaga, at pagkatapos ay pepperoni ay isang key,

251
00:12:36,670 --> 00:12:39,190
$ 9.99 ay isang halaga, at iba pa.

252
00:12:39,190 --> 00:12:43,300
At upang maaari ring mag-isip tungkol sa isang
object uri ng katulad sa isang nag-uugnay

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

254
00:12:43,840 --> 00:12:47,020
At kaya ang syntax na ito dito
ay lumikha ng isang bagong bagay

255
00:12:47,020 --> 00:12:50,950
tinatawag herbie na may dalawang
mga katangian sa loob ng mga ito.

256
00:12:50,950 --> 00:12:57,310
Taon, na itinalaga sa halaga 1963,
at modelo, na kung saan ay itinalaga ang string

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

258
00:12:58,140 --> 00:13:01,770
>> At mapansin dito na gumagamit ako
single quotes sa JavaScript.

259
00:13:01,770 --> 00:13:05,570
Maaari mong gamitin ang single o double quotes
kapag ikaw ay pakikipag-usap tungkol sa mga string.

260
00:13:05,570 --> 00:13:07,772
Ito ay conventionally lamang
ang kaso na ang karamihan sa mga oras

261
00:13:07,772 --> 00:13:10,230
kapag sumusulat ka ng JavaScript,
gumamit ka lamang ng isang solong quotes.

262
00:13:10,230 --> 00:13:15,050
Ngunit maaari ko bang gamitin double quotes dito, at
na magiging ganap na multa rin.

263
00:13:15,050 --> 00:13:17,470
>> Kaya tandaan kung paano sa
PHP nagkaroon kami ito paniwala

264
00:13:17,470 --> 00:13:22,730
ng isang para sa bawat loop na ay magpapahintulot sa amin
upang umulit sa lahat ng mga halaga ng key

265
00:13:22,730 --> 00:13:25,270
mga pares ng isang nag-uugnay
array, dahil tayo

266
00:13:25,270 --> 00:13:29,050
ay hindi magkaroon ng kakayahan na ito upang umulit
sa pamamagitan ng 0, isa, dalawa, tatlo, apat,

267
00:13:29,050 --> 00:13:30,710
at iba pa?

268
00:13:30,710 --> 00:13:35,010
Ay may isang bagay na halos kapareho JavaScript,
ngunit hindi ito ay tinatawag na isang para sa bawat loop,

269
00:13:35,010 --> 00:13:38,960
ito ay tinatawag na isang para sa loop.

270
00:13:38,960 --> 00:13:42,890
Kaya kung sinabi ko sa akin tulad ng
ito, para var key sa object,

271
00:13:42,890 --> 00:13:48,670
na uri ng katulad sa sinasabi
para sa bawat isang bagay bilang isang bagay.

272
00:13:48,670 --> 00:13:53,850
Subalit ang lahat ako ginagawa dito ay iterating
sa pamamagitan ng lahat ng mga susi ng aking object.

273
00:13:53,850 --> 00:13:56,070
At sa loob ng kulot
braces diyan, nais ko

274
00:13:56,070 --> 00:14:03,410
gamitin ang object square bracket key upang sumangguni
sa ang halaga sa na key na lokasyon.

275
00:14:03,410 --> 00:14:05,400
>> Bilang kahalili, may
kahit isa pang diskarte.

276
00:14:05,400 --> 00:14:10,880
Kung ako lamang lamang aalaga tungkol sa mga
mga halaga, maaari kong sabihin para sa mga susi ng bagay,

277
00:14:10,880 --> 00:14:12,360
at gamitin lamang key sa loob.

278
00:14:12,360 --> 00:14:17,240
Kaya para var key sa object, mayroon akong
gamitin object square bracket

279
00:14:17,240 --> 00:14:19,340
susi sa loob ng loop.

280
00:14:19,340 --> 00:14:24,580
Para var key ng object, maaari ko
gamitin lamang ang susi sa loob ng loop,

281
00:14:24,580 --> 00:14:29,040
dahil partikular lang ako
pakikipag-usap tungkol sa mga halaga doon.

282
00:14:29,040 --> 00:14:32,630
>> Kaya sabihin siguro kumuha ng isang
tingnan ang pagkakaiba

283
00:14:32,630 --> 00:14:35,670
upang mabilis na ipakita sa iyo
ang pagkakaiba sa pagitan ng apat

284
00:14:35,670 --> 00:14:40,730
sa at para sa mga may isang napaka-tukoy na
array, na kung saan mayroon kaming dito, linggo array.

285
00:14:40,730 --> 00:14:43,616
Kaya kailangan kong makahanap ng isang bagong array
na napuno ko na may pitong string,

286
00:14:43,616 --> 00:14:46,240
Lunes Martes Miyerkules,
Huwebes, Biyernes, Sabado, Linggo.

287
00:14:46,240 --> 00:14:50,530
At gusto ko sa ngayon umulit
sa pamamagitan ng array na ito,

288
00:14:50,530 --> 00:14:53,090
pag-print out ang ilang impormasyon.

289
00:14:53,090 --> 00:14:58,780
Kung gumamit ako ng isang para sa loop
upang i-print out ang impormasyon,

290
00:14:58,780 --> 00:15:00,710
ano sa tingin mo ako pagpunta upang makakuha ng?

291
00:15:00,710 --> 00:15:01,710
Well, sabihin kumuha ng isang hitsura.

292
00:15:01,710 --> 00:15:05,300
At bago namin tumalon sa ibabaw
sa aking window ng browser,

293
00:15:05,300 --> 00:15:08,090
lamang malaman na
console.log ay uri ng isa

294
00:15:08,090 --> 00:15:10,630
paraan ng paggawa ng isang print F sa JavaScript.

295
00:15:10,630 --> 00:15:12,040
Ngunit ano ang console?

296
00:15:12,040 --> 00:15:14,940
Well, na kung ano kami ay pagpunta
upang pumunta tingnan sa ngayon.

297
00:15:14,940 --> 00:15:16,850
>> OK, kaya hindi namin pabalik dito
sa aking window ng browser,

298
00:15:16,850 --> 00:15:19,410
at ako pagpunta upang buksan
ang aking mga tool ng developer.

299
00:15:19,410 --> 00:15:22,290
Muli, ako pagpindot lamang F12
upang buksan ang tool ng developer.

300
00:15:22,290 --> 00:15:25,670
At pansinin na dito sa
top pinili ko ang console.

301
00:15:25,670 --> 00:15:28,480
Kaya ito ay ang paniwala
ng isang developer console,

302
00:15:28,480 --> 00:15:30,500
at ito ay magbibigay-daan sa amin upang
i-print ang impormasyon sa labas,

303
00:15:30,500 --> 00:15:33,000
uri ng tulad ng mga terminal, ngunit
tulad ng makikita mo ang isang maliit na mamaya,

304
00:15:33,000 --> 00:15:37,720
maaari rin naming i-type ang impormasyon sa
upang makipag-ugnay sa aming web page.

305
00:15:37,720 --> 00:15:42,320
Pupunta ako upang mag-zoom in ng kaunti dito,
at ako gonna click na ngayon sa para sa pagsubok.

306
00:15:42,320 --> 00:15:45,230
At apat sa test-- hindi ako gonna
magpapakita sa iyo ang code para dito sa ngayon,

307
00:15:45,230 --> 00:15:47,479
ngunit makakakuha ka ng mga ito kung ikaw
i-download ang source code na

308
00:15:47,479 --> 00:15:50,380
ay nauugnay sa ito video--
ay lamang na para sa loop

309
00:15:50,380 --> 00:15:52,610
na nakita namin lamang ng isang
segundo na nakalipas sa slide.

310
00:15:52,610 --> 00:15:54,810
>> Kaya ako gonna-click na iyon
button, at higit dito,

311
00:15:54,810 --> 00:15:58,440
narito ang kung ano ang naka-print out sa
console, 0, isa, dalawa, tatlo, apat, lima,

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

313
00:15:58,940 --> 00:16:02,490
Hindi ko i-print out ang impormasyon
sa loob ng mga lokasyong iyon array,

314
00:16:02,490 --> 00:16:05,180
dahil ginamit ko ang isang para sa loop.

315
00:16:05,180 --> 00:16:10,670
At sa loob ng katawan ng loop, ako
lamang-print out key hindi object key.

316
00:16:10,670 --> 00:16:18,600
Ngunit kung ngayon clear ko ang aking console, at ako
lumipat sa para sa pagsubok, at apat sa test

317
00:16:18,600 --> 00:16:22,500
Sinasabi ko gagamitin ko para sa loop
sa halip at i-print ang key,

318
00:16:22,500 --> 00:16:28,079
kung na-click ko na, ngayon ko nakukuha ang
aktwal na mga elemento sa loob ng aking mga bagay

319
00:16:28,079 --> 00:16:29,120
o ang aking array sa kasong ito.

320
00:16:29,120 --> 00:16:31,760
Aking array ng mga araw ng linggo.

321
00:16:31,760 --> 00:16:33,480
I-print out Lunes,
Martes Miyerkules.

322
00:16:33,480 --> 00:16:36,930
Kaya na ang pagkakaiba sa pagitan ng
isang para sa loop, na mga Kopya out

323
00:16:36,930 --> 00:16:43,410
lamang ang mga key kung ikaw lamang gamitin key
sa loob ng katawan ng loop,

324
00:16:43,410 --> 00:16:46,850
at isang para sa loop, na kung saan mga kopya
out ang mga halaga kung gagamitin mo lang

325
00:16:46,850 --> 00:16:48,870
key sa loob ng katawan ng loop.

326
00:16:48,870 --> 00:16:52,380
>> Lahat ng mga karapatan, paano namin simulan ngayon upang
pagdugtungin string at marahil ihalo up

327
00:16:52,380 --> 00:16:57,220
ang ilang mga variable na may agaw
tulad ng nagawa naming gawin sa PHP?

328
00:16:57,220 --> 00:16:59,410
Well, kami ay medyo pamilyar
sa ito mula sa PHP.

329
00:16:59,410 --> 00:17:04,109
Ito ay kung paano namin gawin ito gamit ang
dot operator upang pagdugtungin string.

330
00:17:04,109 --> 00:17:06,260
Sa JavaScript, bagaman,
kami ang tunay na gamitin ang isang bagay

331
00:17:06,260 --> 00:17:09,290
tinatawag na ang plus operator, na kung saan
ay maaari ring maging isang maliit na mas kaunti

332
00:17:09,290 --> 00:17:10,470
intuitive, di ba?

333
00:17:10,470 --> 00:17:12,609
Kami ay pagdaragdag ng grupo
ng mga string na magkasama.

334
00:17:12,609 --> 00:17:14,520
Kaya ng ulo pabalik ipaalam
at makita kung ano ito

335
00:17:14,520 --> 00:17:18,693
ay i-print kung kami ay sinusubukan upang i-print out
lahat ng mga impormasyon sa week array.

336
00:17:18,693 --> 00:17:20,859
Lahat ng karapatan, kaya sa ilalim dito
sa ilalim ng string pagdudugtong,

337
00:17:20,859 --> 00:17:24,822
Mayroon akong dalawang mga pagpipilian, string building
V1 at pagkatapos string building V2.

338
00:17:24,822 --> 00:17:26,530
At kami na makita kung bakit namin
Kailangan V2 sa isang segundo.

339
00:17:26,530 --> 00:17:28,610
Ngunit ako gonna mag-click sa
string building V1, na

340
00:17:28,610 --> 00:17:30,360
ay ang code namin
pagkuha lamang ng isang pagtingin sa,

341
00:17:30,360 --> 00:17:32,980
ang console.log sa lahat ng mga plus.

342
00:17:32,980 --> 00:17:35,910
Tingnan natin kung ito prints Ipaalam
kung ano ang inaasahan namin.

343
00:17:35,910 --> 00:17:39,939
>> Lunes ay araw number 01 ng linggo,
Martes ay araw number 11 ng linggo.

344
00:17:39,939 --> 00:17:41,730
Well, kung ano ako ay sinusubukan
gawin nagkaroon makakuha

345
00:17:41,730 --> 00:17:46,280
ito upang i-print out ang Lunes ay araw na numero
isa, Tuesday ay araw ng dalawang numero.

346
00:17:46,280 --> 00:17:50,140
Ngunit parang gusto ako
palaging pag-print out ng isa.

347
00:17:50,140 --> 00:17:51,260
Well, kung bakit ay na?

348
00:17:51,260 --> 00:17:55,600
Well, ito ay lumiliko out, kumuha ng isa pang tumingin
sa ito maliit na snippet ng code dito.

349
00:17:55,600 --> 00:18:00,160
Pansinin na aming ginagamit ang plus
operator sa loob ng dalawang iba't ibang konteksto.

350
00:18:00,160 --> 00:18:03,221
>> At kaya narito ang kung saan siguro bagay
na namin ang uri ng ay sinasabi namin,

351
00:18:03,221 --> 00:18:03,970
oh, ito ay kaya mahusay.

352
00:18:03,970 --> 00:18:05,910
Hindi namin pakikitungo sa mga uri ng data na ngayon.

353
00:18:05,910 --> 00:18:08,220
Ngunit narito ang kung saan ang katotohanan
na nawala namin uri ng data

354
00:18:08,220 --> 00:18:10,960
aktwal na maaaring maging isang bit
ng isang problema para sa amin.

355
00:18:10,960 --> 00:18:16,260
Ngayon na ang plus operator ay ginagamit upang
pagdugtungin string at magdagdag ng mga numero

356
00:18:16,260 --> 00:18:19,550
sama-sama, JavaScript ay
sa gumawa nito pinakamahusay na hula

357
00:18:19,550 --> 00:18:22,030
sa kung ano ang gusto ko ito gawin para sa akin.

358
00:18:22,030 --> 00:18:23,900
At sa kasong ito, ito nahulaan mali.

359
00:18:23,900 --> 00:18:29,340
Ito lamang concatenated araw, na kung saan ay
0, isa, dalawa, tatlo, apat, lima, o anim,

360
00:18:29,340 --> 00:18:32,060
at pagkatapos ay concatenated lang ito
pagkatapos ay concatenated na at isa.

361
00:18:32,060 --> 00:18:35,020
Ito ay hindi tunay na idagdag ang mga ito nang magkakasama.

362
00:18:35,020 --> 00:18:37,320
At kaya ang mga wika,
PHP at JavaScript,

363
00:18:37,320 --> 00:18:39,196
na abstracts malayo
ang paniwala ng mga uri,

364
00:18:39,196 --> 00:18:40,820
hindi mo na kailangang humarap sa mga ito anymore.

365
00:18:40,820 --> 00:18:43,600
Sila ay magkakaroon pa rin ng uri sa ilalim ng hood.

366
00:18:43,600 --> 00:18:46,780
At maaari namin, sa mga sitwasyon
tulad nito, pakikinabangan na katotohanan

367
00:18:46,780 --> 00:18:49,240
sa pamamagitan ng pagsasabi ng isang bagay
tulad marahil na ito, na

368
00:18:49,240 --> 00:18:53,210
ay nagsasabi sa JavaScript, sa pamamagitan ng
paraan, ituturing ito bilang isang integer,

369
00:18:53,210 --> 00:18:57,100
huwag ituring ito bilang isang string, kahit
kahit kami ay paghahalo-sama string

370
00:18:57,100 --> 00:18:58,940
at integer dito.

371
00:18:58,940 --> 00:19:02,204
>> Ito ay isa sa mga bagay lamang
na ito ay tila kaya mahusay sa konteksto

372
00:19:02,204 --> 00:19:04,120
na hindi natin kailangang
pakikitungo sa mga uri anymore,

373
00:19:04,120 --> 00:19:05,828
ngunit kung minsan makikita mo
tumakbo sa isang sitwasyon

374
00:19:05,828 --> 00:19:09,110
eksakto tulad nito kung saan ang mga katotohanan na
wala kang kontrol sa mga uri

375
00:19:09,110 --> 00:19:11,220
Maaari kalabang apoy sa iyo
kung ikaw ay hindi maingat.

376
00:19:11,220 --> 00:19:18,285
At kaya kung pop-back namin sa paglipas ng sa IDE, ako
pagpunta sa mga malinaw na ang muli ang aking console,

377
00:19:18,285 --> 00:19:20,660
at ako pagpunta sa i-click ang string
building bersyon dalawa na

378
00:19:20,660 --> 00:19:23,052
ay kung saan ko bang gamitin na parse int function.

379
00:19:23,052 --> 00:19:25,260
Ngayon ay ang pag-print out
impormasyon na ako umaasa.

380
00:19:25,260 --> 00:19:29,330
Araw na numero ng isa Lunes, Martes
sa araw na bilang dalawang, at iba pa.

381
00:19:29,330 --> 00:19:31,170
>> Kaya sabihin makipag-usap tungkol sa mga pag-andar muli.

382
00:19:31,170 --> 00:19:34,790
Nangako ako sa gusto naming makipag-usap tungkol anonymous
pag-andar, at ngayon ang konteksto para sa na

383
00:19:34,790 --> 00:19:36,360
ay sa wakas dumating.

384
00:19:36,360 --> 00:19:39,980
Kaya bago namin gawin ito, makipag-usap muli ipaalam
tungkol sa array para sa isang segundo lang.

385
00:19:39,980 --> 00:19:42,120
Kaya array ay isang espesyal na
kaso ng isang bagay.

386
00:19:42,120 --> 00:19:45,180
Sa katunayan, ang lahat ng bagay sa
JavaScript ay tunay na isang bagay.

387
00:19:45,180 --> 00:19:47,190
Kaya function ay isang
espesyal na kaso ng isang bagay,

388
00:19:47,190 --> 00:19:49,770
integer ay isang espesyal na
kaso ng isang bagay,

389
00:19:49,770 --> 00:19:52,152
ngunit array partikular
magkaroon ng isang bilang ng mga pamamaraan.

390
00:19:52,152 --> 00:19:55,110
Tandaan dahil ang mga ito ng mga bagay,
maaari silang magkaroon ng mga ari-arian at mga pamamaraan.

391
00:19:55,110 --> 00:19:58,600
Sila ay may isang bilang ng mga pamamaraan na
maaaring ilapat sa mga bagay.

392
00:19:58,600 --> 00:20:01,197
May isang paraan na tinatawag na
laki, array.size,

393
00:20:01,197 --> 00:20:03,030
na kung saan ay babalik sa
iyo bilang maaari mong asahan

394
00:20:03,030 --> 00:20:05,120
ang bilang ng mga sangkap sa iyong array.

395
00:20:05,120 --> 00:20:08,480
array.pop, uri ng tulad
aming paniwala ng pop off

396
00:20:08,480 --> 00:20:11,110
ng isang stack, kung isipin mo
mula sa aming mga stack video,

397
00:20:11,110 --> 00:20:13,810
Tinatanggal ang huling elemento mula sa array.

398
00:20:13,810 --> 00:20:17,110
array.push nagdadagdag ng isang bagong elemento
sa dulo ng isang array.

399
00:20:17,110 --> 00:20:20,910
array.shift ay uri ng
tulad ng DQ, ito splices out

400
00:20:20,910 --> 00:20:23,610
ang pinakaunang elemento ng isang array.

401
00:20:23,610 --> 00:20:27,549
>> Subalit mayroong isa pang espesyal na ring
paraan ng isang array na tinatawag na mapa.

402
00:20:27,549 --> 00:20:29,340
At ito ang mga uri ng isang
kagiliw-giliw na konsepto.

403
00:20:29,340 --> 00:20:30,930
Kaya kung ano ay ang ideya ng isang mapa?

404
00:20:30,930 --> 00:20:33,880
Makikita mo talagang makita ito
sa iba't ibang wika,

405
00:20:33,880 --> 00:20:38,550
at hindi kami pakikipag-usap tungkol sa isang
uri ng cartographers map dito,

406
00:20:38,550 --> 00:20:41,480
pinag-uusapan natin ang tungkol sa isang pag-andar ng pagmamapa.

407
00:20:41,480 --> 00:20:44,110
Sa konteksto hindi namin
pakikipag-usap tungkol dito, ang isang mapa

408
00:20:44,110 --> 00:20:47,950
ay isang espesyal na operasyon namin
maaaring gumanap sa isang array

409
00:20:47,950 --> 00:20:51,630
upang ilapat ang isang partikular na function
sa bawat elemento ng array na.

410
00:20:51,630 --> 00:20:55,190
at iba gusto naming sabihin sa
kasong ito, marahil array.map,

411
00:20:55,190 --> 00:21:00,330
at sa loob ng mga ito, na tayo dumadaan
sa mapa ay isang function na gusto naming

412
00:21:00,330 --> 00:21:02,430
upang mailapat sa bawat solong elemento.

413
00:21:02,430 --> 00:21:07,299
Kaya ito ay isang uri ng kahalintulad sa gamit
isang loop upang umulit sa bawat elemento

414
00:21:07,299 --> 00:21:09,340
at ilapat ang isang partikular
gumana sa bawat elemento,

415
00:21:09,340 --> 00:21:14,830
lamang JavaScript ay ito built in
paniwala ng isang mapping na maaaring ilapat.

416
00:21:14,830 --> 00:21:19,700
At ito ay isang mahusay na konteksto sa
makipag-usap tungkol sa isang hindi nakikilalang function.

417
00:21:19,700 --> 00:21:22,370
>> Kaya sabihin nating mayroon kaming
ito ang dami ng mga integer.

418
00:21:22,370 --> 00:21:25,370
Ito ay tinatawag na nums, at ito ay nakuha ng limang
mga bagay-bagay sa loob nito, isa, dalawa, tatlo, apat,

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

420
00:21:26,410 --> 00:21:30,620
Ngayon gusto ko upang i-map ang ilang mga
function na sa sa array na ito.

421
00:21:30,620 --> 00:21:34,337
Gusto kong magkaroon ng isang function apply
sa bawat elemento ng array.

422
00:21:34,337 --> 00:21:37,420
Well, sabihin natin na kung ano ang gusto kong
gawin ay double lamang ang lahat ng mga elemento.

423
00:21:37,420 --> 00:21:42,520
Ano ang maaari kong gawin ay gumamit lamang ng isang loop
para var ko ay katumbas ng 0, I ay mas mababa sa

424
00:21:42,520 --> 00:21:47,390
o katumbas ng 4, ako plus, plus, at
pagkatapos ay i-double ang bawat isang numero.

425
00:21:47,390 --> 00:21:49,580
Ngunit maaari din ako gumawa ng isang bagay na katulad nito.

426
00:21:49,580 --> 00:21:53,420
Maaari ko bang sabihin nums ay dating
isa dalawa tatlo apat lima,

427
00:21:53,420 --> 00:21:58,310
ngayon, bagaman, Gusto ko sa iyo upang
maglapat ng pagmamapa na ito papunta sa array

428
00:21:58,310 --> 00:22:00,400
kung saan Gusto ko sa iyo
sa double bawat number.

429
00:22:00,400 --> 00:22:02,540
At iyon mismo
kung ano ang nangyayari dito.

430
00:22:02,540 --> 00:22:06,870
Ngunit mapansin kung ano ako makapasa
in bilang argumento sa mapa.

431
00:22:06,870 --> 00:22:09,080
Ito ay isang hindi nakikilalang function.

432
00:22:09,080 --> 00:22:11,140
At mapansin hindi ko ibinigay
mga function na ito ng isang pangalan,

433
00:22:11,140 --> 00:22:13,290
Ibinigay ko lamang ito ng isang listahan ng mga parameter.

434
00:22:13,290 --> 00:22:16,370
At kaya ito ay isang halimbawa
ng isang hindi nakikilalang function.

435
00:22:16,370 --> 00:22:21,270
>> Kami ay karaniwang hindi nais na tawag ito
function sa labas ng konteksto ng mapa.

436
00:22:21,270 --> 00:22:24,110
Kami ay pagtukoy ito bilang isang parameter
upang i-map, at upang gawin namin hindi talaga

437
00:22:24,110 --> 00:22:27,910
kailangan upang magkaroon ng isang pangalan para sa mga ito kung ang
tanging bagay na nagmamalasakit tungkol sa kung mapa

438
00:22:27,910 --> 00:22:30,339
at ito ay tinukoy ng karapatan
doon sa loob ng mapa.

439
00:22:30,339 --> 00:22:31,880
At kaya ito ay isang hindi nakikilalang function.

440
00:22:31,880 --> 00:22:34,680
Hindi namin nagawang
upang gawin ito dati.

441
00:22:34,680 --> 00:22:38,400
Mapa ng ilang mga pag-andar na
tumatanggap ng isang parameter, num,

442
00:22:38,400 --> 00:22:41,890
at kung ano ang ginagawa na pag-andar
ay nagbabalik NUM beses 2.

443
00:22:41,890 --> 00:22:45,330
At kaya pagkatapos nito
mapping ay na-apply,

444
00:22:45,330 --> 00:22:50,090
ito ay ngayon kung ano ang hitsura nums
like, dalawa, apat, anim, walo, 10.

445
00:22:50,090 --> 00:22:52,090
At kami na pop sa aking
window ng browser at lamang

446
00:22:52,090 --> 00:22:55,240
tingnan ang mga ito
talagang mabilis na rin.

447
00:22:55,240 --> 00:22:58,000
>> Kaya kailangan ko ng isa pang button dito
sa aking home page tinatawag double.

448
00:22:58,000 --> 00:23:03,570
At kapag nag-click ako double, at ito ay nagsasabi
sa akin bago ito ay isa, dalawa, tatlo, apat,

449
00:23:03,570 --> 00:23:07,250
limang pagkatapos dalawa, apat, anim, walo, 10.

450
00:23:07,250 --> 00:23:11,930
At kung pumunta ako sa likod at i-click ang double
muli, dalawa, apat, anim, walo, 10.

451
00:23:11,930 --> 00:23:17,400
At pagkatapos ay pagkatapos, apat,
walo, 12, 16, at pagkatapos ay 20.

452
00:23:17,400 --> 00:23:20,440
At ano ang ginagawa ko sa function na ito?

453
00:23:20,440 --> 00:23:25,210
Well, kung pop lang namin sa paglipas ng sa IDE, at
Hilahin ko ang aking function na anonymous, dito

454
00:23:25,210 --> 00:23:28,780
sa pitong linya sa pamamagitan ng 13, ako
paggawa ng isang maliit na piraso ng magarbong trabaho dito,

455
00:23:28,780 --> 00:23:32,240
ngunit lamang ako sa pag-print out
kung ano ang kasalukuyang sa array.

456
00:23:32,240 --> 00:23:36,580
Pagkatapos ay sa 16 na linya, 17,
at 18, may aking mapa.

457
00:23:36,580 --> 00:23:40,930
Ito ay kung saan ako nag-aaplay ito pagdodoble
function na upang ang bawat isang elemento.

458
00:23:40,930 --> 00:23:43,530
At pagkatapos ng isang maliit na karagdagang down,
Tingin lang ako sa paggawa ng parehong bagay

459
00:23:43,530 --> 00:23:46,640
Ako ay gumagawa ng bago, maliban na ngayon Ako
pag-print out ang mga nilalaman ng array

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

461
00:23:48,167 --> 00:23:50,500
Subalit ang lahat ng nagawa ko dito ay
gamitin lamang ang isang hindi nakikilalang function

462
00:23:50,500 --> 00:23:53,640
upang i-map sa isang buong array.

463
00:23:53,640 --> 00:23:58,466
>> Kaya isa pang malaking paksa na makipag-usap tungkol sa
JavaScript ay ang pagkaunawa ng isang kaganapan.

464
00:23:58,466 --> 00:24:01,590
Ang isang kaganapan ay isang bagay na lamang ang mangyayari
kapag nakipag-ugnayan ang isang user sa iyong web

465
00:24:01,590 --> 00:24:04,715
pahina, kaya siguro nag-click sila sa isang bagay,
o marahil ang pahina ay tapos loading,

466
00:24:04,715 --> 00:24:07,200
o marahil na inilipat sila
kanilang mouse sa isang bagay,

467
00:24:07,200 --> 00:24:09,290
o sila na nag-type ng isang bagay
sa isang field ng input.

468
00:24:09,290 --> 00:24:14,260
Lahat ng mga bagay ay mga kaganapan
na nagaganap sa aming web page.

469
00:24:14,260 --> 00:24:17,460
At JavaScript ay may mga
kakayahan upang suportahan ang isang bagay

470
00:24:17,460 --> 00:24:21,760
tinatawag na isang handler ng kaganapan, na
ay isang callback function na

471
00:24:21,760 --> 00:24:23,329
tumugon sa isang html kaganapan.

472
00:24:23,329 --> 00:24:24,620
At kung ano ang isang callback function?

473
00:24:24,620 --> 00:24:27,328
Well, ito ay karaniwang lamang ng isa pang
pangalan para sa isang hindi nakikilalang function.

474
00:24:27,328 --> 00:24:30,170
Ito ay isang function na
tumugon sa isang kaganapan.

475
00:24:30,170 --> 00:24:34,130
At ito ay kung saan namin dumating sa
ideya ng umiiral na ang ilang mga function

476
00:24:34,130 --> 00:24:38,060
sa isang partikular na katangian html.

477
00:24:38,060 --> 00:24:41,420
Mayroon Karamihan elemento html
suporta para sa isang katangian

478
00:24:41,420 --> 00:24:45,170
na hindi namin makipag-usap tungkol sa html
video para sa isang bagay tulad ng sa pag-click

479
00:24:45,170 --> 00:24:50,540
o sa hover o sa load,
lahat ng mga kaganapan

480
00:24:50,540 --> 00:24:53,120
na maaari mong pagkatapos ay isulat ang mga function
na pakikitungo sa mga kaganapan

481
00:24:53,120 --> 00:24:56,090
kapag ang mga kaganapan
mangyari sa iyong web page.

482
00:24:56,090 --> 00:24:59,170
>> At kaya marahil ang iyong html
hitsura ng isang bagay tulad nito.

483
00:24:59,170 --> 00:25:02,240
At ako ay may dalawang mga pindutan dito,
button isa at button dalawa,

484
00:25:02,240 --> 00:25:04,620
at dito ko sa kasalukuyan
tinukoy sa wala,

485
00:25:04,620 --> 00:25:11,170
ngunit ito ay kung saan ang mga katangian sa
click ay tila bahagi ng aking html tag.

486
00:25:11,170 --> 00:25:15,220
Kaya tila kapag tinukoy ko kung ano ang
nangyayari sa loob ng mga katangiang iyon,

487
00:25:15,220 --> 00:25:18,590
ito ay pagpunta sa ilang JavaScript
function na tumugon sa mga kaganapan

488
00:25:18,590 --> 00:25:24,360
siguro ng pag-click sa
button isa o button dalawa.

489
00:25:24,360 --> 00:25:28,580
>> Ano ang uri ng mga cool tungkol sa mga ito ay namin
maaaring sumulat ng isang pangkaraniwang kaganapan handler.

490
00:25:28,580 --> 00:25:32,370
At ito Handler kaganapan ay
lumikha ng isang bagay na kaganapan.

491
00:25:32,370 --> 00:25:37,000
At ang object ng kaganapan ay sabihin sa amin
kung alin sa dalawang mga pindutan ay nag-click.

492
00:25:37,000 --> 00:25:38,064
Ngayon kung paano ang trabaho?

493
00:25:38,064 --> 00:25:39,730
Well, ito ay maaaring tingnan ng isang bagay na katulad nito.

494
00:25:39,730 --> 00:25:44,860
Kaya una naming tukuyin ang aming mga pindutan
na magkaroon ng isang tugon sa mga callback

495
00:25:44,860 --> 00:25:47,470
function na ito ay tinatawag na
kapag ang pindutan ay nag-click,

496
00:25:47,470 --> 00:25:49,520
Makikita kami tatawag sa pangalan ng alerto kaganapan.

497
00:25:49,520 --> 00:25:53,320
At paunawa sa parehong mga kaso hindi namin
pagpasa sa parameter event na ito.

498
00:25:53,320 --> 00:25:55,460
Kaya ang tawag namin sa mga function na ito
o kapag ang function na ito

499
00:25:55,460 --> 00:26:00,330
ay nag-trigger sa pamamagitan ng mga kaganapan na nangyayari,
ito ay pagpunta upang lumikha ng object event na ito

500
00:26:00,330 --> 00:26:03,300
at ipasa ito bilang
parameter upang alertuhan name.

501
00:26:03,300 --> 00:26:07,270
At na object ng kaganapan ay
pagpunta sa maglaman ng impormasyon

502
00:26:07,270 --> 00:26:09,800
tungkol sa kung aling mga pindutan ay nag-click.

503
00:26:09,800 --> 00:26:11,580
At paano ito gawin iyon?

504
00:26:11,580 --> 00:26:13,654
Well, ito ay maaaring tingnan ng isang bagay na katulad nito.

505
00:26:13,654 --> 00:26:15,570
Kaya ngayon sa aking hiwalay na
JavaScript file, maaari ko

506
00:26:15,570 --> 00:26:17,420
kung mahanap na ito
Pangalan ng alerto function, kung saan

507
00:26:17,420 --> 00:26:19,500
muli tumatanggap na parameter kaganapan.

508
00:26:19,500 --> 00:26:24,640
At pagkatapos dito ay kung saan makakakuha ako ng tiktik
na button ay nag-trigger,

509
00:26:24,640 --> 00:26:28,100
var trigger katumbas kaganapan
dot pinagmulan element.

510
00:26:28,100 --> 00:26:33,150
Ano ang pinagmulan na nilikha
object sa kaganapang ito na ay lumampas na sa?

511
00:26:33,150 --> 00:26:36,390
Ay ito ng isang pindutan o ito button dalawa?

512
00:26:36,390 --> 00:26:40,710
>> At pagkatapos ay narito ang lahat ng ginagawa ko
imprenta ang trigger.innerhtml.

513
00:26:40,710 --> 00:26:43,860
Well, sa kasong ito, sa ganitong
konteksto, trigger.innerhtml

514
00:26:43,860 --> 00:26:45,940
lamang kung ano ang nakasulat sa button.

515
00:26:45,940 --> 00:26:48,830
Ito lang kaya ang mangyayari kung namin tumalon
bumalik para sa pangalawang, na gagawin

516
00:26:48,830 --> 00:26:51,670
maging kung ano ang sa pagitan ng mga tag na iyon button.

517
00:26:51,670 --> 00:26:54,150
Ito ay magiging isang pindutan o pindutan ng dalawang.

518
00:26:54,150 --> 00:26:57,320
At tumagal ng isang pagtingin sa ipaalam
paano handler ng kaganapan na ito gagawin

519
00:26:57,320 --> 00:27:01,080
tumingin kung kami ay tumatakbo ito sa pagsasanay.

520
00:27:01,080 --> 00:27:03,850
>> Kaya una sa lahat, na sa iyo
nagbukas events.js,

521
00:27:03,850 --> 00:27:06,517
kung saan ay ang JavaScript file na kung saan ang
Tinukoy ko ang function na ito.

522
00:27:06,517 --> 00:27:08,558
At bilang maaari mong makita, ito ay
medyo marami kung ano mismo ang

523
00:27:08,558 --> 00:27:10,230
Nakita lang namin sa slide sa isang segundo ang nakalipas.

524
00:27:10,230 --> 00:27:14,890
At ako ay pumunta sa ibabaw ng
home page namin ginagamit.

525
00:27:14,890 --> 00:27:17,660
At mayroon akong dito button
isa at button dalawa.

526
00:27:17,660 --> 00:27:19,820
At kukunin ko na mag-click sa isang pindutan.

527
00:27:19,820 --> 00:27:23,930
Nag-click ka sa pindutan ng isa, kung ikaw
maaaring makita dito mismo sa alerto.

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

529
00:27:25,810 --> 00:27:28,980
Mag-click sa pindutan ng dalawa, ikaw ay
nag-click sa isang pindutan sa dalawa.

530
00:27:28,980 --> 00:27:32,150
>> Kaya kung ang parehong mga pindutan ng
parehong function na tawag, i-right?

531
00:27:32,150 --> 00:27:35,840
Sila ay parehong mga pangalan ng alerto
kaganapan, ngunit object event na ito

532
00:27:35,840 --> 00:27:41,900
na makakakuha ng nilikha kapag kami i-click
ito ay nagsasabi sa amin kung aling mga pindutan ay nag-click.

533
00:27:41,900 --> 00:27:44,650
Hindi namin ay may na magsulat ng dalawang magkahiwalay na
function o pakikitungo sa pagkakaroon

534
00:27:44,650 --> 00:27:46,470
upang pumasa sa anumang karagdagang impormasyon.

535
00:27:46,470 --> 00:27:48,220
Kami lamang ay umaasa sa
kung ano ang JavaScript ay

536
00:27:48,220 --> 00:27:53,772
gawin para sa amin, na kung saan ay upang lumikha ng na
uri ng object na kaganapan sa aming ngalan.

537
00:27:53,772 --> 00:27:56,730
May isang pulutong ng higit pa sa JavaScript kaysa
kung ano ang namin sakop sa video na ito,

538
00:27:56,730 --> 00:27:58,521
ngunit ang pagkakaroon ng mga
pangunahing dapat na makakuha ka

539
00:27:58,521 --> 00:28:00,690
pa ng isang mahabang paraan upang
pag-aaral ng lahat ng bagay na makikita

540
00:28:00,690 --> 00:28:04,030
kailangang malaman tungkol sa mga ito
kagiliw-giliw na wika.

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

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

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