1
00:00:00,000 --> 00:00:39,630

2
00:00:39,630 --> 00:00:41,880
DAVID J. MALAN: Baiklah,
jadi ini di sini adalah lengan Myo yang

3
00:00:41,880 --> 00:00:44,450
band, pasangan di mana kita
mempunyai untuk projek-projek akhir CS50.

4
00:00:44,450 --> 00:00:47,533
Dan itu adalah demonstrasi kami antri
Anda di muka di mana pada dasarnya

5
00:00:47,533 --> 00:00:51,120
lengan yang cukup ketat ini band di sini
mendengar pergerakan otot anda

6
00:00:51,120 --> 00:00:54,280
yang kemudian dipetakan dalam perisian
ke laptop Colton di sebelah sini yang

7
00:00:54,280 --> 00:00:57,230
mempunyai iTunes dan
lagu sudah beratur.

8
00:00:57,230 --> 00:01:00,270
Daripada saya demoing ini,
Colton Sudah di makmal

9
00:01:00,270 --> 00:01:04,129
jelas sepanjang minggu mendapatkan demonstrasi
siap satu sukarelawan berani.

10
00:01:04,129 --> 00:01:07,430
Jika seseorang ingin datang
pada up-- melihat tangan anda terlebih dahulu.

11
00:01:07,430 --> 00:01:09,540
Datang ke atas.

12
00:01:09,540 --> 00:01:12,530
>> Baik.

13
00:01:12,530 --> 00:01:13,886
Dan sapa jenengmu?

14
00:01:13,886 --> 00:01:14,800
>> PENONTON: Eh, Maria.

15
00:01:14,800 --> 00:01:16,550
>> DAVID J. MALAN: Maria, baik untuk melihat anda.

16
00:01:16,550 --> 00:01:17,310
Ayo di sini.

17
00:01:17,310 --> 00:01:19,550
Biar saya memperkenalkan anda kepada Colton.

18
00:01:19,550 --> 00:01:21,290
Colton, ini adalah Maria.

19
00:01:21,290 --> 00:01:23,050
>> COLTON: Hi, baik untuk bertemu dengan kamu.

20
00:01:23,050 --> 00:01:24,330
>> DAVID J. MALAN: Semua
benar, jadi langkah pertama, kami tidak

21
00:01:24,330 --> 00:01:26,204
akan mempunyai anda meletakkan
ini kepada lengan anda

22
00:01:26,204 --> 00:01:29,280
sehingga ia cukup
ketat di dekat siku anda.

23
00:01:29,280 --> 00:01:31,940
Dan sementara itu, mari kita
memakai Google Glass kami

24
00:01:31,940 --> 00:01:33,720
dan kami akan mencampur teknologi hari ini.

25
00:01:33,720 --> 00:01:36,340
>> COLTON: Pertama kita harus
mengaitkan ini ke dalam sesuatu.

26
00:01:36,340 --> 00:01:37,170
>> DAVID J. MALAN: OK.

27
00:01:37,170 --> 00:01:39,795
Sebenarnya, mari kita meletakkan lengan anda sebagai
dekat dengan kabel ini yang mungkin

28
00:01:39,795 --> 00:01:41,160
supaya kita pertama sinkron itu.

29
00:01:41,160 --> 00:01:42,740
>> COLTON: Mari kita lakukan ini.

30
00:01:42,740 --> 00:01:46,500
>> DAVID J. MALAN: Dan sementara itu, sehingga
bahawa semua orang boleh mendapatkan pandangan yang lebih dekat,

31
00:01:46,500 --> 00:01:50,290
kami akan melambungkan kamera Andrew
di layar di sana.

32
00:01:50,290 --> 00:01:54,460
Jadi kita mempunyai kabel USB yang
yang terpasang ke ban Maria.

33
00:01:54,460 --> 00:02:00,230
Dan biarlah saya melambungkan skrin Colton
pada projektor seterusnya.

34
00:02:00,230 --> 00:02:06,000
>> Jadi Colton mendaftarkan peranti
sekarang sebagai Myo dihubungkan dengan kabel ini.

35
00:02:06,000 --> 00:02:08,060
Dan sekarang apa yang Maria
akan lakukan seketika

36
00:02:08,060 --> 00:02:10,120
sebenarnya berjalan melalui
langkah-langkah kalibrasi

37
00:02:10,120 --> 00:02:12,830
dan mengajar perisian
bagaimana otot-ototnya bertindak balas

38
00:02:12,830 --> 00:02:16,070
apabila dia membuat tertentu yang telah ditetapkan
menunjuk bahawa perisian mengerti.

39
00:02:16,070 --> 00:02:17,910
Jika anda ingin pergi di
hadapan skrin.

40
00:02:17,910 --> 00:02:26,840

41
00:02:26,840 --> 00:02:30,090
OK, terus mencuba.

42
00:02:30,090 --> 00:02:31,860
>> COLTON: Pergi seperti ini.

43
00:02:31,860 --> 00:02:32,970
Dan seperti itu.

44
00:02:32,970 --> 00:02:34,563
Dan semua jalan ke kanan.

45
00:02:34,563 --> 00:02:35,922
Kembali.

46
00:02:35,922 --> 00:02:37,740
>> DAVID J. MALAN: OK.

47
00:02:37,740 --> 00:02:38,960
Perspektif yang berbeza.

48
00:02:38,960 --> 00:02:39,620
Ia bukan Anda.

49
00:02:39,620 --> 00:02:40,350
Ini kami.

50
00:02:40,350 --> 00:02:41,749
>> MARIA: OK.

51
00:02:41,749 --> 00:02:42,540
DAVID J. MALAN: No.

52
00:02:42,540 --> 00:02:46,720

53
00:02:46,720 --> 00:02:51,540
Ayo bergerak lebih tinggi supaya ia
lebih dekat dengan siku anda, atau bahkan yang lebih ketat.

54
00:02:51,540 --> 00:02:52,680
Baik.

55
00:02:52,680 --> 00:02:53,270
>> Di sini kita pergi.

56
00:02:53,270 --> 00:02:56,780
Ini akan menjadi masa yang baik untuk CS52X.

57
00:02:56,780 --> 00:02:57,670
Di sana kami pergi.

58
00:02:57,670 --> 00:02:58,760
>> Sangat bagus.

59
00:02:58,760 --> 00:03:01,170
OK.

60
00:03:01,170 --> 00:03:02,790
Ibu jari ke pinky.

61
00:03:02,790 --> 00:03:03,380
>> Sangat bagus.

62
00:03:03,380 --> 00:03:05,140
Sebarkan jari anda.

63
00:03:05,140 --> 00:03:06,240
Baik.

64
00:03:06,240 --> 00:03:06,910
Gelombang yang tepat.

65
00:03:06,910 --> 00:03:15,052

66
00:03:15,052 --> 00:03:17,010
Ia ingin tahu yang menunjukkan
anda dengan hand-- sebelah kiri

67
00:03:17,010 --> 00:03:19,665
>> COLTON: Ya, itu aneh.

68
00:03:19,665 --> 00:03:21,790
DAVID J. MALAN: Wave untuk
yang betul dan bergerak ke hadapan.

69
00:03:21,790 --> 00:03:22,998
Cepat ke skip atau seterusnya.

70
00:03:22,998 --> 00:03:25,020
Itu Wave kanan OK.

71
00:03:25,020 --> 00:03:26,650
>> MARIA: Saya don't-- menunggu.

72
00:03:26,650 --> 00:03:28,430
>> DAVID J. MALAN: Perlukan bantuan?

73
00:03:28,430 --> 00:03:30,027
>> COLTON: Jadi, anda akan seperti ini.

74
00:03:30,027 --> 00:03:31,860
MARIA: Ia membalikkan
benda lain, walaupun.

75
00:03:31,860 --> 00:03:32,390
COLTON: Adalah.

76
00:03:32,390 --> 00:03:34,250
DAVID J. MALAN: Ya, aku tidak tahu
mengapa hal itu menunjukkan anda leftie a.

77
00:03:34,250 --> 00:03:36,458
COLTON: Mengapa kamu tidak try--
hanya cuba pergi seperti ini.

78
00:03:36,458 --> 00:03:38,910

79
00:03:38,910 --> 00:03:40,090
>> DAVID J. MALAN: Tidak?

80
00:03:40,090 --> 00:03:42,580
Mungkin sampai ke tangan anda
keluar sedikit lebih tegak

81
00:03:42,580 --> 00:03:46,070
dan menjadikannya lebih tiba-tiba seperti ini.

82
00:03:46,070 --> 00:03:48,176
Ya, OK, datang ke atas.

83
00:03:48,176 --> 00:03:49,670
>> MARIA: Saya minta maaf.

84
00:03:49,670 --> 00:03:51,170
DAVID J. MALAN: Ini bukan salah anda.

85
00:03:51,170 --> 00:03:53,018
COLTON: Tidak apa-apa.

86
00:03:53,018 --> 00:03:55,430
DAVID J. MALAN: Hak.

87
00:03:55,430 --> 00:03:56,220
Well--

88
00:03:56,220 --> 00:03:57,620
>> MARIA: Haruskah kita melewatkan ini, maka?

89
00:03:57,620 --> 00:03:59,620
DAVID J. MALAN: Ya, mari kita
membiarkan anda bebas.

90
00:03:59,620 --> 00:04:03,130
Jadi, jika ada yang ingin melakukan
projek akhir menggunakan kelebihan ini

91
00:04:03,130 --> 00:04:07,707
perkakasan, menyedari ia mungkin hanya
mengambil sedikit untuk membiasakan diri.

92
00:04:07,707 --> 00:04:10,290
Dan this-- realitinya adalah ini
sebenarnya sangat pendarahan tepi.

93
00:04:10,290 --> 00:04:12,040
>> Ini adalah apa yang disebut
kit pemaju, yang

94
00:04:12,040 --> 00:04:14,956
dimaksudkan untuk menjadi dasarnya adalah pre-release
sehingga orang dapat melakukan hal

95
00:04:14,956 --> 00:04:18,690
this-- berjuang dengan itu, angka
bagaimana tubuh manusia berfungsi

96
00:04:18,690 --> 00:04:19,980
dengan teknologi.

97
00:04:19,980 --> 00:04:21,750
Jadi jika anda ingin
selepas itu, setelah kuliah,

98
00:04:21,750 --> 00:04:23,750
kita boleh membiarkan anda datang dan
mengambil menusuk lain dalam hal itu.

99
00:04:23,750 --> 00:04:26,970
Tetapi jika tidak, tepuk tangan, jika
kita boleh, bagi Maria untuk datang ke atas.

100
00:04:26,970 --> 00:04:28,770
>> MARIA: Terima kasih.

101
00:04:28,770 --> 00:04:30,390
>> DAVID J. MALAN: Terima kasih.

102
00:04:30,390 --> 00:04:34,945
Kami akan bertahan pada ini, tetapi kami akan memberikan
you-- bagaimana dengan bola tekanan di sini?

103
00:04:34,945 --> 00:04:38,620
Oh, dan- jika- ya, terima kasih.

104
00:04:38,620 --> 00:04:39,715
Baik.

105
00:04:39,715 --> 00:04:45,750
Jadi bagi yang ingin tahu, jika anda
tidak biasa dengan pilihan suara

106
00:04:45,750 --> 00:04:47,670
yang kami buat di sana
sebelum ini, TV menakjubkan

107
00:04:47,670 --> 00:04:50,210
menunjukkan bahawa anda perlu benar-benar
menjadi pesta-menonton di Netflix

108
00:04:50,210 --> 00:04:51,110
adalah salah satu ini di sini.

109
00:04:51,110 --> 00:04:54,472
>> SPEAKER 1: Tuan-tuan dan puan-puan,
seorang ahli silap mata yang bernama Josh.

110
00:04:54,472 --> 00:05:04,710

111
00:05:04,710 --> 00:05:08,050
>> DAVID J. MALAN: Dan nampaknya, ia
itu sebagai milik yang teks saya selama kuliah sekarang.

112
00:05:08,050 --> 00:05:11,190
Saya diberitahu bahawa Maria
memiliki ulang tahun kemarin.

113
00:05:11,190 --> 00:05:14,095
Ulang tahun begitu gembira dari
CS50 Maria juga.

114
00:05:14,095 --> 00:05:18,720

115
00:05:18,720 --> 00:05:22,090
>> Jadi, anda mungkin telah membaca pada bulan baru-baru ini
bahawa tuan-tuan di sini, Steve

116
00:05:22,090 --> 00:05:25,260
Ballmer, yang sebenarnya
kelas tahun 1977 di kampus,

117
00:05:25,260 --> 00:05:27,170
baru-baru ini telah bersara untuk Microsoft.

118
00:05:27,170 --> 00:05:29,620
Beliau adalah sarjana di sini,
kemudian beberapa tahun kemudian

119
00:05:29,620 --> 00:05:31,910
mendapati dirinya di
Stanford Business School

120
00:05:31,910 --> 00:05:34,160
ketika menerima telefon yang
panggilan dari seorang sahabat yang beliau

121
00:05:34,160 --> 00:05:36,516
pernah tinggal di lorong
dari dia di sini di Harvard.

122
00:05:36,516 --> 00:05:38,640
Nama rakan tersebut adalah Rang Undang-Undang
Gerbang dan pada masa itu,

123
00:05:38,640 --> 00:05:42,700
ia berusaha untuk merekrut Steve menjadi
orang perniagaan yang pertama, benar-benar,

124
00:05:42,700 --> 00:05:45,720
di sebuah syarikat kecil nama Microsoft.

125
00:05:45,720 --> 00:05:48,960
>> Pendek cerita, Steve
akhirnya menang atas,

126
00:05:48,960 --> 00:05:52,130
bergabung dengan Microsoft apabila mereka
baru sahaja 30 pekerja.

127
00:05:52,130 --> 00:05:54,300
Dan pada masa dia
bersara baru-baru ini,

128
00:05:54,300 --> 00:05:58,100
syarikat itu mempunyai 100,000 pekerja
selama bertahun-tahun kebelakangan ini.

129
00:05:58,100 --> 00:06:01,171
Dan sebagainya laman web yang dikenali sebagai The Verge
disediakan penghormatan ini pada video

130
00:06:01,171 --> 00:06:02,920
yang kami pikir kami akan
bersama yang memberikan anda

131
00:06:02,920 --> 00:06:08,380
rasa betapa banyak tenaga Steve
membawa kepada mana-mana persembahan yang dia berikan.

132
00:06:08,380 --> 00:06:11,884

133
00:06:11,884 --> 00:06:12,550
[VIDEO MAIN SEMULA]

134
00:06:12,550 --> 00:06:16,220
-Microsoft Seperti anak keempat.

135
00:06:16,220 --> 00:06:18,260
Kanak-kanak melakukan meninggalkan rumah.

136
00:06:18,260 --> 00:06:21,875
Dalam hal ini, saya rasa
Saya meninggalkan rumah.

137
00:06:21,875 --> 00:06:23,270
Hey Rang Undang-Undang, whazzap?

138
00:06:23,270 --> 00:06:24,200
>> -Wazzap?

139
00:06:24,200 --> 00:06:25,320
>> Hei, wazzap?

140
00:06:25,320 --> 00:06:28,590
Kami telah diberi
peluang yang sangat besar.

141
00:06:28,590 --> 00:06:30,210
Dan Rang Undang-Undang memberi kami kesempatan itu.

142
00:06:30,210 --> 00:06:35,520

143
00:06:35,520 --> 00:06:36,770
Saya ingin mengucapkan terima kasih kepada Rang Undang-undang untuk itu.

144
00:06:36,770 --> 00:06:39,630
Saya mahu anda juga.

145
00:06:39,630 --> 00:06:42,500
Kepesatan inovasi
tidak akan melambatkan.

146
00:06:42,500 --> 00:06:45,140
>> Ini akan mendapatkan lebih cepat dan lebih cepat.

147
00:06:45,140 --> 00:06:50,165
Mungkin ada beberapa pesaing
yang malangnya dihapuskan!

148
00:06:50,165 --> 00:06:54,337

149
00:06:54,337 --> 00:06:59,564
>> Saya suka syarikat ini.

150
00:06:59,564 --> 00:07:00,064
Ya!

151
00:07:00,064 --> 00:07:03,452

152
00:07:03,452 --> 00:07:08,250
Saya PC, dan saya suka syarikat ini!

153
00:07:08,250 --> 00:07:13,090
>> Pemaju, pemaju, pemaju,
pemaju, pemaju, pemaju,

154
00:07:13,090 --> 00:07:14,560
pemaju, pemaju.

155
00:07:14,560 --> 00:07:17,500

156
00:07:17,500 --> 00:07:18,970
Ya!

157
00:07:18,970 --> 00:07:19,950
Pembangun laman web!

158
00:07:19,950 --> 00:07:21,420
>> Pembangun laman web!

159
00:07:21,420 --> 00:07:22,890
Pembangun laman web!

160
00:07:22,890 --> 00:07:25,830

161
00:07:25,830 --> 00:07:28,770
Dengar apa lagi yang anda
mendapatkan tanpa caj tambahan!

162
00:07:28,770 --> 00:07:31,960
>> MS-DOS eksekutif, temujanji
kalendar, setumpuk kad, buku catatan,

163
00:07:31,960 --> 00:07:33,750
jam, panel kawalan.

164
00:07:33,750 --> 00:07:35,461
Dan, anda boleh percaya?

165
00:07:35,461 --> 00:07:35,960
Reversie!

166
00:07:35,960 --> 00:07:37,270
>> Membakar mereka ke CD!

167
00:07:37,270 --> 00:07:38,660
Posting mereka ke MSN!

168
00:07:38,660 --> 00:07:40,422
Anda email kepada rakan-rakan!

169
00:07:40,422 --> 00:07:41,790
>> Semua dengan satu klik!

170
00:07:41,790 --> 00:07:48,670
Satu Microsoft, satu strategi, satu team--
fokus, disiplin, profesional,

171
00:07:48,670 --> 00:07:50,610
dan pakar dalam semua yang kita lakukan.

172
00:07:50,610 --> 00:07:52,670
Saya menggunakan garis dari filem lama.

173
00:07:52,670 --> 00:07:54,810
>> Hubungan adalah seperti jerung.

174
00:07:54,810 --> 00:07:57,480
Mereka bergerak maju atau mereka mati.

175
00:07:57,480 --> 00:08:01,470
Saya sebenarnya berfikir teknologi
syarikat adalah sama.

176
00:08:01,470 --> 00:08:04,801
>> [AKHIR VIDEO MAIN SEMULA]

177
00:08:04,801 --> 00:08:08,050
DAVID J. MALAN: Jadi kami sangat senang untuk
mengumumkan bahawa Steve akan bergabung dengan kita

178
00:08:08,050 --> 00:08:13,320
di sini di CS50 Rabu depan di
tempat yang biasa dan masa di sini.

179
00:08:13,320 --> 00:08:14,750
Ruang mungkin akan terbatas.

180
00:08:14,750 --> 00:08:19,650
Karena itu, bagi menyertai kami secara langsung, sila
menuju hari ini atau tidak lama selepas itu

181
00:08:19,650 --> 00:08:22,600
untuk cs50.harvard.edu/register.

182
00:08:22,600 --> 00:08:25,780
>> Dan kami akan membuat susulan dengan
Selasa mengesahkan tempat.

183
00:08:25,780 --> 00:08:29,900
Berharap untuk yang seterusnya
Rabu selama kuliah di CS50.

184
00:08:29,900 --> 00:08:33,706
Sekarang, dalam berita yang lain, saya kebetulan
mencari ini dalam The Crimson hanya

185
00:08:33,706 --> 00:08:34,289
hari yang lain.

186
00:08:34,289 --> 00:08:37,370
>> Ternyata salah satu staf CS50 ini
dan sekurang-kurangnya salah seorang pelajar CS50 ini

187
00:08:37,370 --> 00:08:40,299
sedang berjalan untuk UC
Presiden dan Wakil Presiden,

188
00:08:40,299 --> 00:08:42,950
yang membawa saya kembali
ke hari saya sendiri

189
00:08:42,950 --> 00:08:45,920
apabila saya kalah dalam pemilihan UC yang teruk.

190
00:08:45,920 --> 00:08:48,210
Tetapi lapisan perak
dalam yang saya selalu

191
00:08:48,210 --> 00:08:50,604
menceritakan kisah ini ialah bahawa
salah satu yang saya pasti

192
00:08:50,604 --> 00:08:52,770
banyak alasan saya kehilangan
pilihan raya adalah kurang lengkap

193
00:08:52,770 --> 00:08:54,103
dari bakat untuk berbicara di depan umum.

194
00:08:54,103 --> 00:08:56,950
Dan sebagainya cukup jujur, ia
membawa saya, pengalaman yang

195
00:08:56,950 --> 00:09:02,235
Saya rasa tahun pertama saya, untuk benar-benar menandatangani
untuk Harvard Computer Society, yang

196
00:09:02,235 --> 00:09:04,610
adalah kumpulan di kampus yang
memegang pelbagai ceramah teknikal

197
00:09:04,610 --> 00:09:05,318
dan lain-lain.

198
00:09:05,318 --> 00:09:08,117
Dan saya mengambil alih pengajaran mereka
seminar dan oleh itu

199
00:09:08,117 --> 00:09:09,950
mempunyai peluang, yang
peluang yang baik,

200
00:09:09,950 --> 00:09:12,620
untuk mula bekerja pada betul-betul ini.

201
00:09:12,620 --> 00:09:15,000
Tetapi juga, saya mempunyai peluang
selama pengalaman ini

202
00:09:15,000 --> 00:09:16,930
untuk mengajar diri sendiri semua HTML lanjut.

203
00:09:16,930 --> 00:09:21,080
Oleh itu, saya menunda malam tadi oleh
melihat melalui laman web HTML berdasarkan

204
00:09:21,080 --> 00:09:28,066
Saya dibuat dalam seperti tahun 1997, 98, untuk saya
kempen yang kelihatan seperti ini di sini.

205
00:09:28,066 --> 00:09:29,920
Saya tahu.

206
00:09:29,920 --> 00:09:33,340
>> Because-- dan tentu saja, notis
ini keputusan reka bentuk yang luar biasa pada tahun 1998

207
00:09:33,340 --> 00:09:33,850
atau entah apa lagi.

208
00:09:33,850 --> 00:09:36,475
Perkara pertama yang anda ingin pengguna
lakukan setelah melawat laman web anda

209
00:09:36,475 --> 00:09:39,860
adalah perlu klik pautan lain hanya
untuk memasuki laman web anda di sini dengan sami

210
00:09:39,860 --> 00:09:43,940
di belakang tabir seperti diselubungi mana
nampaknya platform kempen saya.

211
00:09:43,940 --> 00:09:46,330
Dan ini adalah semua yang anda akan mendapat
hari ini adalah hanya tangkapan skrin.

212
00:09:46,330 --> 00:09:49,500
Tetapi saya telah membaca, seperti,
poster kempen saya malam tadi

213
00:09:49,500 --> 00:09:50,490
dan platform saya.

214
00:09:50,490 --> 00:09:52,960
>> Dan saya begitu marah pada masa itu.

215
00:09:52,960 --> 00:09:55,380
Platform saya was-- itu menarik.

216
00:09:55,380 --> 00:09:57,730
Jadi saya sudah tenang sejak itu.

217
00:09:57,730 --> 00:10:03,550
Tetapi suatu hari nanti, saya akan berjalan lagi dan
mudah-mudahan lebih baik kali ini.

218
00:10:03,550 --> 00:10:07,265
>> Jadi HTML, bahasa yang di mana saya membuat
yang dalam- anda tidak lama lagi akan membuat banyak more--

219
00:10:07,265 --> 00:10:09,140
adalah sesuatu yang kita sudah
bercakap tentang akhir-akhir ini

220
00:10:09,140 --> 00:10:12,460
dan sebagian besar pengambilan untuk diberikan sekarang
bahawa kami telah berpindah ke bahasa lain.

221
00:10:12,460 --> 00:10:15,650
Tetapi mari kita berhenti sejenak untuk sesaat dan
meletakkan beberapa perkara-perkara ini dalam konteks.

222
00:10:15,650 --> 00:10:18,040
Jadi dalam ayat, apa itu HTML?

223
00:10:18,040 --> 00:10:19,370
>> Atau, apa yang digunakan untuk?

224
00:10:19,370 --> 00:10:20,208
Sesiapa sahaja?

225
00:10:20,208 --> 00:10:20,708
Ya.

226
00:10:20,708 --> 00:10:22,002
>> PENONTON: Markup untuk laman web.

227
00:10:22,002 --> 00:10:23,460
DAVID J. MALAN: Markup untuk laman web.

228
00:10:23,460 --> 00:10:27,100
Jadi itu adalah bahasa markup yang
membolehkan anda menyusun laman web.

229
00:10:27,100 --> 00:10:30,040
Tandukan naik di sini, tajuk
letak di sini, badan diletakkan di sini.

230
00:10:30,040 --> 00:10:33,280
Ini adalah huruf tebal, ini adalah
italics-- semacam terperinci.

231
00:10:33,280 --> 00:10:33,830
>> OK, bagus.

232
00:10:33,830 --> 00:10:37,620
Jadi CSS membolehkan you-- dan saya
mengambil beberapa kebebasan ada

233
00:10:37,620 --> 00:10:40,990
dengan berani menghadap dan huruf condong kerana
yang lebih baik dilaksanakan dengan ini.

234
00:10:40,990 --> 00:10:42,096
CSS is-- apa?

235
00:10:42,096 --> 00:10:42,845
Mengatakan dalam sebuah kalimat.

236
00:10:42,845 --> 00:10:46,000

237
00:10:46,000 --> 00:10:46,720
Sesiapa sahaja sama sekali.

238
00:10:46,720 --> 00:10:46,870
Yeah.

239
00:10:46,870 --> 00:10:49,286
>> PENONTON: hiasan dan
barang-barang, seperti bagaimana untuk merancang itu.

240
00:10:49,286 --> 00:10:51,769

241
00:10:51,769 --> 00:10:52,810
DAVID J. MALAN: OK, baik.

242
00:10:52,810 --> 00:10:55,420
Hiasan yang membolehkan anda
untuk mereka bentuk atau menyesuaikan dgn mode itu

243
00:10:55,420 --> 00:10:59,540
dengan hal-hal seperti huruf tebal dan
huruf condong dan warna dan juga lebih baik

244
00:10:59,540 --> 00:11:01,330
kedudukan berbutir elemen.

245
00:11:01,330 --> 00:11:04,520
Ini semacam membolehkan anda mengambil perkara-perkara yang
last mile supaya jika, misalnya,

246
00:11:04,520 --> 00:11:08,130
di Pset7, anda mungkin akan melihat pada anda
Laman portfolio jika anda pada ketika ini

247
00:11:08,130 --> 00:11:12,270
sudah bahwa meja default yang anda
membuat untuk menunjukkan pegangan saham pengguna

248
00:11:12,270 --> 00:11:15,740
dan wang tunai mungkin kelihatan cukup mengerikan
secara lalai tanpa spasi.

249
00:11:15,740 --> 00:11:18,420
Jenis semuanya dari penuh
bersama-sama dalam baris dan lajur.

250
00:11:18,420 --> 00:11:20,662
>> Nah, dengan sedikit
CSS, kerana anda mungkin sedar,

251
00:11:20,662 --> 00:11:23,870
Anda benar-benar dapat mengubah itu dan menjadikannya
sesuatu yang jauh lebih akrab dan banyak

252
00:11:23,870 --> 00:11:24,870
lebih cantik untuk dilihat.

253
00:11:24,870 --> 00:11:27,730
Jadi CSS adalah tentang
penyesuaian dgn mode dari laman web.

254
00:11:27,730 --> 00:11:31,970
Tetapi kemudian kami memperkenalkan satu lagi
bahasa, PHP, yang membolehkan kita melakukan apa?

255
00:11:31,970 --> 00:11:36,400

256
00:11:36,400 --> 00:11:37,590
>> Mari kita melakukan apa?

257
00:11:37,590 --> 00:11:38,177
Sesiapa sahaja.

258
00:11:38,177 --> 00:11:40,010
Got untuk usaha di luar
pasangan baris pertama.

259
00:11:40,010 --> 00:11:40,260
Yeah.

260
00:11:40,260 --> 00:11:41,719
>> PENONTON: Menghasilkan kandungan dinamik.

261
00:11:41,719 --> 00:11:42,718
DAVID J. MALAN: Perfect.

262
00:11:42,718 --> 00:11:43,850
Menghasilkan kandungan dinamik.

263
00:11:43,850 --> 00:11:45,808
Dan anda boleh melakukan ini dalam
apa-apa bilangan bahasa.

264
00:11:45,808 --> 00:11:50,120
Kami kebetulan menggunakan PHP kerana ia
di bagian sehingga mirip dengan C sintaks.

265
00:11:50,120 --> 00:11:52,000
>> Tapi PHP tidak tepat.

266
00:11:52,000 --> 00:11:54,620
Ia membolehkan anda dinamis menghasilkan output.

267
00:11:54,620 --> 00:11:57,890
Dan beberapa output yang boleh menjadi
HTML, seperti yang kita biasanya lakukan.

268
00:11:57,890 --> 00:12:00,160
Dan ia juga, kerana ia
bahasa pengaturcaraan, adalah

269
00:12:00,160 --> 00:12:03,240
mekanisme melalui mana
kita boleh bercakap kepada pangkalan data.

270
00:12:03,240 --> 00:12:05,730
>> Dan kita boleh membuat pertanyaan kepada
pelayan lain seperti Yahoo

271
00:12:05,730 --> 00:12:08,660
dan pemrograman berbuat apa-apa
benar-benar bahawa anda mungkin sebaliknya

272
00:12:08,660 --> 00:12:10,400
mahu memaksa komputer untuk melakukan.

273
00:12:10,400 --> 00:12:13,580
Jadi PHP membolehkan kita mulakan
dinamik keluaran kandungan.

274
00:12:13,580 --> 00:12:16,900
Jadi dengan logik ini, saya tidak mempunyai
sebuah laman web yang dinamik pada tahun 1998.

275
00:12:16,900 --> 00:12:18,460
>> Itu hanya sebuah laman web statik.

276
00:12:18,460 --> 00:12:22,250
Kandungan saya terpaksa ditukar oleh
manual dengan gedit atau setara.

277
00:12:22,250 --> 00:12:25,290
Tapi PHP adalah apa yang kita digunakan atau
boleh digunakan, bukan,

278
00:12:25,290 --> 00:12:27,260
untuk sesuatu seperti yang
Laman web Frosh IM, yang

279
00:12:27,260 --> 00:12:31,160
sepatutnya mengambil pendaftaran dan
menguruskan senarai perkara-perkara yang users--

280
00:12:31,160 --> 00:12:33,550
sebenarnya berubah dari
masa, walaupun kita berlaku

281
00:12:33,550 --> 00:12:35,990
menggunakan Perl, yang berbeza
bahasa pada masa itu.

282
00:12:35,990 --> 00:12:40,350
>> Kemudian akhir sekali, kami memperkenalkan
SQL-- Structured Query Language.

283
00:12:40,350 --> 00:12:43,845
Jadi belum bahasa lain
yang digunakan untuk apa?

284
00:12:43,845 --> 00:12:46,660

285
00:12:46,660 --> 00:12:47,639
Digunakan untuk apa?

286
00:12:47,639 --> 00:12:49,430
Bolehkah kita usaha slight--
OK, kita tidak akan

287
00:12:49,430 --> 00:12:51,263
untuk mendapatkan lebih jauh
daripada orkestra di sini.

288
00:12:51,263 --> 00:12:53,432
PENONTON: Ini protokol
digunakan untuk bercakap dengan pangkalan data.

289
00:12:53,432 --> 00:12:55,640
DAVID J. MALAN: Protokol
digunakan untuk bercakap dengan pangkalan data.

290
00:12:55,640 --> 00:12:56,181
Biar saya tweak.

291
00:12:56,181 --> 00:12:59,280
Ini adalah bahasa alam yang digunakan
bercakap dengan databases-- memilih

292
00:12:59,280 --> 00:13:01,280
dan menyisipkan dan menghapus
dan kemas kini dan benar-benar

293
00:13:01,280 --> 00:13:03,840
lebih ciri-ciri yang
kita belum pun menyelam

294
00:13:03,840 --> 00:13:07,920
ke dalam tetapi anda mungkin mahu mempunyai explore--
untuk mengeksplorasi, berkata, projek akhir.

295
00:13:07,920 --> 00:13:09,560
Jadi ada berbagai keping.

296
00:13:09,560 --> 00:13:13,100
>> Dan mudah-mudahan Pset7, walaupun
spesifikasinya agak panjang,

297
00:13:13,100 --> 00:13:15,990
itu sengaja lama untuk berjalan anda
melalui bagaimana perkara-perkara ini semua boleh

298
00:13:15,990 --> 00:13:17,210
ditaip bersama-sama.

299
00:13:17,210 --> 00:13:20,300
Sekarang, pada hari Isnin, kita
memperkenalkan bahasa terakhir kami

300
00:13:20,300 --> 00:13:23,430
bahawa kita secara rasmi akan memperkenalkan di
course-- iaitu, JavaScript.

301
00:13:23,430 --> 00:13:25,720
Ini, seperti PHP, adalah
bahasa ditafsirkan.

302
00:13:25,720 --> 00:13:28,110
>> Tetapi perbezaan utama
Saya mencadangkan pada hari Isnin

303
00:13:28,110 --> 00:13:32,730
adalah bahawa manakala PHP adalah melaksanakan atau
ditafsirkan pada pelayan, yang

304
00:13:32,730 --> 00:13:35,990
dalam hal ini adalah perkakas CS50 ini,
atau mungkin ada beberapa web komersial

305
00:13:35,990 --> 00:13:39,370
pelayan di internet,
JavaScript umumnya

306
00:13:39,370 --> 00:13:43,650
adalah bahasa yang berjalan sebelah pelanggan
bukan server side-- sehingga dalam pelayar.

307
00:13:43,650 --> 00:13:46,970
Atau dengan kata lain, sama seperti ketika saya membuka
sehingga Facebook kod sumber dan mendapati semua

308
00:13:46,970 --> 00:13:51,510
file-file Js, implikasinya adalah
bahawa apabila anda melawat Facebook atau paling

309
00:13:51,510 --> 00:13:54,810
laman web hari ini, anda akan mendapat
bukan sahaja HTML, bukan sahaja CSS,

310
00:13:54,810 --> 00:13:59,370
tetapi sejumlah besar JavaScript
kod sering dalam bentuk fail .js.

311
00:13:59,370 --> 00:14:03,970
Dan kemudian itu adalah browser-- anda sendiri
Mac atau PC-- yang melaksanakan kod itu.

312
00:14:03,970 --> 00:14:05,990
>> Tetapi pelayar anda melaksanakannya.

313
00:14:05,990 --> 00:14:08,070
Anda boleh berfikir dalam semacam bak pasir.

314
00:14:08,070 --> 00:14:12,420
Sehingga kod JavaScript tidak boleh
dapat memadam fail pada komputer anda.

315
00:14:12,420 --> 00:14:14,730
Ia tidak akan dapat
menghantar e-mel bagi pihak anda.

316
00:14:14,730 --> 00:14:17,760
Jenis pelayar anda menyekat
apa yang anda boleh lakukan dengan itu.

317
00:14:17,760 --> 00:14:20,630
>> Jadi, dalam hal ini, ia sedikit
kurang kuat, mungkin, dari C.

318
00:14:20,630 --> 00:14:24,030
Tetapi JavaScript boleh, sebagai
samping, digunakan di server,

319
00:14:24,030 --> 00:14:27,740
walaupun kita akan cenderung untuk tidak bercakap
tentang hal itu dalam konteks itu.

320
00:14:27,740 --> 00:14:29,740
Jadi sekarang mari kita mengikat ini bersama-sama.

321
00:14:29,740 --> 00:14:34,000
Seminggu ditambah yang lalu, kami menyampaikan beberapa HTML
pada left-- laman web super membosankan.

322
00:14:34,000 --> 00:14:35,000
>> Hanya menyapa dunia.

323
00:14:35,000 --> 00:14:38,110
Kemudian saya dicadangkan ke atas
hak kita jenis boleh mencuri idea-idea

324
00:14:38,110 --> 00:14:41,470
dari perbincangan kita tentang
struktur data dalam C

325
00:14:41,470 --> 00:14:45,270
dan berfikir tentang bagaimana hierarki ini
bahasa penanda di sebelah kiri

326
00:14:45,270 --> 00:14:49,720
dapat dibuat atau dilaksanakan dalam ingatan
sebagai struktur pokok yang sebenarnya dengan nod

327
00:14:49,720 --> 00:14:51,400
dan petunjuk dan orang-orang jenis butiran.

328
00:14:51,400 --> 00:14:53,820
Di sebelah kanan, kita panggil
bahawa Dokumen DOM--

329
00:14:53,820 --> 00:14:56,800
Objek Model-- yang hanya
cara yang mewah untuk mengatakan pokok.

330
00:14:56,800 --> 00:14:59,520
>> Sekarang, mengapa ini berguna untuk
berfikir dengan cara ini?

331
00:14:59,520 --> 00:15:01,680
Kerana sekarang dengan
JavaScript, kerana kita mempunyai

332
00:15:01,680 --> 00:15:05,810
kod yang mendapat untuk bermain dalam ini
persekitaran, HTML sebenar itu

333
00:15:05,810 --> 00:15:08,360
telah dihantar kepada browser
sudah dan sudah

334
00:15:08,360 --> 00:15:12,690
telah dimuatkan ke dalam ingatan ku
pelayar menjadi pokok dalam komputer anda

335
00:15:12,690 --> 00:15:18,270
RAM seperti ini, kita boleh menggunakan JavaScript
untuk benar-benar melintasi atau berjalan atau carian

336
00:15:18,270 --> 00:15:21,800
atau menukar bahawa pokok DOM namun kami mahu.

337
00:15:21,800 --> 00:15:24,040
Jadi sebenarnya, jika anda berfikir
tentang facebook.com,

338
00:15:24,040 --> 00:15:27,660
jika anda menggunakan ciri perbualan, jika anda
penggunaan Gmail dan ciri gchat itu,

339
00:15:27,660 --> 00:15:30,540
apa-apa jua di mana anda perlu
pesan yang datang sekali lagi dan sekali lagi

340
00:15:30,540 --> 00:15:35,880
dan sekali lagi, mesej-mesej mungkin,
seperti, LI tag, tag Senarai Item, mungkin.

341
00:15:35,880 --> 00:15:37,940
>> Atau mungkin mereka hanya
divs yang terus muncul

342
00:15:37,940 --> 00:15:39,770
setiap kali anda mendapat mesej segera.

343
00:15:39,770 --> 00:15:42,960
Dan sebagainya itu hanya berarti apa
Facebook atau Google lakukan

344
00:15:42,960 --> 00:15:45,200
adalah bila-bila masa anda mendapat
mesej dari server,

345
00:15:45,200 --> 00:15:48,740
mereka mungkin menggunakan JavaScript
hanya menambah node lain

346
00:15:48,740 --> 00:15:52,700
ini tree-- lain nod ini
pokok yang kemudiannya visual hanya kelihatan

347
00:15:52,700 --> 00:15:54,570
seperti baris baru teks pada skrin anda.

348
00:15:54,570 --> 00:15:57,100
Tetapi mereka memasukkan
ke dalam struktur data ini.

349
00:15:57,100 --> 00:15:59,742
>> Jadi dalam kelas seperti
CS124 dan lain-lain, anda akan

350
00:15:59,742 --> 00:16:02,200
benar-benar menulis kod lebih terhadap
struktur data seperti ini.

351
00:16:02,200 --> 00:16:04,310
Tetapi buat masa ini dalam JavaScript,
kita hanya akan menganggap

352
00:16:04,310 --> 00:16:07,920
kita akan mendapat semua fungsi ini
secara percuma dari bahasa itu sendiri.

353
00:16:07,920 --> 00:16:09,210
Jadi mari kita lihat satu contoh.

354
00:16:09,210 --> 00:16:13,120
>> Biar saya membuka fail yang dipanggil form.html.

355
00:16:13,120 --> 00:16:14,601
Ia sangat mudah.

356
00:16:14,601 --> 00:16:15,600
Ia hanya kelihatan seperti ini.

357
00:16:15,600 --> 00:16:17,860
>> Tiada CSS, tiada pemikiran untuk estetika.

358
00:16:17,860 --> 00:16:19,810
Ini semata-mata berfungsi
dan nampaknya saya

359
00:16:19,810 --> 00:16:24,000
meminta e-mel, kata laluan,
kata laluan sekali lagi, dan kemudian cek

360
00:16:24,000 --> 00:16:26,150
bersetuju dengan beberapa terma dan syarat.

361
00:16:26,150 --> 00:16:28,740
Apa kod sumber untuk ini
kelihatan seperti mungkin sesuatu

362
00:16:28,740 --> 00:16:31,030
yang anda sangka dengan
sedikit pemikiran sekarang.

363
00:16:31,030 --> 00:16:32,840
Aku punya tag form di sini.

364
00:16:32,840 --> 00:16:36,190
>> Sesuatu tindakan tampaknya akan
pergi ke fail yang dipanggil login.php.

365
00:16:36,190 --> 00:16:37,870
Kaedah saya akan gunakan adalah mendapatkan.

366
00:16:37,870 --> 00:16:40,880
Dan kemudian saya telah mendapat teks
bidang yang namanya e-mel.

367
00:16:40,880 --> 00:16:43,340
>> Saya telah mendapat satu medan kata laluan
yang namanya kata laluan.

368
00:16:43,340 --> 00:16:45,420
Saya telah mendapat satu lagi
medan kata laluan yang namanya

369
00:16:45,420 --> 00:16:47,342
adalah pengesahan agak sewenang-wenangnya.

370
00:16:47,342 --> 00:16:49,690
Ia hanya satu lagi parameter HTTP.

371
00:16:49,690 --> 00:16:54,430
>> Dan kemudian kita kita sudah tidak digunakan ini kecuali
sejak IM Frosh demo di class--

372
00:16:54,430 --> 00:16:56,692
kotak cek yang
Jenis hanya sama dengan cek.

373
00:16:56,692 --> 00:16:57,900
Dan aku akan memanggil perjanjian itu.

374
00:16:57,900 --> 00:17:00,700
Jadi aku jenis sewenang-wenangnya tetapi
mudah bernama bidang ini.

375
00:17:00,700 --> 00:17:03,450
Sehingga sekarang apabila borang ini mendapat
dikemukakan, mari kita lihat apa yang berlaku.

376
00:17:03,450 --> 00:17:07,290
Jika saya melakukan malan@harvard.edu,
Saya akan melakukan kata laluan merah.

377
00:17:07,290 --> 00:17:09,530
Saya akan melakukan apa-apa kata laluan.

378
00:17:09,530 --> 00:17:10,910
Mari kita tidak bekerjasama.

379
00:17:10,910 --> 00:17:12,280
>> Dan saya tidak akan memeriksa kotak.

380
00:17:12,280 --> 00:17:13,940
Biar saya klik Register.

381
00:17:13,940 --> 00:17:15,420
Dan ia berkata, hm, anda berdaftar.

382
00:17:15,420 --> 00:17:16,069
Tidak juga.

383
00:17:16,069 --> 00:17:17,450
>> Tetapi URL berubah.

384
00:17:17,450 --> 00:17:22,280
Jadi borang ini jelas dibenarkan
untuk mengemukakan kepada login.php.

385
00:17:22,280 --> 00:17:25,160
Tetapi mungkin, saya harus
menangkap beberapa kesalahan tersebut.

386
00:17:25,160 --> 00:17:27,569
Sekarang, dalam Pset7 dan beberapa
contoh kuliah kita,

387
00:17:27,569 --> 00:17:30,130
biasanya kita akan mencetak
mesej ralat berwarna merah yang besar di sini

388
00:17:30,130 --> 00:17:33,760
berkata, nama yang hilang,
atau hilang kata laluan.

389
00:17:33,760 --> 00:17:37,680
Kami telah melakukan itu sebelumnya dan kami telah
dilakukan pihak pelayan pengesanan ralat.

390
00:17:37,680 --> 00:17:41,580
>> Tetapi banyak laman web hari ini
melakukan klien pengesanan ralat sisi

391
00:17:41,580 --> 00:17:42,810
mana URL tidak berubah.

392
00:17:42,810 --> 00:17:44,101
Seluruh halaman tidak refresh.

393
00:17:44,101 --> 00:17:46,940
Anda akan mendapat maklum balas segera
dari browser.

394
00:17:46,940 --> 00:17:48,070
Mungkin sesuatu yang tidak merah.

395
00:17:48,070 --> 00:17:49,190
>> Mungkin anda mendapatkan bentuk pop up.

396
00:17:49,190 --> 00:17:53,240
Tetapi anda jangan buang masa penghantaran untuk
data pelayan yang tidak lengkap.

397
00:17:53,240 --> 00:17:56,050
Jadi mari kita lihat bagaimana kita mungkin
mencapai ciri itu juga.

398
00:17:56,050 --> 00:17:59,660
>> Biar saya pergi ke form1.html,
yang kelihatan sama.

399
00:17:59,660 --> 00:18:03,530
Tetapi jika kali ini saya lakukan
malan@harvard.edu dan saya menaip merah

400
00:18:03,530 --> 00:18:07,350
dan saya tidak bekerjasama lagi
tetapi klik Register, perhatikan sekarang.

401
00:18:07,350 --> 00:18:08,940
Ini bukan penyelesaian yang paling seksi.

402
00:18:08,940 --> 00:18:10,900
Saya telah sekurang-kurangnya menangkap kesalahan ini.

403
00:18:10,900 --> 00:18:12,900
Dan saya telah menggunakan amaran yang
fungsi dalam JavaScript--

404
00:18:12,900 --> 00:18:14,090
yang kita hanya menggunakan di dalam kelas.

405
00:18:14,090 --> 00:18:16,430
Secara umum, anda tidak perlu menggunakan ini
kerana ia sangat cepat boleh keluar

406
00:18:16,430 --> 00:18:17,160
kawalan.

407
00:18:17,160 --> 00:18:19,180
Tetapi kata laluan tidak sepadan merupakan kesalahan.

408
00:18:19,180 --> 00:18:21,120
>> Biar saya pergi ke depan dan klik OK.

409
00:18:21,120 --> 00:18:25,040
Tetapi apa takeaway kunci di sini
ialah URL tidak berubah.

410
00:18:25,040 --> 00:18:27,960
Buang jadi saya tidak peduli
waktu server bertanya itu

411
00:18:27,960 --> 00:18:30,750
soalan yang saya boleh
tahu jawapan kepada diri saya sendiri.

412
00:18:30,750 --> 00:18:33,210
>> Dan pengguna, walaupun
telah bercakap tentang perkara ini

413
00:18:33,210 --> 00:18:35,264
lebih lama daripada pengguna ini
akan berfikir tentang perkara ini,

414
00:18:35,264 --> 00:18:36,680
akan mempunyai maklum balas segera.

415
00:18:36,680 --> 00:18:39,044
Tidak ada latency dengan
penyambungan rangkaian.

416
00:18:39,044 --> 00:18:40,460
Jadi mari kita lihat pada kod sumber ini.

417
00:18:40,460 --> 00:18:45,600
>> Kelihatan Form1.html
strukturnya sama di sini.

418
00:18:45,600 --> 00:18:46,810
Bentuknya yang sebenarnya yang sama.

419
00:18:46,810 --> 00:18:48,330
Tetapi mari kita lihat apa yang saya lakukan di sini.

420
00:18:48,330 --> 00:18:49,913
Dan ada cara yang berbeza untuk melakukan hal ini.

421
00:18:49,913 --> 00:18:53,690
Dan saya telah melakukan perkara yang paling lurus
pengikut, dan bukan cara yang paling elegan lagi.

422
00:18:53,690 --> 00:18:54,869
Saya mempunyai tag script.

423
00:18:54,869 --> 00:18:57,035
Saya kemudian memanggil
document.getElementById ('pendaftaran').

424
00:18:57,035 --> 00:19:00,090

425
00:19:00,090 --> 00:19:04,420
Dan saya menyimpan nilai yang
dalam bentuk, variabel.

426
00:19:04,420 --> 00:19:05,520
>> Jadi apa yang saya lakukan?

427
00:19:05,520 --> 00:19:08,960
Anda boleh memikirkan
document.getElementById sebagai

428
00:19:08,960 --> 00:19:11,200
fungsi khusus yang
JavaScript memberikan anda

429
00:19:11,200 --> 00:19:14,400
yang benar-benar tangan Anda
pointer ke salah satu daripada nod

430
00:19:14,400 --> 00:19:16,520
atau empat persegi panjang di pokok ini.

431
00:19:16,520 --> 00:19:21,470
Jadi sekarang apa bentuk variabel kita
dalam JavaScript sebenarnya menunjuk.

432
00:19:21,470 --> 00:19:25,120
>> Jadi sekarang sintaks yang berbeza daripada
C. Tetapi kita sedang melakukan beberapa perkara di sini.

433
00:19:25,120 --> 00:19:30,360
Satu, yang satu ini adalah sedikit aneh
melihat, pasti berbanding C.

434
00:19:30,360 --> 00:19:32,180
Tapi lihat pada baris 35.

435
00:19:32,180 --> 00:19:35,130
Maka pada form.onsubmit kiri.

436
00:19:35,130 --> 00:19:38,060
Ingat onsubmit yang
seperti bidang dalam struct.

437
00:19:38,060 --> 00:19:41,480
Jika anda berfikir dalam bentuk pembolehubah
hanya menjadi struct C,

438
00:19:41,480 --> 00:19:42,600
ia mungkin mempunyai beberapa bidang.

439
00:19:42,600 --> 00:19:46,410
>> Kembali pada hari, kami mempunyai pelajar nama,
ID, rumah, orang-orang semacam bidang.

440
00:19:46,410 --> 00:19:48,520
Cuba fikirkan onsubmit sebagai bidang yang lain.

441
00:19:48,520 --> 00:19:53,380
Tetapi ia adalah satu bidang khusus kerana
pelayar diprogram untuk mengharapkan

442
00:19:53,380 --> 00:19:57,530
.onsubmit untuk tidak menjadi nilai
seperti nombor atau tali,

443
00:19:57,530 --> 00:20:01,180
tetapi untuk benar-benar menjadi satu majlis
atau alamat fungsi

444
00:20:01,180 --> 00:20:02,570
dalam ingatan komputer.

445
00:20:02,570 --> 00:20:04,740
>> Dan sesungguhnya, itulah yang
kata kunci ini di sini tidak.

446
00:20:04,740 --> 00:20:06,710
Ini mengatakan, berikan aku satu fungsi baru.

447
00:20:06,710 --> 00:20:09,390
Tetapi apa yang namanya
akan menjadi, rupanya?

448
00:20:09,390 --> 00:20:10,800
>> Memikirkan kembali Isnin.

449
00:20:10,800 --> 00:20:13,430

450
00:20:13,430 --> 00:20:17,170
Apakah nama ini
fungsi berdasarkan sintaks ini?

451
00:20:17,170 --> 00:20:19,784
Tidak, maksud saya, ada jelas
tiada nama associated-- pasti

452
00:20:19,784 --> 00:20:21,200
tidak apa yang saya menekankan di sini.

453
00:20:21,200 --> 00:20:22,560
>> Tetapi itu sebenarnya OK.

454
00:20:22,560 --> 00:20:25,840
Ini adalah fungsi tanpa nama, atau
fungsi lambda seperti beberapa mungkin menyebutnya.

455
00:20:25,840 --> 00:20:27,589
Dan itu hanya berarti
ia masih fungsi.

456
00:20:27,589 --> 00:20:29,400
Hanya saja, anda tidak dapat menyebutnya dengan nama.

457
00:20:29,400 --> 00:20:30,057
Tetapi tidak apa-apa.

458
00:20:30,057 --> 00:20:33,140
Kerana sekali lagi, pelayar telah
diprogram oleh syarikat-syarikat seperti Google

459
00:20:33,140 --> 00:20:38,540
atau Microsoft atau Mozilla atau orang lain untuk
hanya tahu bahawa jika medan .onsubmit

460
00:20:38,540 --> 00:20:43,400
dalam elemen bentuk mempunyai
nilai, memperlakukannya sebagai function-- yang

461
00:20:43,400 --> 00:20:44,750
fungsi pointer, jika anda akan.

462
00:20:44,750 --> 00:20:46,910
Dan menyebutnya ketika bentuk itu dikemukakan.

463
00:20:46,910 --> 00:20:50,350
>> Jadi apa kod ini hendaklah dilaksanakan
apabila bentuk itu dikemukakan?

464
00:20:50,350 --> 00:20:52,526
Rupa-rupanya, segala-galanya
dalam brace keriting.

465
00:20:52,526 --> 00:20:53,650
Dan ini hanyalah gaya.

466
00:20:53,650 --> 00:20:55,626
>> Anda boleh melakukan ini seperti
kita cenderung untuk melakukan di CS50.

467
00:20:55,626 --> 00:20:58,250
Tetapi dalam JavaScript, kebanyakan orang
cenderung untuk tetap pada baris yang sama

468
00:20:58,250 --> 00:21:01,960
hanya kerana ia lebih jelas adalah
yang berkaitan dengan fungsi kata kunci.

469
00:21:01,960 --> 00:21:03,240
Jadi sekarang apa yang saya lakukan?

470
00:21:03,240 --> 00:21:08,616
>> Jika form.email.value sama sama dengan
tali yang kosong atau tidak, inilah

471
00:21:08,616 --> 00:21:11,490
peringatan di mana saya akan berkata,
Anda harus menyediakan alamat e-mel anda,

472
00:21:11,490 --> 00:21:12,690
dan kemudian kembali palsu.

473
00:21:12,690 --> 00:21:15,720
Dan itu bahawa pulangan palsu yang
menghalang bentuk dari yang dikemukakan.

474
00:21:15,720 --> 00:21:19,480
Sementara itu, jika nilai kata laluan
kosong, saya akan menjerit pada pengguna

475
00:21:19,480 --> 00:21:21,150
dan berkata, anda mesti memberikan kata laluan.

476
00:21:21,150 --> 00:21:23,700
>> Perkara Sementara itu mendapat
yang sedikit lebih menarik di sini.

477
00:21:23,700 --> 00:21:29,160
Jika form.password.value tidak
form.confirmation.value sama,

478
00:21:29,160 --> 00:21:31,680
bidang yang lain, berteriak pada
pengguna bahawa kata laluan

479
00:21:31,680 --> 00:21:33,860
tidak sesuai kerana mereka
tidak beberapa saat yang lalu.

480
00:21:33,860 --> 00:21:35,780
Dan kemudian satu ini adalah satu
sedikit seksi kerana saya

481
00:21:35,780 --> 00:21:40,470
tahu saya tahu bahawa dari segi konsep
diperiksa adalah nama sebuah kotak semak ini.

482
00:21:40,470 --> 00:21:45,680
>> Jadi saya hanya boleh menggunakan satu tanda seru
titik untuk mengatakan jika cek tidak

483
00:21:45,680 --> 00:21:48,040
checked-- itu Boolean
nilai, benar atau false--

484
00:21:48,040 --> 00:21:49,700
Saya akan menjerit pada pengguna kerana sebab itu.

485
00:21:49,700 --> 00:21:52,300
Jika tidak, jika kita melewati
semua syarat-syarat ini,

486
00:21:52,300 --> 00:21:53,270
mari kita kembali benar.

487
00:21:53,270 --> 00:21:54,700
Mari borang yang dikemukakan.

488
00:21:54,700 --> 00:21:56,560
Dan ini akan berlaku.

489
00:21:56,560 --> 00:21:57,740
>> Mari menaip merah.

490
00:21:57,740 --> 00:22:00,230
Mari kita memeriksa kotak, klik Register.

491
00:22:00,230 --> 00:22:01,979
Dan sekarang aku pergi ke destinasi.

492
00:22:01,979 --> 00:22:03,270
Sekarang, tidak ada pangkalan data di sana.

493
00:22:03,270 --> 00:22:05,370
Tidak ada yang menarik
di login.php.

494
00:22:05,370 --> 00:22:07,980
Aku hanya perlu sesuatu
untuk benar-benar bercakap dengan.

495
00:22:07,980 --> 00:22:09,140
Jadi, saya berhenti seketika, di sini.

496
00:22:09,140 --> 00:22:16,270
Sebarang pertanyaan mengenai apa yang baru saja kita lakukan
atau apa beberapa sintaks baru ini?

497
00:22:16,270 --> 00:22:17,640
OK, ya?

498
00:22:17,640 --> 00:22:20,025
>> PENONTON: Jadi setiap kotak
secara automatik Boolean a.

499
00:22:20,025 --> 00:22:21,650
Anda tidak perlu untuk menyatakan seperti itu.

500
00:22:21,650 --> 00:22:22,649
>> DAVID J. MALAN: Betul.

501
00:22:22,649 --> 00:22:29,340
Mana-mana kotak yang dihantar kepada anda dari
bentuk HTML kod JavaScript anda

502
00:22:29,340 --> 00:22:31,760
akan dianggap, ya, sebagai
Boolean value-- benar atau salah.

503
00:22:31,760 --> 00:22:32,635
Ia satu soalan yang baik.

504
00:22:32,635 --> 00:22:36,080
Manakala nilai-nilai lain, dari
Sudah tentu, telah teks, string AKA.

505
00:22:36,080 --> 00:22:38,500
>> Baiklah, jadi biarlah saya
mundur sedikit lebih jauh.

506
00:22:38,500 --> 00:22:39,900
Apakah seluruh titik ini?

507
00:22:39,900 --> 00:22:41,400
Hanya untuk menjadi jelas.

508
00:22:41,400 --> 00:22:44,940
Seperti, kita sudah tahu, bahkan dari Pset7
dan bahkan dari kuliah minggu lepas

509
00:22:44,940 --> 00:22:51,120
contoh, bahawa kita jelas boleh menyemak
$ _GET $ _POST Melihat jika pengguna memberi kita

510
00:22:51,120 --> 00:22:52,200
nilai kosong.

511
00:22:52,200 --> 00:22:54,400
Ingat fungsi yang kosong dalam PHP.

512
00:22:54,400 --> 00:22:58,040
>> Jadi, untuk menjadi jelas, apa yang
salah satu sebab kami juga mungkin

513
00:22:58,040 --> 00:23:00,535
ingin melakukan pemeriksaan kesalahan ini
dalam browser?

514
00:23:00,535 --> 00:23:03,350

515
00:23:03,350 --> 00:23:06,080
Apa motivasi di sini?

516
00:23:06,080 --> 00:23:06,580
Yeah.

517
00:23:06,580 --> 00:23:09,735
>> PENONTON: Lebih cepat, dan anda tidak
menghantar data yang tidak berguna kepada pelayan.

518
00:23:09,735 --> 00:23:10,610
DAVID J. MALAN: Baik.

519
00:23:10,610 --> 00:23:11,170
Ini lebih cepat.

520
00:23:11,170 --> 00:23:12,920
Anda tidak menghantar tidak berguna
data ke server.

521
00:23:12,920 --> 00:23:14,670
>> Jadi anda kembali yang lebih
tindak balas serta-merta.

522
00:23:14,670 --> 00:23:16,560
Dan secara keseluruhan, pengguna
pengalaman adalah lebih baik.

523
00:23:16,560 --> 00:23:17,900
Fikirkan tentang alternatif.

524
00:23:17,900 --> 00:23:21,160
>> Jika untuk Gmail-- dan
mana-mana yang bertahun-tahun yang lalu.

525
00:23:21,160 --> 00:23:24,160
Katakan anda mendapat e-mel baru Gmail anda
akaun, tetapi satu-satunya jalan melalui

526
00:23:24,160 --> 00:23:26,510
untuk melihat bahawa adalah untuk, seperti,
menambah nilai keseluruhan halaman.

527
00:23:26,510 --> 00:23:29,030
Atau kira anda klik pada
link untuk membaca e-mel.

528
00:23:29,030 --> 00:23:31,600
>> Semuanya mempunyai untuk memuat semula jadi
bahawa anda boleh melihat e-mel.

529
00:23:31,600 --> 00:23:33,380
Atau Facebook-- anda mendapat mesej chat.

530
00:23:33,380 --> 00:23:36,000
Anda tidak melihatnya sehingga anda tambah nilai
halaman atau klik link tertentu.

531
00:23:36,000 --> 00:23:38,380
>> Seperti, ini akan menjadi sangat
pengalaman pengganggu itu.

532
00:23:38,380 --> 00:23:41,300
Dan ini adalah apa yang ia adalah seperti,
jelas, kembali apabila saya berlari untuk UC

533
00:23:41,300 --> 00:23:44,760
dan web adalah lebih kurang dinamik
dan JavaScript tidak seperti yang dipopulerkan

534
00:23:44,760 --> 00:23:45,601
seperti sekarang.

535
00:23:45,601 --> 00:23:47,850
Dan hal-hal semakin jauh
lebih dinamik dan banyak lagi

536
00:23:47,850 --> 00:23:49,900
pihak pelanggan dalam erti kata itu.

537
00:23:49,900 --> 00:23:54,370
>> Tetapi ada tangkapan di sini, dan
ini adalah jenis gotcha menjengkelkan.

538
00:23:54,370 --> 00:23:58,720
Hanya kerana anda menambah sisi klien
pengesanan seperti ini tidak bermakna

539
00:23:58,720 --> 00:24:01,430
anda boleh atau harus meninggalkan
pelayan pengesanan sampingan.

540
00:24:01,430 --> 00:24:04,080
Anda pada dasarnya mahu meletakkan anda
kesalahan memeriksa di kedua-dua tempat.

541
00:24:04,080 --> 00:24:05,830
Oleh kerana apa yang salah
pelajaran yang dipelajari

542
00:24:05,830 --> 00:24:10,270
dari artikel saya membaca beberapa petikan
dari dengan ini CMS system-- bodoh

543
00:24:10,270 --> 00:24:14,410
Pengurusan System-- kandungan yang
melaksanakan sistem pengesahan yang,

544
00:24:14,410 --> 00:24:16,790
log masuk melalui apa mekanisme?

545
00:24:16,790 --> 00:24:19,515

546
00:24:19,515 --> 00:24:20,469
JavaScript.

547
00:24:20,469 --> 00:24:21,499
>> PENONTON: JavaScript.

548
00:24:21,499 --> 00:24:23,290
DAVID J. MALAN:
JavaScript, betul-betul, bukan?

549
00:24:23,290 --> 00:24:24,610
Ia telah menggunakan JavaScript.

550
00:24:24,610 --> 00:24:27,120
Dan benar-benar, kalian punya
memainkan sedikit mungkin

551
00:24:27,120 --> 00:24:28,700
dengan Inspektor Chrome.

552
00:24:28,700 --> 00:24:30,890
Dan jika saya boleh merasa, memeriksa elemen.

553
00:24:30,890 --> 00:24:33,670
>> Izinkanlah aku menyeberang untuk melakukan
semua pilihan Chrome.

554
00:24:33,670 --> 00:24:37,080
Dan ini adalah bagaimana mudahnya untuk
melumpuhkan JavaScript dalam penyemak imbas.

555
00:24:37,080 --> 00:24:38,950
Semak, tidak lebih JavaScript.

556
00:24:38,950 --> 00:24:41,070
>> Jadi dalam keadilan, banyak
dari web ini

557
00:24:41,070 --> 00:24:43,430
hanya akan pecah kerana
Gmail dan sites-- lain

558
00:24:43,430 --> 00:24:46,140
Facebook-- menganggap bahawa
JavaScript yang aktif.

559
00:24:46,140 --> 00:24:50,180
Tetapi jika anda sedang melakukan sesuatu yang bodoh
seperti hanya mengesahkan input pengguna

560
00:24:50,180 --> 00:24:52,520
dan memeriksa untuk
kesalahan di pihak pelanggan,

561
00:24:52,520 --> 00:24:54,940
musuh dengan mudah boleh melakukan ini.

562
00:24:54,940 --> 00:24:57,180
Dan kemudian bahkan lebih bijak
musuh seperti kalian

563
00:24:57,180 --> 00:25:01,120
kini boleh menggunakan Telnet atau Curl
atau perintah baris arahan hanya

564
00:25:01,120 --> 00:25:05,300
dan benar-benar menghantar mesej ke pelayan
yang sama tidak kesesatan diperiksa.

565
00:25:05,300 --> 00:25:08,380
>> Jadi, ini adalah lebih dari
antara muka pengguna keputusan

566
00:25:08,380 --> 00:25:13,060
daripada itu adalah teknikal yang sebenarnya
improvement-- melaksanakan

567
00:25:13,060 --> 00:25:14,410
sisi sesuatu pelanggan seperti ini.

568
00:25:14,410 --> 00:25:16,800
Jadi sekarang sekilas, tetapi kemudian
Saya akan tunduk kepada berjalan kaki dalam talian

569
00:25:16,800 --> 00:25:17,674
melalui untuk yang satu ini.

570
00:25:17,674 --> 00:25:21,480
Dalam bentuk kedua, kita sebenarnya telah melalui
dan dibersihkan kod sedikit.

571
00:25:21,480 --> 00:25:23,650
Tetapi saya menangguhkan kepada satu
dari video yang kami akan kemungkinan

572
00:25:23,650 --> 00:25:27,970
embed di Pset8 yang hanya menunjukkan anda
sintaksis yang sama dengan menggunakan perpustakaan yang dikenali sebagai

573
00:25:27,970 --> 00:25:32,320
jQuery, yang merupakan super, super
perpustakaan popular di JavaScript

574
00:25:32,320 --> 00:25:34,510
yang terus terang kebanyakan orang
hanya menggunakan hari ini

575
00:25:34,510 --> 00:25:37,070
malah mengelirukan sebagai
makhluk JavaScript sendiri.

576
00:25:37,070 --> 00:25:38,950
>> Dan ia cenderung untuk melibatkan
beberapa tanda-tanda dolar

577
00:25:38,950 --> 00:25:41,350
dan kata kunci seperti dokumen
dalam kurungan di sini.

578
00:25:41,350 --> 00:25:44,480
Tetapi sekali lagi, biarlah saya tunduk kepada
beberapa tutorial perlahan talian

579
00:25:44,480 --> 00:25:46,750
daripada mendapatkan diikat hanya dalam sintaks.

580
00:25:46,750 --> 00:25:48,630
Mari kita beralih kepada
sesuatu yang sedikit lebih dingin

581
00:25:48,630 --> 00:25:50,520
dari segi aplikasi ini.

582
00:25:50,520 --> 00:25:57,730
>> Jadi, dalam tertentu, biarkan aku pergi
ke depan dan membuka ini di sini.

583
00:25:57,730 --> 00:25:58,340
Datang pada.

584
00:25:58,340 --> 00:25:59,380
Di sana kami pergi.

585
00:25:59,380 --> 00:26:01,500
>> Biar saya membuka gambar ini di sini.

586
00:26:01,500 --> 00:26:03,450
Tidak perlu rumit
mencari, tetapi ia

587
00:26:03,450 --> 00:26:07,880
menerangkan teknik yang dipanggil AJAX--
Asynchronous JavaScript and XML, di mana

588
00:26:07,880 --> 00:26:10,530
X untuk XML sebenarnya
tidak lagi benar-benar digunakan.

589
00:26:10,530 --> 00:26:13,430
Ia cenderung menggunakan sesuatu
lain disebut JSON.

590
00:26:13,430 --> 00:26:16,560
>> Tetapi di sini adalah bagaimana sesuatu seperti
Peta Google atau Google Earth berfungsi.

591
00:26:16,560 --> 00:26:18,060
Mari kita cuba ini dengan cepat, sebenarnya.

592
00:26:18,060 --> 00:26:21,590
Biar saya pergi ke hadapan dan membuka
Chrome pada pelayar saya.

593
00:26:21,590 --> 00:26:26,236
>> Dan biarkan aku masuk ke dalam,
berkata, maps.google.com.

594
00:26:26,236 --> 00:26:29,260

595
00:26:29,260 --> 00:26:31,930
Dan sebenarnya, jika anda sudah tua
cukup untuk ingat apa,

596
00:26:31,930 --> 00:26:35,600
seperti, MapQuest seperti kembali pada hari itu,
dan mungkin mereka masih bekerja seperti ini.

597
00:26:35,600 --> 00:26:38,870
Apabila anda digunakan untuk mencari something--
33 Oxford Street, Cambridge, Mass,

598
00:26:38,870 --> 00:26:40,650
mari kita lakukan this-- anda
akan benar-benar, jika anda

599
00:26:40,650 --> 00:26:43,000
ingin menyorot ke atas dan
bawah, kiri dan kanan,

600
00:26:43,000 --> 00:26:44,920
Anda akan kelihatan seperti
panah besar di atas, dan ia

601
00:26:44,920 --> 00:26:46,921
akan menunjukkan satu lagi
bingkai peta di sini.

602
00:26:46,921 --> 00:26:49,753
Atau anda akan klik kiri dan anda
akan pergi ke sini, atau klik lain

603
00:26:49,753 --> 00:26:51,000
dan anda akan pergi ke sini.

604
00:26:51,000 --> 00:26:53,000
Tetapi sebaliknya
hari, kami sudah tentu hanya

605
00:26:53,000 --> 00:26:55,970
mengambil untuk diberikan bahawa kita boleh pergi
sekitar Cambridge cukup cepat

606
00:26:55,970 --> 00:26:57,550
hanya dengan mengklik dan menyeret.

607
00:26:57,550 --> 00:26:59,130
Tetapi perhatikan ada beberapa gangguan.

608
00:26:59,130 --> 00:27:02,160
>> Jika saya melakukan ini cukup pantas,
apa yang seolah-olah akan berlaku

609
00:27:02,160 --> 00:27:05,960
seperti yang saya tarik sedikit terlalu cepat
untuk komputer untuk bersaing?

610
00:27:05,960 --> 00:27:07,160
Apa yang anda lihat?

611
00:27:07,160 --> 00:27:07,660
Yeah.

612
00:27:07,660 --> 00:27:09,232
>> PENONTON: Pixel jangan me-refresh.

613
00:27:09,232 --> 00:27:10,940
DAVID J. MALAN: The
piksel jangan me-refresh.

614
00:27:10,940 --> 00:27:12,870
Ada actually-- dan anda
dapat melihat ini, sebenarnya,

615
00:27:12,870 --> 00:27:15,360
jika anda sedang menonton dalam talian dan jeda
ini atau sebenarnya melambatkan perkara turun

616
00:27:15,360 --> 00:27:18,600
untuk once-- Anda akan melihat bahawa terdapat
jubin, empat segi, atau empat persegi panjang yang

617
00:27:18,600 --> 00:27:22,040
hilang dari peta sampai
sedetik kemudian, lebih banyak data,

618
00:27:22,040 --> 00:27:24,390
lebih banyak gambar sebenarnya
muncul pada skrin.

619
00:27:24,390 --> 00:27:29,810
Dan sebenarnya, jika kita melakukan ini dengan melihat
sehingga Chrome's-- katakanlah, Chrome--

620
00:27:29,810 --> 00:27:30,310
mari kita lihat.

621
00:27:30,310 --> 00:27:31,090
Kita tidak boleh melakukan itu.

622
00:27:31,090 --> 00:27:31,860
>> Oh, ups.

623
00:27:31,860 --> 00:27:34,761
Mari kita membuka maps.google.com.

624
00:27:34,761 --> 00:27:36,660
Biarkan saya membuat tetingkap yang lebih besar lagi.

625
00:27:36,660 --> 00:27:38,836
>> Kembali kepada 33 Oxford Street.

626
00:27:38,836 --> 00:27:42,010

627
00:27:42,010 --> 00:27:43,760
Apakah laman web saya pada baru-baru ini?

628
00:27:43,760 --> 00:27:46,440
Saya mempunyai ini, seperti, kata-kata kasar swasta untuk
diri saya sendiri bahawa saya akan mesej kemudian segera

629
00:27:46,440 --> 00:27:48,470
kawan yang online
yang mahu mendengarnya.

630
00:27:48,470 --> 00:27:49,345
Ada beberapa laman web.

631
00:27:49,345 --> 00:27:52,680
Saya rasa ia Comcast-- jadi
ISP Amerika yang sangat besar.

632
00:27:52,680 --> 00:27:56,355
Anda boleh, apabila mendaftar untuk kabel baru
perkhidmatan modem atau perkhidmatan TV kabel,

633
00:27:56,355 --> 00:27:59,230
mereka mempunyai bentuk yang sangat cukup
di mana mereka meminta anda untuk alamat anda.

634
00:27:59,230 --> 00:28:01,450
Dan mempunyai menakjubkan ini
fitur yang disebut auto lengkap,

635
00:28:01,450 --> 00:28:04,600
seperti Google, yang bermula untuk mengisi
dalam jawapan kepada soalan anda.

636
00:28:04,600 --> 00:28:08,090
>> Masalahnya ialah, mereka melakukan auto lengkap
pada hal-hal pertama yang anda taip.

637
00:28:08,090 --> 00:28:12,890
Jadi, jika anda mula menaip dalam 33, ia
akan menunjukkan kepada anda benar-benar setiap rumah

638
00:28:12,890 --> 00:28:15,790
di Amerika yang bermula
dengan bilangan 33

639
00:28:15,790 --> 00:28:17,920
sebelum anda
mengharapkan anda untuk menaip lagi.

640
00:28:17,920 --> 00:28:20,660
Jadi jika anda menaip 33 Oxford,
maka hal itu menunjukkan anda setiap jalan

641
00:28:20,660 --> 00:28:24,726
di Amerika yang mempunyai 33 Oxford pada
namanya, tanpa mengira bandar

642
00:28:24,726 --> 00:28:25,350
bahawa anda berada dalam.

643
00:28:25,350 --> 00:28:26,320
>> Dan kemudian anda terus menaip.

644
00:28:26,320 --> 00:28:28,930
Dan akhirnya, ia menyadari bahwa mereka tidak
tawaran perkhidmatan ke rumah anda di Cambridge

645
00:28:28,930 --> 00:28:29,920
atau sesuatu seperti itu.

646
00:28:29,920 --> 00:28:33,410
Tapi yang penting, ini adalah yang paling
pelaksanaan bodoh auto

647
00:28:33,410 --> 00:28:34,140
menyelesaikan lamanya.

648
00:28:34,140 --> 00:28:36,400
>> Dan saya hanya pergi
pada tangen ini lagi.

649
00:28:36,400 --> 00:28:39,040
Tapi ada cara yang baik untuk
menggunakan JavaScript dan cara-cara yang tidak baik.

650
00:28:39,040 --> 00:28:40,750
Dan itu bukan semestinya yang terbaik.

651
00:28:40,750 --> 00:28:46,360
>> Tapi yang penting di sini, sebelum ini
omelan, adalah untuk membuka alat turun di sini

652
00:28:46,360 --> 00:28:49,480
dan membuka alat pemaju,
seperti yang kita telah digalakkan sebelumnya,

653
00:28:49,480 --> 00:28:52,840
dan untuk menonton Rangkaian
tab kerana saya benar-benar klik dengan cepat.

654
00:28:52,840 --> 00:28:55,400
Dan perhatikan sejumlah
dari mendapatkan permintaan berlaku.

655
00:28:55,400 --> 00:28:57,310
Semua ini berlaku kerana saya diseret.

656
00:28:57,310 --> 00:29:00,170
>> Dan kemungkinan besar, memang
banyak baris ini

657
00:29:00,170 --> 00:29:04,060
sekarang adalah imej slash JPEG
Jenis MIME atau jenis kandungan.

658
00:29:04,060 --> 00:29:07,750
Ini kerana apa yang krom adalah melakukan
setiap kali saya klik dan seret, klik

659
00:29:07,750 --> 00:29:11,650
dan tarik, adalah itu menyedari, oh, saya
perlu pergi meminta Google untuk jubin

660
00:29:11,650 --> 00:29:15,080
di peta itu di sini,
cepat turun melalui HTTP,

661
00:29:15,080 --> 00:29:19,550
dan kemudian menambah kepada apa yang dipanggil DOM
untuk pelayar web yang di pohon memori

662
00:29:19,550 --> 00:29:24,430
perwakilan supaya pengguna,
saya, melihat bahawa jubin dikemaskini.

663
00:29:24,430 --> 00:29:26,795
Dan ini adalah kerana
teknik yang disebut AJAX.

664
00:29:26,795 --> 00:29:28,920
Kembali pada hari itu, ia benar-benar
adalah kes bahawa jika anda

665
00:29:28,920 --> 00:29:33,050
ingin mengubah apa yang pada skrin,
Anda akan perlu klik ke atas, bawah, kiri,

666
00:29:33,050 --> 00:29:33,550
betul.

667
00:29:33,550 --> 00:29:34,740
Dan kemudian muka surat yang baru akan dibuka.

668
00:29:34,740 --> 00:29:36,531
Tetapi hari ini, segala-galanya
lebih dinamik.

669
00:29:36,531 --> 00:29:40,490
Ia berlaku dalam cara kita manusia akan
berharap ia akan benar-benar interaktif.

670
00:29:40,490 --> 00:29:43,210
Dan ia mencapai ini dengan
cara teknik yang dipanggil

671
00:29:43,210 --> 00:29:46,170
AJAX, yang mungkin paling
dijelaskan oleh satu contoh.

672
00:29:46,170 --> 00:29:49,730
Pertama, saya pergi ke depan
dan membuka fail

673
00:29:49,730 --> 00:29:53,540
disebut quote.php di
kod pengedaran hari ini.

674
00:29:53,540 --> 00:29:56,200
>> Dan kemudian membiarkan saya melakukan ups symbol--.

675
00:29:56,200 --> 00:30:02,399
Biarkan aku melakukan simbol = GOOG
hanya beberapa saham.

676
00:30:02,399 --> 00:30:04,440
Atau sebenarnya, mari kita lakukan
satu dari Serangga PERCUMA.

677
00:30:04,440 --> 00:30:05,270
Enter.

678
00:30:05,270 --> 00:30:06,580
>> Dan kini melihat apa yang saya peroleh kembali.

679
00:30:06,580 --> 00:30:09,210
Jadi, ini adalah benar-benar
file PHP pendek yang saya

680
00:30:09,210 --> 00:30:13,210
menulis bahawa hanya meminjam kod
daripada fungsi lookup Pset7 ini

681
00:30:13,210 --> 00:30:17,830
dan meludah keluar menggunakan pendakap kerinting ini dan
sebut harga dan notasi usus besar, nampaknya,

682
00:30:17,830 --> 00:30:22,747
harga saham semasa untuk
syarikat yang anda berikan melalui dapatkan.

683
00:30:22,747 --> 00:30:24,580
Jadi, ini adalah berbeza
dari sebagian apa yang kita sudah

684
00:30:24,580 --> 00:30:26,496
dilakukan di dalam pemberitahuan saya
harfiah menyemburkan

685
00:30:26,496 --> 00:30:27,870
apa yang kelihatan seperti kod JavaScript.

686
00:30:27,870 --> 00:30:30,020
>> Malah, ini adalah objek JavaScript.

687
00:30:30,020 --> 00:30:34,130
Malah, hanya untuk lebih jelas,
JavaScript Objek Notation-- JSON--

688
00:30:34,130 --> 00:30:38,330
adalah cara mewah untuk mengatakan bahawa anda
boleh mewakili data dalam JavaScript banyak

689
00:30:38,330 --> 00:30:41,660
seperti yang anda boleh dalam PHP
menggunakan pasangan nilai utama.

690
00:30:41,660 --> 00:30:44,270
Jadi jika saya ingin menyatakan
pembolehubah dalam JavaScript

691
00:30:44,270 --> 00:30:47,872
untuk mewakili Zamyla, untuk
instance-- struct untuk Zamyla--

692
00:30:47,872 --> 00:30:49,580
dan kami akan menyebutnya
pelajar, variabel ini.

693
00:30:49,580 --> 00:30:53,060
ID nya adalah satu, rumah adalah
Winthrop, dan nama adalah Zamyla.

694
00:30:53,060 --> 00:30:55,490
>> Tetapi saya juga boleh mempunyai pelbagai objek.

695
00:30:55,490 --> 00:30:58,710
Jadi jika saya benar-benar ingin mempunyai
array dalam JavaScript mengandungi

696
00:30:58,710 --> 00:31:01,740
beberapa objek seperti itu, ini
masa yang mewakili kakitangan,

697
00:31:01,740 --> 00:31:04,910
Saya mungkin mempunyai ketiga-tiga
potongan kod kembali

698
00:31:04,910 --> 00:31:08,560
untuk kembali ke belakang untuk ini
tiga bekas kakitangan.

699
00:31:08,560 --> 00:31:12,201
Jadi sintaks, cukup
sama dengan both-- untuk PHP.

700
00:31:12,201 --> 00:31:13,700
Tetapi ini adalah terutamanya JavaScript.

701
00:31:13,700 --> 00:31:15,940
Ini notasi objek.

702
00:31:15,940 --> 00:31:17,240
Jadi apa ini berguna untuk?

703
00:31:17,240 --> 00:31:21,580
>> Jika saya menulis kod yang meludah JSON--
JavaScript Objek Notation-- hal-hal yang

704
00:31:21,580 --> 00:31:24,670
kelihatan seperti ini atau hal-hal yang
kelihatan seperti struktur Zamyla ini,

705
00:31:24,670 --> 00:31:27,730
Saya benar-benar boleh menggunakan ini
dalam program-program yang saya tulis.

706
00:31:27,730 --> 00:31:30,660
Biar saya pergi ke ajax0.html.

707
00:31:30,660 --> 00:31:33,310
Dan ini too-- tidak banyak
pikir diberikan kepada estetika.

708
00:31:33,310 --> 00:31:34,660
Tetapi berhati-apa yang berlaku.

709
00:31:34,660 --> 00:31:37,050
>> Biar saya pergi ke hadapan dan ketik percuma di sini.

710
00:31:37,050 --> 00:31:38,490
Klik mendapatkan penawaran.

711
00:31:38,490 --> 00:31:41,060
Dan perhatikan URL tidak berubah.

712
00:31:41,060 --> 00:31:47,250
Tapi aku mendapatkan pop up dengan rupanya
harga saham sen hari ini sebanyak $ 0,15.

713
00:31:47,250 --> 00:31:49,062
Jadi tidak semua yang buruk.

714
00:31:49,062 --> 00:31:52,020
Tetapi perbezaannya adalah bahawa entah bagaimana,
data ini kembali kepada saya secara langsung.

715
00:31:52,020 --> 00:31:54,250
Tapi mari kita mengambil satu langkah ke arah
sesuatu yang lebih akrab.

716
00:31:54,250 --> 00:31:58,900
Dalam versi salah satu daripada ini, izinkan saya
menaip bebas lagi, klik Dapatkan sebut harga,

717
00:31:58,900 --> 00:32:01,146
dan sekarang-- oh, ini adalah
sebenarnya versi jQuery ini.

718
00:32:01,146 --> 00:32:03,270
Jadi mari me-- saya tidak
maju cepat-agak cukup jauh.

719
00:32:03,270 --> 00:32:05,830
Biar saya pergi ke versi dua,
yang mana saya mahu.

720
00:32:05,830 --> 00:32:07,260
Perhatikan apa yang saya lakukan di sini.

721
00:32:07,260 --> 00:32:10,370
Saya mempunyai web yang page-- super
versi sederhana dari mana-mana halaman web

722
00:32:10,370 --> 00:32:14,260
Anda mungkin menggunakan hari ini dengan medan teks
di sini secara percuma dan kemudian ternyata hanya

723
00:32:14,260 --> 00:32:14,880
teks.

724
00:32:14,880 --> 00:32:16,860
>> Ini bukan bentuk yang di sini, rupanya.

725
00:32:16,860 --> 00:32:19,360
Tetapi jika saya klik mendapatkan
kutipan, melihat laman web saya

726
00:32:19,360 --> 00:32:22,760
akan berubah seolah-olah saya
hanya mendapat mesej segera baru

727
00:32:22,760 --> 00:32:25,360
atau seolah-olah saya baru pindah itu
peta dan diperlukan untuk mendapatkan lebih banyak data

728
00:32:25,360 --> 00:32:29,220
ditambah secara dinamik ke laman web
tanpa perubahan URL dan pengguna

729
00:32:29,220 --> 00:32:30,980
pengalaman mendapatkan terganggu.

730
00:32:30,980 --> 00:32:35,750
Malah, saya masih di
tepat ajax2.html place-- sama.

731
00:32:35,750 --> 00:32:39,080
>> Jadi mari kita lihat hanya pada contoh ini
dan melihat bagaimana ini terjadi.

732
00:32:39,080 --> 00:32:42,490
Biar saya pergi ke ajax2.html.

733
00:32:42,490 --> 00:32:44,770
Dan perhatikan bentuk yang pertama.

734
00:32:44,770 --> 00:32:47,092
>> Di sini, aku akan
off auto lengkap.

735
00:32:47,092 --> 00:32:48,800
Kadang-kadang ia menjadi
mengganggu jika browser

736
00:32:48,800 --> 00:32:50,508
sedang cuba untuk menunjukkan
seluruh sejarah anda.

737
00:32:50,508 --> 00:32:53,450
Jadi, anda boleh melakukannya dalam HTML oleh
hanya mengatakan auto menyelesaikan off.

738
00:32:53,450 --> 00:32:57,290
>> Saya telah diberikan ini teks bidang yang
symbol-- sebaliknya, ID simbol.

739
00:32:57,290 --> 00:32:58,977
Dan sekarang, ini adalah satu ciri yang menarik.

740
00:32:58,977 --> 00:33:01,310
Kami tidak bercakap tentang span,
tetapi anda boleh berfikir tentang hal itu

741
00:33:01,310 --> 00:33:03,177
seperti tag perenggan atau tag div.

742
00:33:03,177 --> 00:33:05,010
Ia adalah apa yang disebut
dalam talian unsur, yang

743
00:33:05,010 --> 00:33:07,415
ertinya anda tidak akan mendapatkan ayat yang
break di atas dan di bawahnya.

744
00:33:07,415 --> 00:33:11,530
Ia hanya akan tinggal dalam talian tanpa
memukul setara masuk.

745
00:33:11,530 --> 00:33:17,980
Jadi saya telah diberi potongan HTML ini
yang akan ditentukan pengecam unik

746
00:33:17,980 --> 00:33:20,130
yang saya sewenang-wenangnya disebut harga.

747
00:33:20,130 --> 00:33:21,560
Dan saya mempunyai butang Submit.

748
00:33:21,560 --> 00:33:25,420
>> Kerana kini sehingga sini-dan ini adalah
sebenarnya super menakjubkan kod betapa sedikit

749
00:33:25,420 --> 00:33:27,660
anda boleh menulis untuk melakukan
agak kemas things--

750
00:33:27,660 --> 00:33:31,800
melihat apa yang saya lakukan di sini jika saya
tatal ke atas kepada ketua halaman ini.

751
00:33:31,800 --> 00:33:34,970
Saya telah menyertakan pertama di
kepala saya tag script

752
00:33:34,970 --> 00:33:37,410
yang benar-benar referensi
JavaScript memfailkan di tempat lain.

753
00:33:37,410 --> 00:33:39,702
Ini dari organisasi
yang menulis jQuery,

754
00:33:39,702 --> 00:33:42,660
dan ini hanya memberi anda terkini
versi perpustakaan jQuery mereka.

755
00:33:42,660 --> 00:33:46,305
>> Jadi ini adalah jenis seperti tajam
termasuk dalam C atau memerlukan dalam PHP.

756
00:33:46,305 --> 00:33:48,900
Anda menggunakan tag skrip
dengan atribut sumber.

757
00:33:48,900 --> 00:33:52,030
Tetapi sekarang kode sendiri adalah
akan menjadi betul-betul di sini.

758
00:33:52,030 --> 00:33:54,170
>> Perhatikan Aku mempunyai fungsi yang disebut Quotes.

759
00:33:54,170 --> 00:33:56,180
Dan ia kelihatan sedikit
samar pada pandangan pertama.

760
00:33:56,180 --> 00:33:57,305
Tetapi mari kita menggoda ini terpisah.

761
00:33:57,305 --> 00:33:59,090
Beri aku URL variabel yang disebut.

762
00:33:59,090 --> 00:34:01,390
Menetapkan secara harfiah string ini.

763
00:34:01,390 --> 00:34:04,530
Jadi, tanda petikan tunggal, tanda kutip ganda dalam
JavaScript hanya memberi saya string.

764
00:34:04,530 --> 00:34:06,900
Apa yang ditambah itu?

765
00:34:06,900 --> 00:34:08,199
Rangkaian.

766
00:34:08,199 --> 00:34:12,610
>> Jadi ini sekarang adalah sintaks yang jQuery
yang mengambil sedikit untuk membiasakan diri.

767
00:34:12,610 --> 00:34:18,310
Tetapi ini hanya berarti pergi mendapatkan saya DOM
nod yang unik pengecam adalah simbol.

768
00:34:18,310 --> 00:34:21,929
Hashtag ada ertinya
simbol pengenalan unik.

769
00:34:21,929 --> 00:34:24,929
>> Tanda dolar dalam
kurungan hanya berarti, bungkus ini

770
00:34:24,929 --> 00:34:28,510
di jQuery semacam sos rahsia jadi
Anda mendapatkan fungsi tambahan.

771
00:34:28,510 --> 00:34:31,880
Dan kemudian .val nampaknya
fungsi, atau seperti yang kita katakan sekarang,

772
00:34:31,880 --> 00:34:35,219
kaedah dalam buku ini
yang hanya memberikan anda nilai.

773
00:34:35,219 --> 00:34:38,896
Jadi singkatnya, jelek dan mengelirukan
kerana ini kelihatan pada pandangan pertama,

774
00:34:38,896 --> 00:34:42,020
ini hanya berarti mendapatkan dengan pengguna ditaip
dalam, meletakkan ia pada akhir tali

775
00:34:42,020 --> 00:34:42,880
dengan menggabungkan ia.

776
00:34:42,880 --> 00:34:43,739
Itu sahaja.

777
00:34:43,739 --> 00:34:46,070
>> Jadi sekarang, tiga baris terakhir.

778
00:34:46,070 --> 00:34:48,690
Anda boleh memerah banyak
fungsi daripada tiga baris.

779
00:34:48,690 --> 00:34:52,199
Ini tanda dolar, sebagai
samping, hanya nama panggilan

780
00:34:52,199 --> 00:34:55,800
untuk satu pemboleh ubah global khas
disebut secara literal jQuery.

781
00:34:55,800 --> 00:34:57,060
>> Tanda dolar hanya kelihatan sejuk.

782
00:34:57,060 --> 00:35:00,080
Jadi masyarakat jQuery hanya jenis
dari menggunakannya sebagai simbol khusus mereka.

783
00:35:00,080 --> 00:35:02,470
Ia tidak bermakna apa artinya dalam PHP.

784
00:35:02,470 --> 00:35:06,356
Dalam JavaScript, tanda dolar adalah
sama seperti huruf abjad

785
00:35:06,356 --> 00:35:07,480
atau nombor bagi variabel.

786
00:35:07,480 --> 00:35:09,000
>> Anda hanya boleh memiliki sebagai nama.

787
00:35:09,000 --> 00:35:09,770
Hanya kelihatan sejuk.

788
00:35:09,770 --> 00:35:11,890
Jadi masyarakat
diterima pakai sebagai nama panggilan

789
00:35:11,890 --> 00:35:13,390
untuk perpustakaan mereka sendiri dipanggil jQuery.

790
00:35:13,390 --> 00:35:15,060
>> Dan ini sangat popular.

791
00:35:15,060 --> 00:35:17,620
Oleh itu JSON adalah yang tepat.

792
00:35:17,620 --> 00:35:19,920
Ini fungsi bahawa
Orang-orang di jQuery menulis

793
00:35:19,920 --> 00:35:23,340
yang mendapat JSON dari server-- yang
JavaScript Object Notation.

794
00:35:23,340 --> 00:35:25,680
Dari apa URL ia akan
untuk mendapatkan maklumat itu?

795
00:35:25,680 --> 00:35:27,790
Rupa-rupanya dari URL ini di sini.

796
00:35:27,790 --> 00:35:31,180
>> Dan apa yang harus browser lakukan sebagai
tidak lama lagi kerana mendapat kembali tanggapan ini?

797
00:35:31,180 --> 00:35:36,500
Dan ini adalah keajaiban AJAX, sehingga untuk
speak-- Asynchronous JavaScript dalam XML.

798
00:35:36,500 --> 00:35:41,320
Adalah sukar untuk melihat dengan apa-apa
contoh mudah seperti yang kita telah di sini.

799
00:35:41,320 --> 00:35:44,730
>> Tapi ini tak segerak dalam
erti kata bahawa kod saya ketika

800
00:35:44,730 --> 00:35:48,530
dilaksanakan menghantar mesej kepada
pelayan pergi mendapatkan saya beberapa JSON.

801
00:35:48,530 --> 00:35:51,340
Dan ia berlaku super cepat
yang saya dapatkan jawapan.

802
00:35:51,340 --> 00:35:55,130
Tetapi apa yang menarik ialah ini
garis kod tidak menggantung di komputer saya.

803
00:35:55,130 --> 00:35:56,550
>> Saya tidak melihat ikon berputar.

804
00:35:56,550 --> 00:35:59,200
Saya tidak kehilangan
kemampuan untuk memindahkan mouse saya.

805
00:35:59,200 --> 00:36:01,340
Browser saya sebenarnya baik-baik saja.

806
00:36:01,340 --> 00:36:06,290
>> Oleh kerana cara JavaScript menangani
respon dari server adalah seperti berikut.

807
00:36:06,290 --> 00:36:09,740
Anda mendaftarkan apa yang anda akan memanggil
fungsi panggilan balik, yang

808
00:36:09,740 --> 00:36:12,830
hanya bermaksud, hey, JavaScript.

809
00:36:12,830 --> 00:36:16,100
Sebaik sahaja pelayan
bertindak balas dengan JSON,

810
00:36:16,100 --> 00:36:18,750
hubungi fungsi tanpa nama ini.

811
00:36:18,750 --> 00:36:23,910
>> Dan tolong berlalu ke dalam fungsi ini
apa sahaja rentetan pelayan meludahkan

812
00:36:23,910 --> 00:36:26,080
sebagai hujah yang disebut data.

813
00:36:26,080 --> 00:36:28,360
Jadi, dalam yang lain, kata-kata, jika
Saya memasang dinamik

814
00:36:28,360 --> 00:36:33,370
yang quote.php URL lulus dalam ini
simbol seperti PERCUMA atau GOOG atau entah apa lagi,

815
00:36:33,370 --> 00:36:36,830
Saya kemudian memberitahu
JavaScript pergi mendapatkan URL tersebut.

816
00:36:36,830 --> 00:36:39,080
Ingatlah bahawa pelayar
akan kembali sesuatu

817
00:36:39,080 --> 00:36:42,680
yang kelihatan seperti yang kita lihat earlier-- ini.

818
00:36:42,680 --> 00:36:45,940
>> Dan apa argumen kedua
di sini untuk mendapatkan JSON mengatakan

819
00:36:45,940 --> 00:36:48,450
yang memanggil fungsi ini
apabila server mendapat kembali

820
00:36:48,450 --> 00:36:52,440
apakah itu 10 milisaat
dari sekarang atau 10 saat dari sekarang.

821
00:36:52,440 --> 00:36:55,840
Dan sebaik sahaja anda lakukan,
menambahkan harga ke halaman.

822
00:36:55,840 --> 00:36:58,030
Sintaks ini di sini hanya
ertinya pergi mendapatkan nod

823
00:36:58,030 --> 00:37:01,940
dari pohon yang pengecam unik
adalah price-- bahawa jangka kita lihat sebelum ini.

824
00:37:01,940 --> 00:37:04,320
>> Kaedah ini dikenali sebagai HTML
hanya berkata, pergi menggantikan

825
00:37:04,320 --> 00:37:08,770
HTML yang ada di sana dengan data.price.

826
00:37:08,770 --> 00:37:10,200
Apa yang data.price?

827
00:37:10,200 --> 00:37:12,850
Nah, browser, ingat,
menunjukkan kepada saya ini datang kembali.

828
00:37:12,850 --> 00:37:14,540
Jadi, ini adalah data.

829
00:37:14,540 --> 00:37:18,100
>> Dan sebagainya ia sedikit samar
untuk melihat koma di sini.

830
00:37:18,100 --> 00:37:19,350
Tetapi yang sebenarnya, biarlah saya melakukan ini.

831
00:37:19,350 --> 00:37:22,890
Biar saya paste ini
sangat cepat ke dalam gedit

832
00:37:22,890 --> 00:37:27,240
dan menunjukkan ini seperti kita menunjukkan
Struktur Zamyla sebelumnya.

833
00:37:27,240 --> 00:37:31,610
>> Apa pelayan menghantar kembali adalah
objek kecil yang kelihatan seperti ini.

834
00:37:31,610 --> 00:37:37,140
Dan sebagainya adalah data.price
hanya memberi saya sebesar 0,1515.

835
00:37:37,140 --> 00:37:39,310
Jadi banyak bergerak
bahagian-bahagian di sini sekaligus.

836
00:37:39,310 --> 00:37:41,860
>> Tetapi takeaways utama adalah
bahawa kita mempunyai kemampuan ini

837
00:37:41,860 --> 00:37:44,600
untuk membuat HTTP tambahan
permintaan menggunakan JavaScript

838
00:37:44,600 --> 00:37:46,090
tanpa perlu memuat semula halaman.

839
00:37:46,090 --> 00:37:49,580
Dan kemudian kita boleh sebenarnya
mengubah halaman web dengan cepat.

840
00:37:49,580 --> 00:37:51,850
Dan ternyata bahawa
JavaScript dan bahasa-bahasa lain

841
00:37:51,850 --> 00:37:54,510
boleh digunakan sekarang tidak hanya
bermutasi halaman web,

842
00:37:54,510 --> 00:37:57,960
tetapi untuk benar-benar menulis perisian
dalam komputer yang sebenarnya,

843
00:37:57,960 --> 00:38:00,240
tidak hanya terbatas pada Chrome atau sejenisnya.

844
00:38:00,240 --> 00:38:03,530
>> Malah, jika- Colton, yang anda
ingin bergabung dengan kami kembali ke sini

845
00:38:03,530 --> 00:38:06,100
dengan kod makmal anda, dan Chang juga?

846
00:38:06,100 --> 00:38:09,140
Mari kita pergi ke depan, setelah berbicara tentang
fungsi tanpa nama dan callback

847
00:38:09,140 --> 00:38:13,090
dan benar-benar menggoda nasib di sini
dengan demo hidup dengan pendarahan

848
00:38:13,090 --> 00:38:16,480
teknologi terkini, salah satu
alat-alat Elite Motion.

849
00:38:16,480 --> 00:38:18,940
Kini, peranti ini, ingat,
adalah peranti USB kecil

850
00:38:18,940 --> 00:38:25,620
juga bahawa- itu beautiful--
yang dihubungkan ke port USB anda.

851
00:38:25,620 --> 00:38:29,120
>> Dan kemudian ia akan memberi pendapat
dalam bentuk gerak tubuh manusia

852
00:38:29,120 --> 00:38:32,560
dengan mengesan menggunakan sinar inframerah,
pada dasarnya, gerakan dari lengan anda.

853
00:38:32,560 --> 00:38:35,150
Jadi sedangkan apa yang cuba Maria
sebelum berotot,

854
00:38:35,150 --> 00:38:39,000
benar-benar merasakan apa yang berubah-ubah
lengan anda, ini adalah berdasarkan inframerah.

855
00:38:39,000 --> 00:38:44,390
Jadi ia mencari gerakan dalam
jenis lapisan satu kaki atau lebih

856
00:38:44,390 --> 00:38:46,190
peranti itu sendiri.

857
00:38:46,190 --> 00:38:48,950
>> Jadi kenapa tidak saya mengambil
menusuk ini dulu?

858
00:38:48,950 --> 00:38:53,100
Dan mari kita pergi ke depan dan melemparkan
Anda di atas di atas kepala di sini.

859
00:38:53,100 --> 00:38:56,250
Jadi mari kita meletakkan laptop Colton ini di sini.

860
00:38:56,250 --> 00:38:58,360
Kami telah mendapat Andrew pada TV.

861
00:38:58,360 --> 00:39:00,160
Dan apa yang anda ingin saya lakukan dahulu?

862
00:39:00,160 --> 00:39:02,409
>> COLTON: Pergi ke depan dan hanya
meletakkan tangan anda ke atas lelaki ini

863
00:39:02,409 --> 00:39:04,430
dan anda akan melihat beberapa perhiasannya yang hebat.

864
00:39:04,430 --> 00:39:07,230
>> DAVID J. MALAN: Very nice.

865
00:39:07,230 --> 00:39:11,110
Ini semua berlaku dalam masa nyata.

866
00:39:11,110 --> 00:39:11,889
OK.

867
00:39:11,889 --> 00:39:12,680
Baiklah, dan Yap.

868
00:39:12,680 --> 00:39:14,119
Begitu baik.

869
00:39:14,119 --> 00:39:15,410
Baiklah, apa lagi yang boleh kita lakukan?

870
00:39:15,410 --> 00:39:17,900
>> COLTON: Pergi ke skrin seterusnya dan melihat.

871
00:39:17,900 --> 00:39:19,136
>> DAVID J. MALAN: Baiklah.

872
00:39:19,136 --> 00:39:21,780
>> COLTON: permainan menyeronokkan sedikit
di mana anda boleh membuat robot.

873
00:39:21,780 --> 00:39:24,738
>> DAVID J. MALAN: Baiklah, jadi ini
adalah tangan palsu menunjukkan kepada saya apa yang perlu dilakukan.

874
00:39:24,738 --> 00:39:27,920
COLTON: Ya, jadi pergi ke depan
dan ambil salah satu blok

875
00:39:27,920 --> 00:39:30,637
dan meletakkannya di atas tubuh yang robot.

876
00:39:30,637 --> 00:39:32,137
DAVID J. MALAN: Oh, ada tangan saya.

877
00:39:32,137 --> 00:39:34,000
Oh.

878
00:39:34,000 --> 00:39:34,780
OK, menggemaskan.

879
00:39:34,780 --> 00:39:37,500

880
00:39:37,500 --> 00:39:38,650
Tunggu dulu, OK.

881
00:39:38,650 --> 00:39:41,320
Di sana kami pergi.

882
00:39:41,320 --> 00:39:43,590
>> COLTON: Saya membuat satu kecelakaan.

883
00:39:43,590 --> 00:39:45,423
>> DAVID J. MALAN: OK, saya akan mendapatkan orang ini.

884
00:39:45,423 --> 00:39:45,923
Sial!

885
00:39:45,923 --> 00:39:48,467

886
00:39:48,467 --> 00:39:51,550
Apabila kita mengamalkan ini terakhir
malam, anda tahu apa ini diserahkan ke?

887
00:39:51,550 --> 00:39:54,285
>> Seperti ini.

888
00:39:54,285 --> 00:39:55,490
OK.

889
00:39:55,490 --> 00:39:55,990
Yang berikutnya?

890
00:39:55,990 --> 00:39:56,860
>> COLTON: Tentu.

891
00:39:56,860 --> 00:39:58,818
>> DAVID J. MALAN: Baiklah,
dan ada yang ketiga.

892
00:39:58,818 --> 00:40:01,130

893
00:40:01,130 --> 00:40:01,674
Baik.

894
00:40:01,674 --> 00:40:03,215
COLTON: Dan dalam satu ini, anda akan mendapat supaya-

895
00:40:03,215 --> 00:40:04,923
DAVID J. MALAN: Oh,
yang satu ini indah.

896
00:40:04,923 --> 00:40:06,650
COLTON: --yeah, memilih selain bunga ini.

897
00:40:06,650 --> 00:40:07,441
DAVID J. MALAN: OK.

898
00:40:07,441 --> 00:40:11,170

899
00:40:11,170 --> 00:40:11,670
Tidak?

900
00:40:11,670 --> 00:40:14,515
Tak terjawab.

901
00:40:14,515 --> 00:40:15,570
>> COLTON: Oh, di sana anda pergi.

902
00:40:15,570 --> 00:40:18,680
>> DAVID J. MALAN: Ah, Lihat itu.

903
00:40:18,680 --> 00:40:19,830
Sangat bagus.

904
00:40:19,830 --> 00:40:22,470
Nah, kenapa tidak 'kita mengambil
keluar satu sukarelawan di sini

905
00:40:22,470 --> 00:40:24,180
yang ingin datang ke atas.

906
00:40:24,180 --> 00:40:27,500
Bagaimana pula di sana
di hijau, bukan?

907
00:40:27,500 --> 00:40:30,540
>> Baiklah, dan mari kita have--
bukan melakukan hal itu, ada di antara kamu

908
00:40:30,540 --> 00:40:34,590
dapat mengetahui permainan ini di sini-
memotong tali, mungkin?

909
00:40:34,590 --> 00:40:35,100
Mari kita lihat.

910
00:40:35,100 --> 00:40:37,320
Kami mempunyai gelas kami di lebih dari di sini?

911
00:40:37,320 --> 00:40:38,625
>> OK.

912
00:40:38,625 --> 00:40:39,270
Matur nuwun.

913
00:40:39,270 --> 00:40:39,380
Siapa nama anda?

914
00:40:39,380 --> 00:40:40,350
>> PENONTON: Laura.

915
00:40:40,350 --> 00:40:41,266
>> DAVID J. MALAN: Laura?

916
00:40:41,266 --> 00:40:42,120
Nice untuk melihat.

917
00:40:42,120 --> 00:40:45,600
Jika anda tidak keberatan meletakkan
Google Glass lebih cermin mata anda.

918
00:40:45,600 --> 00:40:46,970
Ini adalah Colton.

919
00:40:46,970 --> 00:40:47,650
>> COLTON: Hi.

920
00:40:47,650 --> 00:40:48,140
Senang kenalan dengan anda.

921
00:40:48,140 --> 00:40:49,600
>> DAVID J. MALAN: OK, datang sekitar.

922
00:40:49,600 --> 00:40:52,516
Baiklah, jadi apa yang anda akan
lakukan di sini, setelah bermain sebelum ini,

923
00:40:52,516 --> 00:40:55,650
diletakkan tanganmu ke atas
Motion Leap sini.

924
00:40:55,650 --> 00:40:57,210
Dan sekarang anak panah anda harus bergerak.

925
00:40:57,210 --> 00:40:57,710
Oh, tidak.

926
00:40:57,710 --> 00:40:58,066
>> PENONTON: No.

927
00:40:58,066 --> 00:40:58,780
>> DAVID J. MALAN: Kami
tidak mahu berhenti lagi.

928
00:40:58,780 --> 00:40:59,280
OK, tunggu.

929
00:40:59,280 --> 00:41:01,200
Di sini.

930
00:41:01,200 --> 00:41:03,530
Jadi melihat seperti anda memegang anda
jari atas sesuatu,

931
00:41:03,530 --> 00:41:06,750
tetikus mula turun ke hijau,
yang adalah bagaimana anda klik.

932
00:41:06,750 --> 00:41:08,980
>> Jadi membawa lebih Main.

933
00:41:08,980 --> 00:41:10,970
Dan hanya satu jari baik-baik saja.

934
00:41:10,970 --> 00:41:13,869
Dan sekarang klik pada sedikit
lelaki hijau di sebelah kiri.

935
00:41:13,869 --> 00:41:15,410
Dan kini memegang sehingga ia mengisi hijau.

936
00:41:15,410 --> 00:41:15,640
Baik.

937
00:41:15,640 --> 00:41:16,990
Sekarang, seperti, tingkat satu di bagian atas.

938
00:41:16,990 --> 00:41:20,190
>> PENONTON: Ya, kami mahu tingkat satu, di sini.

939
00:41:20,190 --> 00:41:21,660
>> DAVID J. MALAN: Baik.

940
00:41:21,660 --> 00:41:25,500
OK, jadi apa yang anda perlu
lakukan adalah memotong tali.

941
00:41:25,500 --> 00:41:28,240
Kursor anda orangnya putih di bawah sana.

942
00:41:28,240 --> 00:41:28,880
>> Sangat bagus.

943
00:41:28,880 --> 00:41:31,290

944
00:41:31,290 --> 00:41:32,790
Baiklah, itu kira-kira untuk mendapatkan lebih keras.

945
00:41:32,790 --> 00:41:34,800
Yang demikian, berpegang jari ke depan sekarang.

946
00:41:34,800 --> 00:41:37,370

947
00:41:37,370 --> 00:41:39,030
Baik.

948
00:41:39,030 --> 00:41:39,999
Yang ini keras.

949
00:41:39,999 --> 00:41:40,966
>> PENONTON: Oh crap.

950
00:41:40,966 --> 00:41:41,466
OK.

951
00:41:41,466 --> 00:41:42,466
Ia ingin pergi ke arah sana.

952
00:41:42,466 --> 00:41:44,890
Oh crap, bahawa-

953
00:41:44,890 --> 00:41:47,120
>> DAVID J. MALAN: Ya.

954
00:41:47,120 --> 00:41:50,700
Tujuan kedua adalah untuk mendapatkan semua bintang.

955
00:41:50,700 --> 00:41:53,920
Baiklah, akan datang.

956
00:41:53,920 --> 00:41:57,504
>> Mari kita lihat apakah anda boleh mendapatkan satu pertiga ini.

957
00:41:57,504 --> 00:41:58,004
Baik.

958
00:41:58,004 --> 00:42:05,980

959
00:42:05,980 --> 00:42:06,840
OK, pergi ke sana.

960
00:42:06,840 --> 00:42:08,850
>> Tentu.

961
00:42:08,850 --> 00:42:11,230
Oh, sangat bagus.

962
00:42:11,230 --> 00:42:11,930
Baik.

963
00:42:11,930 --> 00:42:13,534
>> Jadi kenapa pula kita tidak menangguhkan sini hari ini?

964
00:42:13,534 --> 00:42:15,200
Biar ada yang datang ke atas yang ingin bermain.

965
00:42:15,200 --> 00:42:16,880
Terima kasih banyak untuk Laura sukarela kami.

966
00:42:16,880 --> 00:42:18,730
Dan kita akan melihat anda pada hari Isnin.

967
00:42:18,730 --> 00:42:21,190
>> PENONTON: Anda mungkin ingin ini kembali.

968
00:42:21,190 --> 00:42:23,640
>> SPEAKER 2: Pada CS50-- seterusnya

969
00:42:23,640 --> 00:42:35,222