1
00:00:00,000 --> 00:00:02,570
[Powered by Google Translate] [Minggu 9]

2
00:00:02,570 --> 00:00:04,740
[David J. Malan - Universitas Harvard]

3
00:00:04,740 --> 00:00:07,170
[Ini adalah CS50. - CS50.TV]

4
00:00:07,170 --> 00:00:12,350
Baiklah. Selamat datang kembali. Ini adalah CS50, dan ini adalah awal minggu 9.

5
00:00:12,350 --> 00:00:16,600
Hari ini kita terfokus pada desain, tidak lagi dalam konteks C

6
00:00:16,600 --> 00:00:20,010
tetapi dalam konteks PHP dan sedikit SQL dan sedikit JavaScript,

7
00:00:20,010 --> 00:00:23,730
terutama menuju akhir dari kedua pset 7 dan juga proyek akhir Anda.

8
00:00:23,730 --> 00:00:26,310
Bahkan, jika Anda berada pada saat itu dalam proyek akhir Anda

9
00:00:26,310 --> 00:00:30,100
mana mungkin pada satu jam atau lebih yang lalu Anda setidaknya mulai memberikan beberapa pemikiran

10
00:00:30,100 --> 00:00:33,730
untuk proyek akhir Anda dan Anda berpikir Anda ingin berkolaborasi dengan 1 atau 2 teman sekelas,

11
00:00:33,730 --> 00:00:36,150
jika Anda mengalami kesulitan menghubungkan dengan kata teman sekelas,

12
00:00:36,150 --> 00:00:40,570
merasa bebas untuk mengisi formulir di cs50.net/partners/form.

13
00:00:40,570 --> 00:00:42,880
Itu hanya meminta Anda siapa Anda, apa jenis proyek Anda berpikir tentang,

14
00:00:42,880 --> 00:00:44,870
di mana Anda tinggal hanya untuk alasan logistik.

15
00:00:44,870 --> 00:00:49,510
Dan kemudian jika Anda ingin mengawasi selama minggu depan atau lebih URL spreadsheet sana,

16
00:00:49,510 --> 00:00:53,520
Anda kemudian dapat melihat versi read-only dari doc Google

17
00:00:53,520 --> 00:00:56,010
di mana kita sedang mengumpulkan informasi tersebut.

18
00:00:56,010 --> 00:00:58,930
Jadi jika Anda ingin bekerja dengan seseorang, dengan segala cara merasa bebas untuk menjangkau orang

19
00:00:58,930 --> 00:01:00,480
melalui mekanisme tersebut.

20
00:01:00,480 --> 00:01:02,690
Namun sebagian besar dari orang-orang melakukan solo kerja. Itu benar-benar baik-baik saja.

21
00:01:02,690 --> 00:01:06,120
Jadi jangan merasa bahwa ini adalah cara apapun wajib.

22
00:01:06,120 --> 00:01:09,680
Pada hari Jumat itu hanya saya dan beberapa tim di sini,

23
00:01:09,680 --> 00:01:11,100
kosong teater untuk sebagian besar.

24
00:01:11,100 --> 00:01:14,600
Ada yang 3 turis duduk di atas sana, jadi itu sedikit canggung.

25
00:01:14,600 --> 00:01:18,970
Apa yang kita bicarakan adalah database dan kami berbicara tentang pset 7 sedikit.

26
00:01:18,970 --> 00:01:22,200
Dan jika Anda tidak terjadi untuk menangkap bahwa di video dulu, itu bagus.

27
00:01:22,200 --> 00:01:26,770
Saya akan mencoba untuk mendefinisikan istilah yang kita akan sebaliknya mengambil untuk diberikan

28
00:01:26,770 --> 00:01:28,840
berdasarkan kuliah Jumat.

29
00:01:28,840 --> 00:01:32,550
>> Tapi hari ini kita akan mencoba untuk mendapatkan Anda ke titik

30
00:01:32,550 --> 00:01:34,990
dari tidak hanya mampu melakukan sesuatu seperti pset 7

31
00:01:34,990 --> 00:01:37,360
tapi benar-benar memahami apa yang terjadi di bawah tenda,

32
00:01:37,360 --> 00:01:41,910
khususnya beberapa abstraksi yang kita tempatkan di tempat dalam file functions.php

33
00:01:41,910 --> 00:01:45,780
untuk membuat hidup Anda sedikit lebih mudah, tetapi agar Anda akhirnya mengerti

34
00:01:45,780 --> 00:01:48,760
sehingga ketika roda pelatihan datang dari dalam beberapa minggu Anda masih bisa bertahan

35
00:01:48,760 --> 00:01:53,750
di dunia nyata dan melakukan hal ini tanpa kerangka CS50 di bawah Anda.

36
00:01:53,750 --> 00:01:57,500
Ini $ _SESSION, bagi anda yang akrab

37
00:01:57,500 --> 00:02:01,960
atau yang sudah tertangkap video pada Jumat, apa SESI mari kita lakukan

38
00:02:01,960 --> 00:02:04,330
dalam aplikasi web berbasis PHP?

39
00:02:04,330 --> 00:02:09,650
Ini adalah variabel superglobal, yang berarti itu memiliki semangat yang sama GET dan POST

40
00:02:09,650 --> 00:02:13,970
dan beberapa orang lainnya, tapi apa hal ini berguna untuk?

41
00:02:13,970 --> 00:02:18,320
>> Apa SESI digunakan untuk? Ya. [Mahasiswa] Logging masuk

42
00:02:18,320 --> 00:02:21,040
Maaf? [Mahasiswa] Logging Logging masuk masuk Memang.

43
00:02:21,040 --> 00:02:25,100
Dalam pset 7 kita menggunakan superglobal SESI untuk memfasilitasi login

44
00:02:25,100 --> 00:02:28,600
Dan apa yang bagus tentang superglobal ini adalah bahwa itu adalah array asosiatif.

45
00:02:28,600 --> 00:02:33,190
Array asosiatif, ingat, hanya array tetapi tidak lagi yang indeks harus nomor

46
00:02:33,190 --> 00:02:37,670
seperti 012. Mereka dapat nomor atau mereka dapat menjadi lebih string.

47
00:02:37,670 --> 00:02:44,890
Dan jadi jika Anda sudah menyelam ke pset 7 belum, Anda mungkin ingat bahwa kita menyimpan ID disebut kunci

48
00:02:44,890 --> 00:02:50,330
dalam array asosiatif yang nilainya adalah sesuatu seperti 123 -

49
00:02:50,330 --> 00:02:53,780
apapun saat ini login ID pengguna adalah.

50
00:02:53,780 --> 00:02:59,470
Motivasi untuk ini adalah bahwa bahkan setelah pengguna telah mengunjungi localhost

51
00:02:59,470 --> 00:03:02,720
atau website saya lebih umum dan kemudian mereka sudah masuk,

52
00:03:02,720 --> 00:03:07,320
bahkan jika mereka tidak mengklik link atau kembali ke website saya selama 5 menit

53
00:03:07,320 --> 00:03:10,730
atau bahkan satu jam atau bahkan hari tetapi mereka meninggalkan jendela browser mereka terbuka,

54
00:03:10,730 --> 00:03:14,370
melalui superglobal ini bisa saya ingat bahwa mereka login

55
00:03:14,370 --> 00:03:21,140
>> Dengan kata lain, itu memungkinkan saya untuk menyimpan sesuatu yang jangka panjang saya ingin sedikit tentang user.

56
00:03:21,140 --> 00:03:24,390
Dan Anda bisa memikirkan itu benar-benar sebagai inkarnasi dari keranjang belanja.

57
00:03:24,390 --> 00:03:27,740
Tempat-tempat seperti Amazon jelas membiarkan Anda meletakkan segala sesuatu ke dalam keranjang belanja,

58
00:03:27,740 --> 00:03:32,230
tapi HTTP, protokol yang kekuatan Web, adalah stateless

59
00:03:32,230 --> 00:03:34,230
dalam arti bahwa ketika Anda mengunjungi sebuah website,

60
00:03:34,230 --> 00:03:37,290
untuk sebagian besar Anda tidak memiliki koneksi jaringan konstan

61
00:03:37,290 --> 00:03:39,270
antara browser dan server.

62
00:03:39,270 --> 00:03:42,190
Segera setelah Anda sudah download HTML dan file JPEG dan GIF dan semua itu,

63
00:03:42,190 --> 00:03:48,200
koneksi pergi dan Anda hanya memiliki salinan dari HTML dan yang lainnya dari server.

64
00:03:48,200 --> 00:03:53,000
Tetapi jika server ingin mengingat sesuatu tentang Anda,

65
00:03:53,000 --> 00:03:57,580
beban adalah pada server untuk benar-benar merekam informasi tersebut.

66
00:03:57,580 --> 00:04:00,130
Dan sehingga Anda programmer yang memiliki kontrol atas server

67
00:04:00,130 --> 00:04:04,400
dapat menempatkan sebagian besar apa pun yang Anda inginkan dalam ini array asosiatif superglobal

68
00:04:04,400 --> 00:04:06,850
dan itu akan berada di sana waktu berikutnya pengguna datang kembali,

69
00:04:06,850 --> 00:04:12,070
apakah itu menit atau bahkan hari kemudian, kecuali mereka menutup jendela browser mereka,

70
00:04:12,070 --> 00:04:14,360
di mana SESI titik menghilang.

71
00:04:14,360 --> 00:04:17,779
Jadi penyimpanan fana, itu non-persistent, dan itu dimaksudkan untuk pergi

72
00:04:17,779 --> 00:04:22,360
segera setelah pengguna menutup browser mereka - tidak hanya itu tab, sering seluruh browser,

73
00:04:22,360 --> 00:04:24,930
sehingga secara efektif logging pengguna keluar.

74
00:04:24,930 --> 00:04:28,000
Jadi bagaimana hal ini benar-benar diterapkan?

75
00:04:28,000 --> 00:04:31,360
Mari kita lihat sebuah contoh sederhana kita melihat pada hari Jumat.

76
00:04:31,360 --> 00:04:33,340
Bagi mereka yang tidak terbiasa, itu sesederhana ini.

77
00:04:33,340 --> 00:04:35,910
Ini adalah halaman web yang tujuan utamanya dalam hidup adalah untuk memberitahu saya

78
00:04:35,910 --> 00:04:38,000
berapa kali saya telah mengunjungi halaman ini.

79
00:04:38,000 --> 00:04:41,670
Ini adalah pertama kalinya di sini pada hari Senin bahwa saya mengunjungi, sehingga ia mengatakan 0 kali.

80
00:04:41,670 --> 00:04:46,940
>> Tapi kalau aku mulai reload halaman ini, ia mengatakan 1 kali, 2, 3, 4, 5,

81
00:04:46,940 --> 00:04:49,800
dan ini pada akhirnya akan hanya terus menghitung, naik, naik, naik, naik

82
00:04:49,800 --> 00:04:53,130
untuk setiap kali saya benar-benar klik Reload di atasnya.

83
00:04:53,130 --> 00:04:58,830
Jadi bagaimana ini bekerja? Biarkan aku pergi dalam file ini disebut counter.php.

84
00:04:58,830 --> 00:05:02,490
Bagian atas dari itu semua komentar biru, tapi yang menarik di sini.

85
00:05:02,490 --> 00:05:06,670
On line 13 kita sebut ini session_start fungsi,

86
00:05:06,670 --> 00:05:09,600
dan yang secara harfiah semua yang perlu Anda lakukan jika Anda ingin memiliki akses

87
00:05:09,600 --> 00:05:13,610
ini superglobal khusus yang disebut $ _SESSION.

88
00:05:13,610 --> 00:05:17,430
Itu akan membuat semuanya mungkin, dan kami akan melihat di saat bagaimana itu semua mungkin.

89
00:05:17,430 --> 00:05:20,350
Sejalan 16 pemberitahuan apa yang saya lakukan.

90
00:05:20,350 --> 00:05:25,960
Jika kunci, yang disebut kontra - dengan kata lain, nilai indeks - "kontra"

91
00:05:25,960 --> 00:05:32,310
ada dalam array ini disebut SESI, maka apa yang saya lakukan dengan itu di baris bawah?

92
00:05:32,310 --> 00:05:36,650
Apa baris 18 lakukan?

93
00:05:36,650 --> 00:05:40,360
>> [Respon siswa terdengar] Apa itu? [Mahasiswa] Menyimpan nilai. Baik.

94
00:05:40,360 --> 00:05:45,800
Ini menyimpan nilai yang ada di SESI sekarang dalam variabel sementara lokal baru,

95
00:05:45,800 --> 00:05:48,250
$ Kontra dalam huruf kecil semua.

96
00:05:48,250 --> 00:05:50,770
Perhatikan bahwa PHP sudah menjadi sedikit malas di sini.

97
00:05:50,770 --> 00:05:55,550
Perhatikan kita tidak memiliki penyebutan int atau float atau string atau sesuatu seperti itu

98
00:05:55,550 --> 00:06:00,480
karena PHP lemah diketik, dimana Anda tidak perlu menentukan jenis variabel,

99
00:06:00,480 --> 00:06:03,310
dan dalam hal ini di sini saya sudah tidak bahkan menyatakan itu belum.

100
00:06:03,310 --> 00:06:08,980
Saya menyatakan di dalam satu kurung kurawal dan tidak seperti C, ini sebenarnya baik-baik saja.

101
00:06:08,980 --> 00:06:13,800
Tidak peduli seberapa dalam bersarang deklarasi variabel adalah di PHP -

102
00:06:13,800 --> 00:06:16,650
dalam tanda kurung kurawal, dalam tanda kurung kurawal dan sejenisnya -

103
00:06:16,650 --> 00:06:21,230
itu akan pada saat itu dalam waktu ada untuk sisa program,

104
00:06:21,230 --> 00:06:22,680
untuk lebih baik atau lebih buruk.

105
00:06:22,680 --> 00:06:26,930
Jadi segera menjadi global segera setelah Anda mendefinisikannya seperti yang kita lakukan di sini.

106
00:06:26,930 --> 00:06:31,620
>> Kalau tidak, jika saya tidak menemukan bahwa ada sesuatu di superglobal SESI,

107
00:06:31,620 --> 00:06:34,680
Saya rupanya menginisialisasi ini variabel counter ke 0,

108
00:06:34,680 --> 00:06:37,580
sehingga hanya asumsi pengguna belum pernah di sini sebelumnya.

109
00:06:37,580 --> 00:06:40,030
Dan kemudian ini tentu saja adalah incrementing counter bagaimana?

110
00:06:40,030 --> 00:06:44,480
Saya memperbarui nilai yang dalam ini array asosiatif

111
00:06:44,480 --> 00:06:49,530
dengan menetapkan sama dengan apa kontra saat ini + 1.

112
00:06:49,530 --> 00:06:53,520
Jika saya scroll ke bawah sini untuk HTML halaman, itu sebenarnya cukup sederhana.

113
00:06:53,520 --> 00:06:58,920
Semua yang saya miliki dalam badan halaman ini, "Anda telah mengunjungi situs ini kali begitu-dan-begitu."

114
00:06:58,920 --> 00:07:00,350
Dan ini adalah membangun PHP.

115
00:07:00,350 --> 00:07:06,080
Jika Anda melakukan <=, ini setara efektif untuk apa fungsi?

116
00:07:07,920 --> 00:07:12,600
Ini benar-benar setara dengan sesuatu seperti printf, yang kita telah melihat berkali-kali dalam C,

117
00:07:12,600 --> 00:07:15,940
meskipun seperti yang Anda mungkin sudah tahu dari spec di pset 7,

118
00:07:15,940 --> 00:07:20,160
cetak juga merupakan fungsi yang hanya mencetak sesuatu, itu tidak benar-benar menggunakan kode format,

119
00:07:20,160 --> 00:07:23,270
dan Anda benar-benar dapat mengatakan gema juga.

120
00:07:23,270 --> 00:07:27,460
Mereka semua pernah jadi sedikit berbeda meskipun efek bersih pada akhirnya sama.

121
00:07:27,460 --> 00:07:31,270
Jadi ini penggunaan tanda sama hanya semacam cara yang elegan untuk melakukannya

122
00:07:31,270 --> 00:07:34,910
lebih ringkas dari yang Anda mungkin bisa.

123
00:07:34,910 --> 00:07:38,370
Jadi itu semua situs ini tidak. Ini mencetak nilai dari counter.

124
00:07:38,370 --> 00:07:40,550
Bagaimana ini semua benar-benar terjadi?

125
00:07:40,550 --> 00:07:43,250
Anda mungkin ingat seminggu atau yang lalu kami mulai mencari di bawah tenda

126
00:07:43,250 --> 00:07:47,910
bagaimana sebuah halaman web bekerja dengan menggunakan tab Inspektur.

127
00:07:47,910 --> 00:07:51,900
>> Chrome memiliki ini baik dalam versi Mac, versi Windows, dan bahkan versi Linux,

128
00:07:51,900 --> 00:07:59,510
dan Firefox dan IE memiliki mekanisme yang sama dimana Anda memiliki built-in debugger

129
00:07:59,510 --> 00:08:01,400
dalam browser.

130
00:08:01,400 --> 00:08:03,040
Mari kita lihat berikut ini.

131
00:08:03,040 --> 00:08:06,960
Kami punya sejumlah besar tab di sini, dan ingat bahwa yang paling kiri adalah Elements,

132
00:08:06,960 --> 00:08:10,700
dan tidak peduli seberapa godawful HTML dan JavaScript di halaman,

133
00:08:10,700 --> 00:08:15,710
ingat bahwa dengan tab Elemen Anda benar-benar dapat menavigasi HTML hirarki

134
00:08:15,710 --> 00:08:17,050
dan bagus dan rapi.

135
00:08:17,050 --> 00:08:19,370
Jadi jika Anda mencoba untuk belajar dari sebuah situs web seperti Google atau Facebook

136
00:08:19,370 --> 00:08:22,370
atau benar-benar situs web apapun, menyadari bahwa Anda mungkin lebih baik

137
00:08:22,370 --> 00:08:26,360
melihat kode sumber ini cara yang bertentangan dengan melihat sumber mentah,

138
00:08:26,360 --> 00:08:29,580
yang dapat menjadi berantakan, seperti yang kita lihat terutama pada situs Google.

139
00:08:29,580 --> 00:08:32,220
Jadi jika saya bukan klik pada tab Jaringan di sini,

140
00:08:32,220 --> 00:08:34,830
mari kita lihat apa yang terjadi ketika saya mengunjungi halaman ini.

141
00:08:34,830 --> 00:08:38,669
Pertama izinkan saya menghapus cache saya.

142
00:08:38,669 --> 00:08:43,570
Aku akan pergi ke Pengaturan di Chrome dan kemudian pergi ke Sejarah

143
00:08:43,570 --> 00:08:46,420
dan kemudian Hapus semua data perambanan.

144
00:08:46,420 --> 00:08:48,170
Anda dapat digunakan untuk melakukan hal ini untuk keperluan lain, [tertawa]

145
00:08:48,170 --> 00:08:51,990
tetapi ketika datang ke situs web berkembang, itu benar-benar berguna -

146
00:08:51,990 --> 00:08:55,980
jika Anda tertawa Anda tahu. [Tertawa]

147
00:08:55,980 --> 00:08:59,310
Ini sebenarnya sangat berguna ketika mengembangkan website karena kenyataannya adalah

148
00:08:59,310 --> 00:09:04,100
hal-hal seperti kue dan hal-hal seperti file HTML cache, cache file JavaScript

149
00:09:04,100 --> 00:09:06,390
benar-benar dapat menjadi besar kepala, karena jika karena alasan apapun

150
00:09:06,390 --> 00:09:11,500
browser memutuskan untuk cache beberapa file dan belum Anda telah membuat perubahan pada file tersebut di server

151
00:09:11,500 --> 00:09:14,670
tapi browser belum benar-benar menyadari bahwa file tersebut telah berubah

152
00:09:14,670 --> 00:09:19,060
dan karena itu tidak benar-benar kembali men-download bahkan ketika Anda mengklik tombol Reload,

153
00:09:19,060 --> 00:09:23,210
salah satu cara yang paling jitu untuk hanya memastikan kesalahan bukan dengan kode Anda,

154
00:09:23,210 --> 00:09:26,480
itu dengan perilaku browser, adalah untuk pergi di sini pada browser Anda

155
00:09:26,480 --> 00:09:29,950
dan hanya menghapus seluruh sejarah sehingga tidak ada kebingungan.

156
00:09:29,950 --> 00:09:33,210
>> Dan kemudian jika Anda benar-benar ingin menjadi paranoid, keluar dari browser, restart,

157
00:09:33,210 --> 00:09:35,660
dan kemudian pastikan semua bekerja seperti yang diharapkan.

158
00:09:35,660 --> 00:09:38,820
Jadi singkatnya, cache kliring baik ketika melakukan pembangunan.

159
00:09:38,820 --> 00:09:40,690
Jadi di sini kita memiliki tab Jaringan.

160
00:09:40,690 --> 00:09:46,020
Saya sebelumnya telah mengunjungi situs 9 kali, tapi biarkan aku pergi ke depan sekarang dan klik Reload.

161
00:09:46,020 --> 00:09:47,500
Dan aku kembali ke 0.

162
00:09:47,500 --> 00:09:52,100
Mari kita benar-benar melihat bagaimana itu adalah bahwa ini superglobal SESI sedang dilaksanakan.

163
00:09:52,100 --> 00:09:55,990
Aku akan klik pada permintaan HTTP 1 yang dibuat,

164
00:09:55,990 --> 00:09:58,810
dan ini jendela debugging membuat saya melihat ke dalam itu.

165
00:09:58,810 --> 00:10:01,970
Di sini saya hanya melihat respon dari server, yang tidak menarik.

166
00:10:01,970 --> 00:10:04,030
Aku pernah melihat ini dalam beberapa cara.

167
00:10:04,030 --> 00:10:06,350
Tapi apa secara teknis menarik adalah header.

168
00:10:06,350 --> 00:10:11,770
Jika saya scroll ke bawah sini dan fokus pada header permintaan dan klik view source,

169
00:10:11,770 --> 00:10:14,400
apa yang saya akan melihat secara harfiah permintaan HTTP

170
00:10:14,400 --> 00:10:17,250
yang hanya pergi dari browser saya ke server,

171
00:10:17,250 --> 00:10:21,400
GET menjadi kata dan kemudian / counter.php menjadi nama file,

172
00:10:21,400 --> 00:10:25,670
HTTP/1.1 hanya menjadi versi HTTP yang browser saya menggunakan.

173
00:10:25,670 --> 00:10:31,070
Baris ini di sini adalah sedikit pengingat dari browser ke server apa nama server

174
00:10:31,070 --> 00:10:33,020
bahwa ia ingin berbicara dengan.

175
00:10:33,020 --> 00:10:38,200
Dan kemudian sisa ini kadang-kadang menarik tetapi tidak relevan sekarang.

176
00:10:38,200 --> 00:10:40,090
>> Ini hanya semacam rasa ingin tahu.

177
00:10:40,090 --> 00:10:43,530
Cryptic meskipun string ini adalah, setiap saat browser Anda mengunjungi sebuah website

178
00:10:43,530 --> 00:10:47,110
itu menginformasikan server apa browser yang Anda gunakan

179
00:10:47,110 --> 00:10:50,040
dan apa sistem operasi yang Anda gunakan dan apa versi daripadanya.

180
00:10:50,040 --> 00:10:52,650
Jadi jika Anda pernah bertanya-tanya bagaimana situs-situs seperti CNN dan yang lainnya

181
00:10:52,650 --> 00:10:56,860
tahu apa persentase pengguna Mac pada pengguna Web, PC,

182
00:10:56,860 --> 00:11:00,820
Pengguna IE, pengguna Chrome dan sejenisnya, itu karena semua browser kami

183
00:11:00,820 --> 00:11:04,300
mengatakan kepada setiap situs tunggal di luar sana apa yang kita.

184
00:11:04,300 --> 00:11:07,410
Itu tidak selalu berisi informasi pribadi,

185
00:11:07,410 --> 00:11:13,060
tetapi tidak memberitahu server apa alamat IP Anda dan apa browser dan OS yang Anda gunakan.

186
00:11:13,060 --> 00:11:14,720
Jadi itulah di mana informasi ini.

187
00:11:14,720 --> 00:11:19,960
Tapi apa yang lebih menarik sekarang ketika datang ke sesi ini adalah header respon.

188
00:11:19,960 --> 00:11:22,530
Biarkan saya klik view source sebelah respon.

189
00:11:22,530 --> 00:11:24,590
Yang menarik di sini adalah beberapa hal.

190
00:11:24,590 --> 00:11:27,580
1, kami kembali kode status 200.

191
00:11:27,580 --> 00:11:29,840
Kami tidak pernah melihat kode status karena itu berarti semuanya baik-baik.

192
00:11:29,840 --> 00:11:32,920
Ini berarti harfiah apa-apa berbeda dengan sesuatu yang lain.

193
00:11:32,920 --> 00:11:36,380
Apa nomor kadang-kadang kita melihat itu buruk? [Mahasiswa] 404.

194
00:11:36,380 --> 00:11:39,860
404, file tidak ditemukan, 403 Anda mungkin tersandung atas sudah,

195
00:11:39,860 --> 00:11:43,660
yang dilarang, yang berarti Anda lupa sesuatu chmod, kemungkinan besar.

196
00:11:43,660 --> 00:11:45,190
Dan ada sekelompok orang lain.

197
00:11:45,190 --> 00:11:47,760
>> Di sini, ini sedikit gila.

198
00:11:47,760 --> 00:11:52,340
Aku benar-benar hanya menulis file ini beberapa menit lalu dengan menyisipkan ke gedit.

199
00:11:52,340 --> 00:11:57,100
Mengapa halaman ini berakhir pada tahun 1981 sebelum ada benar-benar sebuah Web?

200
00:11:58,010 --> 00:12:00,730
Apa yang terjadi di sana?

201
00:12:00,730 --> 00:12:04,390
>> [Respon siswa terdengar] The cap waktu. Tapi kenapa?

202
00:12:06,110 --> 00:12:09,120
Ini agak sewenang-wenang, tapi itu benar-benar berguna.

203
00:12:09,120 --> 00:12:15,500
Apa ini mengatakan kepada browser saya ini file PHP Anda baru saja diminta telah kedaluwarsa.

204
00:12:15,500 --> 00:12:18,580
Bahkan, itu berakhir 30 tahun yang lalu.

205
00:12:18,580 --> 00:12:20,260
Tapi apa benar-benar berarti?

206
00:12:20,260 --> 00:12:22,500
Ini hanya berarti waktu berikutnya pengguna mengunjungi halaman ini,

207
00:12:22,500 --> 00:12:25,540
apakah dengan reload atau mengetik URL di address bar,

208
00:12:25,540 --> 00:12:28,010
pastikan Anda pergi dan mengambil salinan baru dari itu.

209
00:12:28,010 --> 00:12:30,840
Ini adalah semacam contoh penghilang cache,

210
00:12:30,840 --> 00:12:33,790
kata bodoh yang hanya berarti berusaha untuk mencegah browser

211
00:12:33,790 --> 00:12:37,260
dari sebenarnya HTML caching yang telah dikirim dari server

212
00:12:37,260 --> 00:12:41,490
sehingga Anda tidak sengaja memukul ulang dan kemudian melihat versi yang sama dari file.

213
00:12:41,490 --> 00:12:43,730
Anda benar-benar ingin server untuk mengirim salinan baru.

214
00:12:43,730 --> 00:12:47,440
Jadi fakta bahwa itu hanya berarti bahwa 1.981 itulah alat yang memilih

215
00:12:47,440 --> 00:12:50,280
sebagai tanggal yang sewenang-wenang di masa lalu.

216
00:12:50,280 --> 00:12:53,380
Tapi garis berair nyata sekarang satu ini.

217
00:12:53,380 --> 00:12:57,550
Bahkan sebelum 50 Anda mungkin samar-samar akrab dengan cookie.

218
00:12:57,550 --> 00:13:01,820
Sampai sekarang, terutama di kalangan mereka yang kurang nyaman atau di antara,

219
00:13:01,820 --> 00:13:04,120
apa cookie dalam pemahaman Anda sekarang

220
00:13:04,120 --> 00:13:06,980
meskipun kami akan membuat pemahaman Anda lebih teknis?

221
00:13:08,150 --> 00:13:10,070
Apa cookie? Ya.

222
00:13:10,070 --> 00:13:13,890
[Mahasiswa] Informasi tentang pengguna, seperti jika mereka telah menulis nama pengguna mereka atau sesuatu.

223
00:13:13,890 --> 00:13:17,370
>> Baik. Ini informasi tentang pengguna, apakah mereka telah mengetik nama pengguna mereka sudah.

224
00:13:17,370 --> 00:13:21,190
Cookie adalah cara dimana server dapat mengingat sesuatu tentang pengguna.

225
00:13:21,190 --> 00:13:25,810
Dan apa cookie benar-benar adalah file teks atau beberapa urutan byte

226
00:13:25,810 --> 00:13:28,340
yang ditanam oleh server dalam browser Anda,

227
00:13:28,340 --> 00:13:31,960
dan dalam file tersebut atau di antara mereka byte adalah semacam pengenal.

228
00:13:31,960 --> 00:13:35,640
Mungkin secara harfiah nama pengguna Anda, tetapi lebih sering itu sesuatu yang lebih samar-tampak

229
00:13:35,640 --> 00:13:43,700
hal seperti ini di sini - bo8dal3ct dan sebagainya - string alfanumerik sangat besar

230
00:13:43,700 --> 00:13:47,050
itu benar-benar hanya dimaksudkan untuk menjadi sebuah identifikasi unik untuk Anda.

231
00:13:47,050 --> 00:13:49,790
Atau Anda dapat menganggapnya sebagai semacam cap tangan virtual.

232
00:13:49,790 --> 00:13:53,020
Jika Anda pergi ke beberapa klub atau sebuah taman hiburan, mengingat bahwa Anda telah benar-benar dibayar

233
00:13:53,020 --> 00:13:55,850
dan pergi, mereka memasang stiker merah kecil di tangan Anda dari beberapa macam,

234
00:13:55,850 --> 00:13:59,270
dan yang mengingatkan orang-orang di meja yang sudah dibayar

235
00:13:59,270 --> 00:14:01,340
dan Anda bisa datang dan pergi sesuka hati.

236
00:14:01,340 --> 00:14:04,250
Cookie adalah sedikit semangat yang sama itu.

237
00:14:04,250 --> 00:14:08,070
Pertama kali saya mengunjungi website ini, karena saya hanya lakukan setelah membersihkan cache saya,

238
00:14:08,070 --> 00:14:11,620
server web, alat dalam hal ini, membubuhkan cap di tanganku

239
00:14:11,620 --> 00:14:15,030
yang namanya PHPSESSID, sesi ID,

240
00:14:15,030 --> 00:14:18,260
yang nilainya adalah string alfanumerik sangat panjang.

241
00:14:18,260 --> 00:14:22,470
>> Jadi yang sekarang semacam terpampang di tangan saya sehingga waktu berikutnya aku memukul ulang

242
00:14:22,470 --> 00:14:25,230
atau secara manual kunjungi URL ini di browser,

243
00:14:25,230 --> 00:14:29,230
browser saya dengan definisi HTTP akan menyajikan cap tangan

244
00:14:29,230 --> 00:14:31,940
lagi dan lagi dan lagi.

245
00:14:31,940 --> 00:14:34,550
Jadi meskipun server tidak selalu tahu siapa aku,

246
00:14:34,550 --> 00:14:39,610
mereka setidaknya tahu bahwa aku pengguna yang sama atau setidaknya, lebih khusus, browser yang sama.

247
00:14:39,610 --> 00:14:45,660
Dan jadi ini pada akhirnya bagaimana superglobal SESI diimplementasikan.

248
00:14:45,660 --> 00:14:51,200
Server tidak tahu siapa Anda ketika Anda mengunjungi sebuah situs web untuk kedua atau ketiga kalinya

249
00:14:51,200 --> 00:14:53,410
kecuali Anda hadir ini cap tangan.

250
00:14:53,410 --> 00:14:55,530
Dan segera setelah Anda hadir bahwa cap tangan,

251
00:14:55,530 --> 00:14:59,370
server web pada dasarnya masuk ke database kecil sendiri

252
00:14:59,370 --> 00:15:06,040
dan cek, oke, saya baru saja melihat cap tangan bo8dal3ct pengguna dan sebagainya.

253
00:15:06,040 --> 00:15:09,850
Biarkan saya melihat informasi apa programmer telah disimpan

254
00:15:09,850 --> 00:15:12,380
bagian dalam superglobal tentang pengguna ini,

255
00:15:12,380 --> 00:15:17,000
dan kemudian membiarkan saya memastikan bahwa data yang lagi dalam SESI superglobal

256
00:15:17,000 --> 00:15:19,830
sehingga pemrogram dapat kembali mengakses data

257
00:15:19,830 --> 00:15:23,360
bahkan jika itu mengatur beberapa menit atau jam lalu.

258
00:15:23,360 --> 00:15:26,150
Jadi dengan kata lain, cookies, yang mendapat rap buruk selama beberapa waktu

259
00:15:26,150 --> 00:15:29,990
karena ketidakamanan di browser dan mereka benar-benar dapat melanggar privasi kami dan semua ini,

260
00:15:29,990 --> 00:15:31,900
mereka benar-benar memiliki utilitas besar karena tanpa mereka

261
00:15:31,900 --> 00:15:36,110
Anda terus-menerus akan masuk ke setiap halaman Facebook Anda kunjungi

262
00:15:36,110 --> 00:15:40,680
atau setiap email Gmail Anda membaca jika browser tidak memiliki beberapa cara untuk mengingat

263
00:15:40,680 --> 00:15:43,320
bahwa Anda sudah dikonfirmasi.

264
00:15:43,320 --> 00:15:46,640
>> Jadi dengan cara ini cookie dikirim bolak-balik melintasi kawat.

265
00:15:46,640 --> 00:15:52,470
Lain rasa ingin tahu tentang cookie, terutama di sini, adalah bahwa ini adalah benar-benar dalam teks-jelas.

266
00:15:52,470 --> 00:15:54,930
Tidak ada enkripsi terjadi di sini apapun,

267
00:15:54,930 --> 00:15:57,240
dan memang saya menggunakan HTTP saat ini.

268
00:15:57,240 --> 00:16:00,890
Salah satu momen favorit kami di CS50, yang sekarang 2 tahun yang lalu,

269
00:16:00,890 --> 00:16:04,750
adalah sekitar waktu alat yang disebut Firesheep keluar.

270
00:16:04,750 --> 00:16:08,320
Ini adalah software gratis yang dibuat oleh seorang peneliti keamanan

271
00:16:08,320 --> 00:16:13,250
sebagai wake-up call bagi masyarakat untuk mengatakan betapa atrociously dilaksanakan

272
00:16:13,250 --> 00:16:17,900
mekanisme otentikasi tertentu pada web itu.

273
00:16:17,900 --> 00:16:22,880
Jadi untuk beberapa waktu, Facebook hampir seluruhnya melalui HTTP, HTTPS no.

274
00:16:22,880 --> 00:16:25,640
Dan bahkan jika Anda tidak tahu bagaimana kripto bekerja, S adalah aman

275
00:16:25,640 --> 00:16:27,950
jadi itu berarti ada setidaknya beberapa enkripsi yang terlibat.

276
00:16:27,950 --> 00:16:30,610
Facebook memang digunakan untuk mengenkripsi nama pengguna dan password,

277
00:16:30,610 --> 00:16:33,560
tetapi segera setelah Anda melihat Anda pokes atau pesan atau feed berita Anda,

278
00:16:33,560 --> 00:16:35,360
semua yang tidak terenkripsi.

279
00:16:35,360 --> 00:16:37,870
Begitu Gmail sampai hanya setahun atau 2 lalu.

280
00:16:37,870 --> 00:16:41,100
Setiap kali Anda login, ya, mereka menggunakan enkripsi yang aman,

281
00:16:41,100 --> 00:16:44,300
tetapi setelah itu mereka tidak. Dan mengapa bisa begitu?

282
00:16:44,300 --> 00:16:49,210
Mengapa tidak hanya menggunakan kriptografi sepanjang waktu dalam kasus penggunaan seperti ini?

283
00:16:49,210 --> 00:16:53,700
Apa itu? Saya pikir saya mendengar sesuatu. [Mahasiswa] Kecepatan.

284
00:16:53,700 --> 00:16:56,250
Kecepatan, kan? Ada cara untuk melakukannya.

285
00:16:56,250 --> 00:16:59,610
Tetapi jika Anda hanya semacam memikirkan secara logis, jika Anda mengenkripsi sesuatu,

286
00:16:59,610 --> 00:17:01,820
Anda harus melakukan setidaknya sedikit lebih banyak pekerjaan.

287
00:17:01,820 --> 00:17:05,460
Dalam pset 2 ketika Anda menerapkan Caesar atau Vigenere atau bahkan Crack,

288
00:17:05,460 --> 00:17:07,760
hanya mencetak string relatif mudah.

289
00:17:07,760 --> 00:17:12,040
Enkripsi dan kemudian mencetak string minimal membutuhkan kerja sedikit lebih.

290
00:17:12,040 --> 00:17:14,520
>>  Untuk website super populer seperti Google dan Facebook,

291
00:17:14,520 --> 00:17:18,839
jika Anda harus melakukan lebih banyak pekerjaan untuk setiap pengguna untuk setiap halaman web saja yang mereka kunjungi,

292
00:17:18,839 --> 00:17:20,520
yang hanya membutuhkan lebih banyak waktu CPU.

293
00:17:20,520 --> 00:17:22,920
Dan jika Anda membutuhkan lebih banyak waktu CPU, Anda mungkin perlu lebih banyak server,

294
00:17:22,920 --> 00:17:24,270
yang berarti Anda mungkin perlu lebih banyak uang.

295
00:17:24,270 --> 00:17:27,579
Dan begitu selama bertahun-tahun ini hanya benar-benar tidak praktek terbaik.

296
00:17:27,579 --> 00:17:31,440
Orang-orang akan menggunakan enkripsi SSL hanya ketika mereka perlu.

297
00:17:31,440 --> 00:17:34,960
Tapi ternyata, dan karena hal ini sesama dengan Firesheep dibuat super jelas,

298
00:17:34,960 --> 00:17:37,920
ketika kalian yang saat ini di Facebook sekarang -

299
00:17:37,920 --> 00:17:39,880
Karena penasaran, mari kita lihat apakah Anda akan mengaku.

300
00:17:39,880 --> 00:17:42,620
Jika Anda di Facebook sekarang di tab tertentu, bahkan jika itu tidak dikedepankan,

301
00:17:42,620 --> 00:17:46,610
adalah URL HTTP atau HTTPS?

302
00:17:46,610 --> 00:17:50,560
[Beberapa siswa] S. S? [Tertawa]

303
00:17:50,560 --> 00:17:55,510
Oke. Setiap HTTP? Hanya 1? Oke.

304
00:17:55,510 --> 00:17:58,940
Jadi kita semua bisa hack bahwa pria akun Facebook sekarang.

305
00:17:58,940 --> 00:18:04,100
Untuk sebagian besar ini telah menjadi diaktifkan secara default, setidaknya di beberapa website.

306
00:18:04,100 --> 00:18:08,120
Dan cerita panjang pendek, jika lalu lintas web Anda tidak dienkripsi,

307
00:18:08,120 --> 00:18:12,960
tidak hanya HTML bolak-balik melintasi WiFis tidak terenkripsi,

308
00:18:12,960 --> 00:18:16,760
jadi jangan hal-hal seperti cookies bolak-balik seluruh udara

309
00:18:16,760 --> 00:18:18,940
tanpa bentuk enkripsi.

310
00:18:18,940 --> 00:18:23,540
Jadi jika Anda hanya memiliki sedikit cerdas pemrograman atau sedikit Googling keterampilan

311
00:18:23,540 --> 00:18:27,410
untuk menemukan perangkat lunak bebas yang melakukan ini, yang harus Anda lakukan adalah duduk di Starbucks

312
00:18:27,410 --> 00:18:30,680
atau duduk di bandara di mana ada yang umumnya tidak terenkripsi WiFi

313
00:18:30,680 --> 00:18:36,070
dan hanya menonton untuk kata kunci seperti Set-Cookie: PHPSESSID atau

314
00:18:36,070 --> 00:18:39,300
karena jika Anda memiliki cerdas teknis untuk hanya menonton WiFi

315
00:18:39,300 --> 00:18:43,010
untuk semua bit yang mengalir sepanjang udara untuk pola ini,

316
00:18:43,010 --> 00:18:50,840
Anda kemudian dapat mengatakan bahwa PHPSESSID orang itu kebetulan bo8dal dan sebagainya.

317
00:18:50,840 --> 00:18:53,890
Dan sekali lagi jika Anda cukup teknis cerdas atau memiliki alat yang tepat,

318
00:18:53,890 --> 00:18:58,890
Anda kemudian dapat saja mengkonfigurasi ulang peramban Anda sendiri untuk mulai menyajikan bahwa cap tangan

319
00:18:58,890 --> 00:19:05,030
ke Facebook.com, dan Facebook hanya akan berasumsi bahwa Anda seorang pria yang

320
00:19:05,030 --> 00:19:09,880
karena semua yang mereka tahu tidak siapa Anda tetapi Anda memiliki pengenal yang unik.

321
00:19:09,880 --> 00:19:14,650
Jadi jika Anda mencuri pengenal yang unik dan menyampaikannya ke server web Anda sendiri,

322
00:19:14,650 --> 00:19:16,860
mereka hanya akan menunjukkan kepada Anda feed berita orang itu

323
00:19:16,860 --> 00:19:18,980
atau orang itu pesan atau menusuk.

324
00:19:18,980 --> 00:19:23,190
>> Dan saya akan Google sekarang bagaimana mengaktifkan HTTPS untuk Facebook mungkin.

325
00:19:23,190 --> 00:19:25,150
Tapi itu benar-benar sesederhana itu.

326
00:19:25,150 --> 00:19:27,660
Dan begitu Facebook dan Google dan sejenisnya mendapatkan benar-benar baik ini,

327
00:19:27,660 --> 00:19:31,870
tapi mengawasi keluar semua lebih untuk setiap situs yang Anda kunjungi yang tidak menggunakan HTTP

328
00:19:31,870 --> 00:19:35,020
dan memiliki beberapa jenis informasi sensitif pada mereka,

329
00:19:35,020 --> 00:19:37,490
apakah itu keuangan atau pribadi atau sejenisnya.

330
00:19:37,490 --> 00:19:43,180
Jika mereka tidak menggunakan ini, sangat mungkin bisa cookies seperti ini menjadi sangat mudah dicuri

331
00:19:43,180 --> 00:19:46,270
dan kemudian ditempa, dan itulah apa yang Firesheep lakukan.

332
00:19:46,270 --> 00:19:48,250
Anda tidak perlu menjadi seorang programmer.

333
00:19:48,250 --> 00:19:51,680
Yang Anda harus lakukan adalah memiliki koneksi internet, men-download perangkat gratis ini,

334
00:19:51,680 --> 00:19:56,490
dan apa yang akan dilakukan adalah Anda log in dan kemudian akan menunjukkan nama Facebook

335
00:19:56,490 --> 00:20:00,170
dari semua orang di Sanders, dalam demonstrasi tertentu, di sekitar Anda

336
00:20:00,170 --> 00:20:03,260
dan semua yang Anda harus lakukan adalah klik pada nama mereka dan perangkat lunak otomatis proses

337
00:20:03,260 --> 00:20:05,970
mengendus cookie, menyajikannya ke Facebook Anda sendiri,

338
00:20:05,970 --> 00:20:07,990
dan, voila, Anda login

339
00:20:07,990 --> 00:20:11,190
Jadi ini adalah salah satu dari mereka "jangan lakukan ini" resmi.

340
00:20:11,190 --> 00:20:14,660
Jika Anda memiliki jaringan rumah Anda sendiri dan Anda ingin bermain-main, dengan segala cara,

341
00:20:14,660 --> 00:20:17,530
tapi menyadari hal ini tidak menyeberangi garis pada lingkungan universitas.

342
00:20:17,530 --> 00:20:20,030
>> Tetapi tujuan sini benar-benar untuk menekankan tidak bagaimana melakukan ini

343
00:20:20,030 --> 00:20:22,320
tapi bagaimana untuk membela terhadap jenis-jenis hal.

344
00:20:22,320 --> 00:20:26,180
Dan solusi yang sepele di sini, meskipun itu sendiri adalah cacat,

345
00:20:26,180 --> 00:20:31,360
adalah untuk benar-benar mengurangi penggunaan situs manapun yang tidak menggunakan HTTPS terus-menerus.

346
00:20:31,360 --> 00:20:34,520
Jadi situs seperti Facebook dan Google semakin memiliki kotak centang

347
00:20:34,520 --> 00:20:36,200
di mana Anda dapat memilih untuk hal semacam ini,

348
00:20:36,200 --> 00:20:40,000
dan bank telah memiliki hal ini selama bertahun-tahun untuk alasan yang sama.

349
00:20:40,000 --> 00:20:43,580
Jadi hanya sedikit faktor takut jika kita bisa. Tapi hanya itu singkatnya.

350
00:20:43,580 --> 00:20:46,420
Itu adalah bagaimana server mengingat siapa Anda.

351
00:20:46,420 --> 00:20:50,760
Dan segera setelah mereka bisa mengingat siapa Anda, mereka bisa mengingat apa-apa tentang Anda

352
00:20:50,760 --> 00:20:56,140
bahwa programmer telah disimpan dalam ini superglobal khusus yang disebut $ _SESSION.

353
00:20:56,140 --> 00:20:59,750
Dan untuk pset 7 kita menggunakannya sepele hanya untuk mengingat int,

354
00:20:59,750 --> 00:21:02,260
yaitu ID unik dari pengguna yang telah login,

355
00:21:02,260 --> 00:21:05,880
sehingga kita tahu mereka sudah berada di sana sebelumnya.

356
00:21:05,880 --> 00:21:12,450
Setiap pertanyaan kemudian pada sesi atau cookie atau sejenisnya?

357
00:21:12,450 --> 00:21:15,130
Firesheep tidak bekerja dengan baik lagi,

358
00:21:15,130 --> 00:21:18,310
dan Anda harus menempatkan komputer Anda ke dalam modus promiscuous khusus

359
00:21:18,310 --> 00:21:20,700
sehingga Anda benar-benar mendengarkan untuk lalu lintas selain dirimu.

360
00:21:20,700 --> 00:21:23,940
Jadi jika Anda sedang men-download Firesheep, menyadari itu tidak cukup semudah

361
00:21:23,940 --> 00:21:26,850
seperti dulu untuk menunjukkan.

362
00:21:26,850 --> 00:21:29,070
Baiklah. Dan jangan melakukannya di Sanders. Melakukannya di rumah.

363
00:21:29,070 --> 00:21:30,890
Database.

364
00:21:30,890 --> 00:21:33,580
Salah satu hal yang kita lakukan di pset 7 sangat sengaja

365
00:21:33,580 --> 00:21:37,780
adalah kami memberikan tabel database sampel untuk pengguna yang memiliki beberapa ID pengguna,

366
00:21:37,780 --> 00:21:41,020
beberapa nama pengguna, password terenkripsi dan beberapa di dalamnya.

367
00:21:41,020 --> 00:21:44,520
Dan seperti yang Anda akan melihat, jika Anda belum melakukannya, Anda akan harus mengubah meja sedikit.

368
00:21:44,520 --> 00:21:47,710
Anda akan harus menambahkan beberapa tembolok masing-masing pengguna dalam tabel itu,

369
00:21:47,710 --> 00:21:51,130
dan Anda akan harus menambahkan tabel sejarah, meja portofolio,

370
00:21:51,130 --> 00:21:53,310
atau mungkin menyebutnya sesuatu yang lain.

371
00:21:53,310 --> 00:21:56,740
Tapi dalam hal berpikir tentang bagaimana melakukan hal ini, mari kita membuka alat ini

372
00:21:56,740 --> 00:22:00,570
yang kita digunakan pada hari Jumat, tetapi jika tidak terbiasa, alat dilengkapi dengan alat

373
00:22:00,570 --> 00:22:04,680
disebut phpMyAdmin yang kebetulan ditulis dalam PHP,

374
00:22:04,680 --> 00:22:07,950
tetapi tujuannya dalam hidup, setelah saya login di sini sebagai jharvard dengan merah,

375
00:22:07,950 --> 00:22:15,160
adalah untuk memberikan cara user-friendly dari melihat dan mengubah database saya.

376
00:22:15,160 --> 00:22:18,040
>> Database bahwa aku berjalan pada alat yang disebut MySQL.

377
00:22:18,040 --> 00:22:23,420
Ini sangat populer, dan itu database open source gratis yang luar biasa mudah digunakan,

378
00:22:23,420 --> 00:22:25,620
terutama dengan depan berakhir seperti ini.

379
00:22:25,620 --> 00:22:29,350
Apa alat ini memungkinkan saya untuk melakukan, misalnya, adalah menyodok sekitar meja.

380
00:22:29,350 --> 00:22:30,890
Biarkan aku pergi ke depan dan melakukan hal ini.

381
00:22:30,890 --> 00:22:36,580
Pada hari Jumat kami menciptakan sebuah tabel yang disebut siswa yang super sederhana.

382
00:22:36,580 --> 00:22:41,680
Itu 3 kolom - id, nama, dan email - dan saya secara manual memasukkan beberapa baris

383
00:22:41,680 --> 00:22:44,420
seperti David dan Mike dalam contoh tertentu.

384
00:22:44,420 --> 00:22:47,290
Mari kita mengambil sedikit lebih jauh, dan mari kita asumsikan bahwa kita ingin mengingat lebih

385
00:22:47,290 --> 00:22:49,660
dari sekedar nama dan email tentang pengguna.

386
00:22:49,660 --> 00:22:53,090
Mari saya klik Struktur di sini di bagian atas.

387
00:22:53,090 --> 00:22:55,440
Dan lagi, pset yang menuntun Anda melalui langkah-langkah yang diperlukan di sini,

388
00:22:55,440 --> 00:22:58,150
jadi jangan khawatir jika beberapa dari hal ini adalah sedikit cepat.

389
00:22:58,150 --> 00:22:59,690
Lalu aku akan klik di sini.

390
00:22:59,690 --> 00:23:02,270
Aku akan menambahkan beberapa jumlah kolom setelah email

391
00:23:02,270 --> 00:23:04,130
karena saya ingin menambahkan sesuatu seperti rumah.

392
00:23:04,130 --> 00:23:06,640
Aku lupa untuk merekam rumah siswa.

393
00:23:06,640 --> 00:23:11,400
Biarkan saya klik Go, dan sekarang kami memiliki bentuk yang sayangnya agak lebar dari kiri ke kanan,

394
00:23:11,400 --> 00:23:13,710
tapi aku akan memanggil nama rumah lapangan,

395
00:23:13,710 --> 00:23:16,050
dan kemudian ketik yang sekarang saya harus memilih.

396
00:23:16,050 --> 00:23:18,870
Jadi mari kita obrolan singkat tentang berbagai jenis di MySQL

397
00:23:18,870 --> 00:23:24,590
karena sementara PHP lemah diketik dan semacam bermain cepat dan lepas dengan jenis,

398
00:23:24,590 --> 00:23:29,430
dalam database terutama itu super penting untuk benar-benar menggunakan untuk keuntungan Anda mengetik

399
00:23:29,430 --> 00:23:33,260
karena salah satu hal MySQL dan mesin database lain dapat lakukan untuk Anda

400
00:23:33,260 --> 00:23:37,910
adalah memastikan bahwa Anda tidak memasukkan data palsu ke dalam database Anda.

401
00:23:37,910 --> 00:23:41,850
Ini adalah semacam bebas dari kesalahan pengecekan tersedia untuk Anda.

402
00:23:41,850 --> 00:23:46,250
>> Untuk rumah kami jelas tidak ingin itu menjadi int, yang merupakan nilai 32-bit di MySQL.

403
00:23:46,250 --> 00:23:49,810
Kami melakukan bicara sebentar pada hari Jumat sekitar varchar, yang merupakan singkatan dari panjang variabel char.

404
00:23:49,810 --> 00:23:54,720
Apa ini? Hal ini memungkinkan Anda untuk menentukan bahwa Anda ingin ini menjadi string dari beberapa macam.

405
00:23:54,720 --> 00:23:56,840
Anda tidak benar-benar tahu sebelumnya berapa lama itu,

406
00:23:56,840 --> 00:24:00,100
sehingga kita sewenang-wenang akan mengatakan nama rumah bisa 255 karakter,

407
00:24:00,100 --> 00:24:04,190
tapi Anda bisa pergi dengan 32, 64 - nomor apapun benar-benar.

408
00:24:04,190 --> 00:24:10,700
Namun keuntungan dari menggunakan varchar atas lapangan disebut char adalah apa?

409
00:24:10,700 --> 00:24:15,110
Hanya intuitif jika saya scroll ke bawah sini, melihat ada char dan varchar ada.

410
00:24:15,110 --> 00:24:19,520
Varchar adalah panjang variabel char, char adalah panjang tetap char.

411
00:24:19,520 --> 00:24:24,730
Jadi hanya berdasarkan definisi itu, apa keuntungan atau kerugian dari masing-masing?

412
00:24:24,730 --> 00:24:30,490
Dengan kata lain, siapa yang peduli tentang perbedaan, atau mengapa Anda harus peduli?

413
00:24:31,660 --> 00:24:35,750
>> Ya. [Mahasiswa] VARCHAR memiliki fleksibilitas lebih tetapi membutuhkan lebih banyak memori.

414
00:24:35,750 --> 00:24:40,730
Baik. Varchar mencakup lebih - Mari kita lihat. Saya tidak yakin apakah saya dengar itu.

415
00:24:40,730 --> 00:24:42,360
Dapatkah Anda mengatakan bahwa sekali lagi?

416
00:24:42,360 --> 00:24:45,850
[Mahasiswa] Aku berkata varchar mungkin memiliki lebih banyak fleksibilitas, tetapi tidak memakan banyak memori.

417
00:24:45,850 --> 00:24:51,170
Menarik. Oke. Varchar mungkin memberi Anda lebih banyak fleksibilitas, tetapi membutuhkan lebih banyak memori.

418
00:24:51,170 --> 00:24:53,220
Yang terakhir ini belum tentu benar.

419
00:24:53,220 --> 00:24:56,290
Hal ini tergantung pada konteks, tapi mari kita kembali ke itu.

420
00:24:56,290 --> 00:25:03,230
>> [Respon siswa terdengar] Tepat.

421
00:25:03,230 --> 00:25:06,900
Ini benar-benar terjadi bahwa char biasanya akan menggunakan lebih banyak memori

422
00:25:06,900 --> 00:25:10,950
karena char, seperti di C, seperti string, itu sebuah array dari karakter.

423
00:25:10,950 --> 00:25:13,690
Jadi jika Anda mengatakan bidang char panjang 255,

424
00:25:13,690 --> 00:25:16,910
database secara harfiah akan memberi Anda 255 karakter.

425
00:25:16,910 --> 00:25:22,290
Dan jika rumah akhirnya menjadi Mather dan 6 karakter total,

426
00:25:22,290 --> 00:25:25,090
Anda membuang-buang lebih dari 200 karakter.

427
00:25:25,090 --> 00:25:29,640
>> Jadi varchar efektif hanya menggunakan sebagai karakter sebanyak yang diperlukan

428
00:25:29,640 --> 00:25:31,590
sampai jumlah maksimum.

429
00:25:31,590 --> 00:25:35,470
Tapi harga yang Anda bayar sebenarnya kinerja, berpotensi.

430
00:25:35,470 --> 00:25:39,740
Jika Anda tahu sebelumnya bahwa semua string Anda akan menjadi 8 karakter -

431
00:25:39,740 --> 00:25:43,090
Misalnya, anggaplah bahwa Anda memerlukan password dengan panjang 8 -

432
00:25:43,090 --> 00:25:47,350
terbalik menggunakan field char pada kesempatan, meskipun tidak sering,

433
00:25:47,350 --> 00:25:51,100
adalah untuk menentukan panjang tetap untuk sesuatu seperti sandi

434
00:25:51,100 --> 00:25:53,300
karena sekarang database dapat menjadi lebih pintar.

435
00:25:53,300 --> 00:25:58,160
Jika ia tahu bahwa setiap bidang char, setiap string dalam kolom yang sama panjang,

436
00:25:58,160 --> 00:26:00,780
Anda mendapatkan kembali fitur akses acak.

437
00:26:00,780 --> 00:26:05,110
Anda dapat melompat-lompat di antara bidang arang berbagai tabel database Anda

438
00:26:05,110 --> 00:26:07,940
karena memikirkan database sebagai baris dan kolom.

439
00:26:07,940 --> 00:26:11,670
Jadi jika setiap salah satu dari string adalah panjang yang sama,

440
00:26:11,670 --> 00:26:17,820
Anda tahu bahwa yang pertama adalah pada byte 0, yang berikutnya adalah pada byte 8

441
00:26:17,820 --> 00:26:20,240
dan kemudian 16 dan kemudian 24 dan sebagainya.

442
00:26:20,240 --> 00:26:24,500
Jadi jika semua string adalah dari panjang yang sama, Anda bisa melompat-lompat jauh lebih efisien.

443
00:26:24,500 --> 00:26:26,710
Sehingga dapat menjadi manfaat dalam hal kinerja,

444
00:26:26,710 --> 00:26:29,420
tetapi biasanya Anda tidak memiliki kemewahan untuk mengetahui di muka,

445
00:26:29,420 --> 00:26:32,170
sehingga varchar adalah cara untuk pergi.

446
00:26:32,170 --> 00:26:36,030
Berikut detail lain yang bahkan berlari ke Facebook akhirnya.

447
00:26:36,030 --> 00:26:39,670
Ints besar, dan kami semacam menggunakannya secara default setiap saat kita ingin nomor,

448
00:26:39,670 --> 00:26:41,750
tapi itu hanya 32 bit.

449
00:26:41,750 --> 00:26:46,210
>> Dan meskipun Facebook tidak cukup memiliki 4 miliar pengguna sekarang,

450
00:26:46,210 --> 00:26:48,680
pasti ada beberapa orang di luar sana dengan beberapa account

451
00:26:48,680 --> 00:26:50,960
atau rekening yang telah dibuka dan kemudian ditutup,

452
00:26:50,960 --> 00:26:55,130
dan begitu Facebook sendiri saya percaya beberapa tahun yang lalu harus transisi dari int

453
00:26:55,130 --> 00:27:00,010
untuk, seperti yang tepat disebut, bigint, yang hanya 64 bit sebagai gantinya.

454
00:27:00,010 --> 00:27:02,230
Jadi ini juga merupakan keputusan desain.

455
00:27:02,230 --> 00:27:06,570
Anda akan menjadi luar biasa beruntung jika proyek akhir Anda berubah startup,

456
00:27:06,570 --> 00:27:10,010
memiliki 4 miliar dan 1 pengguna, memberi atau mengambil,

457
00:27:10,010 --> 00:27:13,200
dalam hal ini menggunakan ints mungkin agak rabun.

458
00:27:13,200 --> 00:27:16,230
Namun pada kenyataannya, pengguna meja Anda mungkin baik dengan ints.

459
00:27:16,230 --> 00:27:19,340
Tapi untuk sesuatu seperti pset 7, seperti tabel sejarah Anda,

460
00:27:19,340 --> 00:27:23,700
Anda mungkin memiliki ribuan, jutaan pengguna jika Anda berkembang menjadi etrade.com.

461
00:27:23,700 --> 00:27:26,020
Jadi sementara Anda mungkin tidak memiliki lebih dari 4 miliar pengguna,

462
00:27:26,020 --> 00:27:30,070
para pengguna Anda memiliki mungkin memiliki lebih dari 4 miliar transaksi dari waktu ke waktu -

463
00:27:30,070 --> 00:27:33,200
membeli dan menjual, dan hal dalam sejarah mereka.

464
00:27:33,200 --> 00:27:38,090
Jadi jika Anda mengantisipasi - lagi, ini adalah masalah yang baik untuk memiliki jika Anda memiliki banyak data -

465
00:27:38,090 --> 00:27:40,920
jika Anda mengantisipasi data yang melebihi ukuran int,

466
00:27:40,920 --> 00:27:47,740
pergi dengan sesuatu seperti bigint adalah arah tidak cukup sering diadopsi oleh desainer

467
00:27:47,740 --> 00:27:49,710
karena orang sosok yang tidak akan menjadi masalah,

468
00:27:49,710 --> 00:27:51,930
tapi ini mudah untuk memilih sesuatu yang lebih besar dari itu.

469
00:27:51,930 --> 00:27:55,380
Desimal kita menggunakan di pset 7, yang menentukan tetap presisi

470
00:27:55,380 --> 00:27:59,840
sehingga Anda dapat menghindari masalah yang melibatkan mengapung dan ganda dan real dan sejenisnya.

471
00:27:59,840 --> 00:28:02,440
>> Dan kemudian ada beberapa bidang lain di sini. Kami akan melambaikan tangan kami pada mereka sampai batas tertentu.

472
00:28:02,440 --> 00:28:07,270
Tapi tanggal, waktu semua memiliki format yang ditentukan dalam MySQL,

473
00:28:07,270 --> 00:28:10,830
dan keuntungan dari tanggal menyimpan sebagai tanggal dan tidak varchars

474
00:28:10,830 --> 00:28:15,730
berarti bahwa database benar-benar dapat memformat mereka ke dalam format yang berbeda,

475
00:28:15,730 --> 00:28:18,800
apakah format AS atau format Eropa atau sejenisnya - namun Anda inginkan -

476
00:28:18,800 --> 00:28:22,700
jauh lebih efisien daripada jika hanya beberapa varchar generik.

477
00:28:22,700 --> 00:28:25,150
Dan kemudian ada beberapa biner lainnya, varbinary, gumpalan.

478
00:28:25,150 --> 00:28:28,580
Ini adalah benda besar biner, dan Anda juga dapat menyimpan data biner

479
00:28:28,580 --> 00:28:30,750
serta data geometris dalam database.

480
00:28:30,750 --> 00:28:34,350
Tapi bagi kita, kita biasanya akan peduli ints dan varchars dan sejenisnya.

481
00:28:34,350 --> 00:28:36,230
Mari kita selesaikan contoh ini dengan rumah.

482
00:28:36,230 --> 00:28:40,030
Rumah aku akan sewenang-wenang mengatakan akan 255 karakter.

483
00:28:40,030 --> 00:28:42,850
Kemudian nilai default kita bisa melakukan ini.

484
00:28:42,850 --> 00:28:47,440
Kita bisa secara default menempatkan setiap orang di Mather House misalnya.

485
00:28:47,440 --> 00:28:49,710
Itulah bagaimana kita bisa menentukan bahwa database

486
00:28:49,710 --> 00:28:52,460
harus memastikan bahwa seseorang selalu memiliki nilai. Tapi aku akan meninggalkan itu menjadi.

487
00:28:52,460 --> 00:28:55,270
Bahkan, bagi orang-orang yang hidup dari kampus dan tidak di rumah,

488
00:28:55,270 --> 00:28:59,590
mungkin aku benar-benar ingin menentukan bahwa nilai default untuk rumah adalah NULL,

489
00:28:59,590 --> 00:29:04,890
dan kemudian saya perlu memeriksa kotak ini dan memberitahu database apa-apa jika rumah pengguna adalah NULL.

490
00:29:04,890 --> 00:29:07,270
>> Sekali lagi, ini merupakan salah satu mekanisme pertahanan Anda dapat menempatkan di tempat

491
00:29:07,270 --> 00:29:10,590
sehingga Anda bahkan tidak harus memasukkannya ke dalam kode PHP Anda tentu.

492
00:29:10,590 --> 00:29:14,630
Database akan memastikan bahwa hal-hal yang tidak atau NULL.

493
00:29:14,630 --> 00:29:17,310
Dan kemudian terakhir, Atribut.

494
00:29:17,310 --> 00:29:18,920
Tak satu pun dari ini adalah benar-benar relevan.

495
00:29:18,920 --> 00:29:22,880
Biner, unsigned - tidak satupun dari mereka adalah relevan dengan varchar.

496
00:29:22,880 --> 00:29:24,220
Index.

497
00:29:24,220 --> 00:29:27,320
Apakah ada yang tahu atau ingat atau memiliki menebak seperti apa indeks adalah

498
00:29:27,320 --> 00:29:29,510
untuk sesuatu seperti rumah?

499
00:29:29,510 --> 00:29:35,240
Hal ini juga sebenarnya merupakan keputusan desain yang penting dan relatif mudah.

500
00:29:35,240 --> 00:29:39,200
Bagi mereka yang belum melihatnya, pada hari Jumat kami berbicara singkat tentang kunci primer.

501
00:29:39,200 --> 00:29:43,240
Dalam tabel database, primary key adalah bidang atau kolom

502
00:29:43,240 --> 00:29:46,270
yang secara unik mengidentifikasi baris dalam tabel.

503
00:29:46,270 --> 00:29:49,150
Jadi dalam tabel saat ini kita memiliki ID, kita memiliki nama dan email.

504
00:29:49,150 --> 00:29:52,050
Mana yang adalah kandidat terbaik untuk menjadi primary key,

505
00:29:52,050 --> 00:29:55,810
Peran yang adalah untuk secara unik mengidentifikasi baris?

506
00:29:55,810 --> 00:29:57,530
Mungkin ID.

507
00:29:57,530 --> 00:29:59,930
Diperdebatkan, kita juga bisa menggunakan apa meskipun?

508
00:29:59,930 --> 00:30:02,860
Mungkin Anda bisa menggunakan email karena dalam teori itu unik

509
00:30:02,860 --> 00:30:05,380
kecuali orang yang berbagi account email.

510
00:30:05,380 --> 00:30:09,980
Tetapi kenyataannya adalah bahwa jika Anda menggunakan ID numerik seperti 1234,

511
00:30:09,980 --> 00:30:14,170
itu hanya 32 bit, sedangkan alamat email bisa ini banyak byte atau byte ini banyak.

512
00:30:14,170 --> 00:30:16,610
Jadi dalam hal efisiensi untuk pengidentifikasi unik,

513
00:30:16,610 --> 00:30:19,270
itu cenderung menjadi praktek yang baik hanya untuk menggunakan int

514
00:30:19,270 --> 00:30:23,090
bahkan jika Anda memiliki beberapa calon string yang Anda dibilang bisa menggunakan.

515
00:30:23,090 --> 00:30:26,760
>> Untuk sesuatu seperti rumah, ini seharusnya tidak menjadi primary key

516
00:30:26,760 --> 00:30:30,770
karena kemudian hanya 1 orang bisa hidup di Mather dan 1 orang di Currier dan sejenisnya.

517
00:30:30,770 --> 00:30:32,790
Demikian pula, hal ini tidak harus unik.

518
00:30:32,790 --> 00:30:37,830
Perbedaan antara primer dan unik adalah bahwa dalam kasus meja kami saat ini,

519
00:30:37,830 --> 00:30:42,620
ID akan primer tetapi email tidak utama untuk alasan kami hanya disebutkan -

520
00:30:42,620 --> 00:30:44,740
kinerja - tetapi masih harus unik.

521
00:30:44,740 --> 00:30:47,200
Jadi Anda masih dapat menegakkan keunikan tanpa membuat klaim

522
00:30:47,200 --> 00:30:49,520
bahwa itu adalah bidang utama super penting.

523
00:30:49,520 --> 00:30:52,610
Tapi yang satu ini cukup membantu: Index.

524
00:30:52,610 --> 00:30:56,180
Jika Anda tahu di muka untuk proyek akhir Anda, untuk pset 7, atau secara umum,

525
00:30:56,180 --> 00:30:59,480
bahwa rumah lapangan akan menjadi sesuatu yang Anda cari pada banyak

526
00:30:59,480 --> 00:31:01,910
menggunakan kata kunci pilih atau sesuatu yang lain,

527
00:31:01,910 --> 00:31:05,180
maka Anda preemptively dapat memberitahu database untuk bekerja sihir

528
00:31:05,180 --> 00:31:10,510
dan pastikan bahwa hal itu menciptakan dalam memori setiap struktur data yang diperlukan mewah

529
00:31:10,510 --> 00:31:13,770
untuk mempercepat pencarian berdasarkan rumah.

530
00:31:13,770 --> 00:31:17,860
Mungkin akan menggunakan tabel hash, mungkin itu akan menggunakan linked list.

531
00:31:17,860 --> 00:31:21,260
Pada kenyataannya, ia cenderung menggunakan pohon, sering struktur yang disebut B-tree -

532
00:31:21,260 --> 00:31:24,090
bukan pohon biner tetapi B-pohon - yang merupakan pohon yang sangat luas

533
00:31:24,090 --> 00:31:27,370
yang mungkin Anda lihat di kelas seperti CS124, data struktur kelas.

534
00:31:27,370 --> 00:31:31,800
Tetapi dalam waktu singkat, Anda tidak perlu khawatir tentang hal itu ketika menggunakan perangkat lunak database cerdas.

535
00:31:31,800 --> 00:31:35,890
Anda hanya bisa mengatakan itu, "Indeks bidang ini sehingga saya dapat mencari pada lebih efisien."

536
00:31:35,890 --> 00:31:40,250
>> Jika Anda meninggalkan dari ini dan Anda mencoba untuk mencari semua orang dalam database yang tinggal di Mather,

537
00:31:40,250 --> 00:31:42,710
itu akan berpindah ke pencarian linear.

538
00:31:42,710 --> 00:31:45,360
Dan jika Anda punya 6.000 undergrads hidup semua di rumah sebagian,

539
00:31:45,360 --> 00:31:47,900
Anda akan mencari seluruh tabel untuk menemukan Matherites,

540
00:31:47,900 --> 00:31:52,190
sedangkan jika Anda mengatakan Index, mudah-mudahan itu akan menjadi sesuatu yang dekat dengan pencarian logaritmik

541
00:31:52,190 --> 00:31:54,510
untuk menemukan orang-orang macam siswa.

542
00:31:54,510 --> 00:31:56,750
Ini hanyalah sebuah fitur gratis untuk menghidupkan,

543
00:31:56,750 --> 00:31:59,530
meskipun tidak datang dengan harga beberapa jumlah ruang.

544
00:31:59,530 --> 00:32:02,690
Terakhir, auto-increment, bidang AI,

545
00:32:02,690 --> 00:32:05,830
yang hanya berarti jika int dan Anda tidak ingin peduli untuk kenaikan itu sendiri

546
00:32:05,830 --> 00:32:07,570
setiap kali ada pengguna baru, periksa,

547
00:32:07,570 --> 00:32:11,910
dan setiap pengguna yang akan dimasukkan secara otomatis akan mendapatkan ID baru.

548
00:32:11,910 --> 00:32:15,620
Mari kita klik Simpan, dan sekarang mari kita menemukan kesalahan dengan desain ini.

549
00:32:15,620 --> 00:32:20,200
Jika saya pergi ke People, perhatikan bahwa Mike dan rumah saya adalah NULL.

550
00:32:20,200 --> 00:32:22,420
Saya bisa menggunakan phpMyAdmin untuk mengedit ini secara manual.

551
00:32:22,420 --> 00:32:25,110
Aku bisa pergi di sini dan ketik Mather dan kemudian tekan Enter,

552
00:32:25,110 --> 00:32:27,740
dan sekarang perhatikan tabel berbeda.

553
00:32:27,740 --> 00:32:29,270
Tapi perhatikan aku bisa melakukan sesuatu yang lain juga.

554
00:32:29,270 --> 00:32:33,530
ID David adalah 1, sehingga phpMyAdmin lagi adalah hanya sebuah alat administratif;

555
00:32:33,530 --> 00:32:35,970
ini bukan sesuatu yang pengguna Anda pernah akan melihat.

556
00:32:35,970 --> 00:32:38,810
Jadi jika saya bukan klik tab SQL di bagian atas -

557
00:32:38,810 --> 00:32:41,450
dan lagi, pset 7 akan memperkenalkan Anda ke lebih dari pertanyaan -

558
00:32:41,450 --> 00:32:45,260
Saya secara manual bisa mengeksekusi perintah bahasa query SQL terstruktur

559
00:32:45,260 --> 00:32:56,410
Pengguna UPDATE SET rumah = 'Pfoho' WHERE id = 1.

560
00:32:56,410 --> 00:33:00,830
Ini query SQL, baik cukup, cukup dibaca dari kiri ke kanan.

561
00:33:00,830 --> 00:33:04,350
Memperbarui tabel pengguna, setel field yang disebut rumah untuk Pfoho

562
00:33:04,350 --> 00:33:06,830
mana ID pengguna adalah 1.

563
00:33:06,830 --> 00:33:11,480
Atau aku bahkan bisa dilakukan di mana email = 'malan@harvard.edu'.

564
00:33:11,480 --> 00:33:14,860
Selama yang secara unik mengidentifikasi saya, yang akan bekerja dengan baik.

565
00:33:14,860 --> 00:33:18,810
Tapi ID cenderung kinerja yang lebih tinggi, jadi mari kita lakukan itu.

566
00:33:18,810 --> 00:33:22,950
Mari kita klik Go. Oke, lecture.users tidak ada. Apa kesalahan saya?

567
00:33:22,950 --> 00:33:26,220
Apa meja sebenarnya disebut di sini?

568
00:33:26,220 --> 00:33:28,770
Ini disebut siswa hanya karena itulah apa yang kita lakukan di sini di sebelah kiri atas.

569
00:33:28,770 --> 00:33:31,860
Ini disebut siswa, bukan pengguna. Jadi klik Go sekarang.

570
00:33:31,860 --> 00:33:34,330
1 baris terpengaruh. Permintaan membutuhkan 0,01 detik.

571
00:33:34,330 --> 00:33:38,010
Jika saya klik Browse sekarang, sekarang tinggal di Malan Pfoho.

572
00:33:38,010 --> 00:33:42,070
Jadi itulah rasa lain SQL, tetapi pset akan memandu Anda melalui sedikit lebih dari itu.

573
00:33:42,070 --> 00:33:44,710
>> Ada keputusan yang bodoh Aku sudah dibuat di sini.

574
00:33:44,710 --> 00:33:47,820
Saya berpendapat bahwa ini desain database tidak efisien

575
00:33:47,820 --> 00:33:51,650
karena banyak orang saya tambahkan ke meja siswa,

576
00:33:51,650 --> 00:33:54,730
lebih dari kita saya mulai menambahkan, lebih dari TF saya mulai menambahkan,

577
00:33:54,730 --> 00:33:58,320
kita akan mulai melihat apa yang redudansi dalam tabel ini?

578
00:34:00,840 --> 00:34:06,020
>> Ya. [Mahasiswa] Melihat bahwa itu pada siswa, kita menggunakan yang sama [tidak terdengar]

579
00:34:06,020 --> 00:34:07,360
Sama - Kanan, tepatnya.

580
00:34:07,360 --> 00:34:10,400
Jadi jika 400 orang tinggal di Mather, memberi atau mengambil,

581
00:34:10,400 --> 00:34:15,000
akhirnya tabel ini akan memiliki 400 baris yang mengatakan "Mather," "Mather,"

582
00:34:15,000 --> 00:34:16,590
"Mather," "Mather," "Mather."

583
00:34:16,590 --> 00:34:19,820
Kita membuang-buang semua byte, dan ada beberapa takeaways sana.

584
00:34:19,820 --> 00:34:23,080
1, ada kasus di mana sudut gila jika seseorang membayar banyak uang

585
00:34:23,080 --> 00:34:25,949
dan mengganti nama Mather, sekarang kita harus mengubah tabel database kami seluruh.

586
00:34:25,949 --> 00:34:29,730
Itu tidak akan sering terjadi, meskipun Pfoho pernah disebut North House 15 tahun yang lalu,

587
00:34:29,730 --> 00:34:32,310
sehingga terjadi. Tapi itu tidak semua yang menarik.

588
00:34:32,310 --> 00:34:36,000
Lebih menarik daripada kasus sudut seperti itu yang perlu untuk memperbarui data dalam jumlah besar

589
00:34:36,000 --> 00:34:41,150
untuk database adalah mengapa Anda menyimpan Mather lagi dan lagi dan lagi dan lagi?

590
00:34:41,150 --> 00:34:43,020
Itu banyak karakter, 6 karakter.

591
00:34:43,020 --> 00:34:45,500
Tidak bisa kita lakukan lebih baik dari itu, terutama untuk Pforzheimer?

592
00:34:45,500 --> 00:34:48,320
Tentunya kita bisa berbuat lebih baik dari itu banyak karakter.

593
00:34:48,320 --> 00:34:51,790
Mengapa tidak hanya mengasosiasikan pengenal unik dengan setiap rumah

594
00:34:51,790 --> 00:34:55,020
dan toko yang untuk setiap pengguna? Jadi mari kita coba ini.

595
00:34:55,020 --> 00:35:00,610
Daripada hanya menggunakan tabel siswa, biarkan aku pergi ke database kuliah saya di sini di sebelah kiri atas.

596
00:35:00,610 --> 00:35:02,600
Perhatikan di sini dikatakan Buat tabel.

597
00:35:02,600 --> 00:35:04,550
Mari saya membuat tabel baru yang disebut rumah.

598
00:35:04,550 --> 00:35:08,880
Jumlah kolom akan menjadi 2. Enter.

599
00:35:08,880 --> 00:35:11,200
Sekarang saya memiliki 2 bidang.

600
00:35:11,200 --> 00:35:14,600
Aku akan menyebutnya nama, dan itu akan menjadi varchar dengan panjang 255,

601
00:35:14,600 --> 00:35:18,770
>> tapi itu cukup sewenang-wenang. Mari saya menempatkan ini di sini dengan konvensi.

602
00:35:18,770 --> 00:35:22,840
Sehingga menempatkan ID di sini. Mari kita beri setiap rumah pengenal yang unik.

603
00:35:22,840 --> 00:35:25,360
Mari kita beri setiap rumah nama.

604
00:35:25,360 --> 00:35:30,980
Mari kita menetapkan bahwa pengenal akan unsigned hanya dengan konvensi untuk hanya menggunakan angka positif.

605
00:35:30,980 --> 00:35:35,020
Mari kita pergi ke depan dan memberikan bidang ini auto-increment untuk saat ini.

606
00:35:35,020 --> 00:35:38,160
Dan apakah kita perlu apa-apa lagi?

607
00:35:38,160 --> 00:35:41,010
Mari kita pergi ke depan dan klik Save.

608
00:35:41,010 --> 00:35:42,480
Sekarang saya punya tabel kedua.

609
00:35:42,480 --> 00:35:45,860
Perhatikan sebagai samping ini adalah perintah SQL sedikit samar

610
00:35:45,860 --> 00:35:50,280
bahwa Anda akan harus mengetik secara manual jika tidak menggunakan alat administrasi seperti phpMyAdmin.

611
00:35:50,280 --> 00:35:51,990
Jadi alasan lain kita menggunakannya.

612
00:35:51,990 --> 00:35:55,480
Ini semacam mengagumkan berguna pedagogis karena Anda dapat mengklik sekitar

613
00:35:55,480 --> 00:36:01,050
dan mencari tahu bagaimana segala sesuatu bekerja dengan hanya menyalin dan menyisipkan apa yang phpMyAdmin lakukan.

614
00:36:01,050 --> 00:36:04,150
Tapi perintah tabel Buat apa hanya dieksekusi, dan di sini adalah meja saya.

615
00:36:04,150 --> 00:36:11,370
Biarkan aku pergi ke depan sekarang dan menggunakan SQL mentah daripada menyederhanakan dengan mengklik tab Insert.

616
00:36:11,370 --> 00:36:15,040
Biarkan saya lakukan INSERT INTO rumah,

617
00:36:15,040 --> 00:36:22,230
dan aku akan mengatakan nama rumah akan memiliki nilai 'Mather'.

618
00:36:22,230 --> 00:36:24,790
Itu saja. Sintaks ini sedikit lebih samar.

619
00:36:24,790 --> 00:36:26,660
Ini adalah nama dari bidang yang ingin kita masukkan.

620
00:36:26,660 --> 00:36:30,390
Ini adalah nilai-nilai yang ingin kita masukkan ke dalam bidang-bidang. Biarkan saya klik Go.

621
00:36:30,390 --> 00:36:34,410
1 baris disisipkan mengambil 0,02 detik. Biarkan saya klik Browse sekarang.

622
00:36:34,410 --> 00:36:42,020
>> Perhatikan jika saya klik Browse, ada Mather, yang ID adalah dengan otomatisasi nomor 1.

623
00:36:42,020 --> 00:36:45,000
Biarkan aku melakukan satu lagi. Biarkan aku pergi ke tab SQL.

624
00:36:45,000 --> 00:36:52,950
INSERT INTO rumah. Nama rumah akan memiliki nilai Pfoho dan sebagainya.

625
00:36:52,950 --> 00:36:56,350
Go. Dan saya bisa terus melakukan hal ini lagi dan lagi dan lagi.

626
00:36:56,350 --> 00:36:59,470
Atau jika Anda bosan menggunakan phpMyAdmin, Anda hanya dapat menggunakan tab Insert

627
00:36:59,470 --> 00:37:01,000
dan tidak perlu mengetikkan SQL mentah.

628
00:37:01,000 --> 00:37:04,690
Anda hanya bisa bang itu keluar lebih cepat dengan mengetik, misalnya, Currier, Enter,

629
00:37:04,690 --> 00:37:07,610
dan sekarang jika kita klik Browse, ada Currier dengan ID dari 3.

630
00:37:07,610 --> 00:37:09,920
Jadi ini adalah apa yang kita maksud dengan auto-increment.

631
00:37:09,920 --> 00:37:12,280
Tapi sekarang kita harus memperbaiki sesuatu pada siswa.

632
00:37:12,280 --> 00:37:16,240
Pada siswa apa yang harus tipe data dari bidang rumah sekarang bisa?

633
00:37:16,240 --> 00:37:19,450
Ini harus menjadi int, kan?

634
00:37:19,450 --> 00:37:23,950
Jadi tujuan di sini adalah untuk faktor luar, atau dikenal sebagai menormalkan, tabel

635
00:37:23,950 --> 00:37:27,940
sehingga kita tidak menyimpan informasi secara berlebihan dalam salah satu tabel saya.

636
00:37:27,940 --> 00:37:31,130
Dan lagi, jalan kami berada di sini akan mengatakan Mather, Mather,

637
00:37:31,130 --> 00:37:34,220
Mather, Mather, Pfoho, Pfoho, Pfoho, Pfoho, yang sangat berlebihan

638
00:37:34,220 --> 00:37:36,240
dalam hal pemborosan dari karakter.

639
00:37:36,240 --> 00:37:40,820
Jadi biarkan aku pergi ke depan dan mengubah ini dengan mengklik Struktur,

640
00:37:40,820 --> 00:37:44,620
dan biarkan aku pergi ke depan dan cek lapangan rumah, klik Ubah,

641
00:37:44,620 --> 00:37:46,990
dan sekarang aku akan mengubah ini menjadi sebuah int.

642
00:37:46,990 --> 00:37:49,490
255 tidak lagi relevan.

643
00:37:49,490 --> 00:37:54,010
Biarkan aku pergi ke depan dan mengatakan bahwa tidak apa-apa jika masih NULL. Simpan.

644
00:37:54,010 --> 00:37:55,870
Sekarang siswa tabel telah diubah dengan sukses,

645
00:37:55,870 --> 00:37:59,090
dan perhatikan lagi rumah adalah int.

646
00:37:59,090 --> 00:38:02,220
Sebagai samping, mengabaikan nomor dalam tanda kurung ketika datang ke ints.

647
00:38:02,220 --> 00:38:03,770
>> Ini untuk alasan warisan.

648
00:38:03,770 --> 00:38:06,920
Kembali pada hari ketika Anda tidak memiliki GUI, Anda malah memiliki lingkungan baris perintah,

649
00:38:06,920 --> 00:38:11,580
10 dan 11 masing-masing ditentukan berapa banyak karakter yang Anda harus menunjukkan

650
00:38:11,580 --> 00:38:13,950
di jendela terminal untuk benar-benar menampilkan bidang.

651
00:38:13,950 --> 00:38:19,150
Ini tidak ada hubungannya dengan panjang bit dari lapangan yang sebenarnya, jadi kami hanya akan mengabaikan bahwa untuk saat ini.

652
00:38:19,150 --> 00:38:20,990
Sekarang aku harus pergi ke dalam tabel ini.

653
00:38:20,990 --> 00:38:24,610
Dan jika Daud tinggal di Mather, rumah tidak harus 0,

654
00:38:24,610 --> 00:38:27,350
yang merupakan nilai default int paling dekat dengan NULL.

655
00:38:27,350 --> 00:38:29,810
Dia harus tinggal di rumah 1.

656
00:38:29,810 --> 00:38:36,870
Mari kita sewenang-wenang mengatakan bahwa Mike tinggal di Pfoho, sehingga rumah nomor 2.

657
00:38:36,870 --> 00:38:40,160
Sekarang meja saya terlihat sedikit lebih samar.

658
00:38:40,160 --> 00:38:41,960
Tapi mempertimbangkan efisiensi.

659
00:38:41,960 --> 00:38:44,860
Saya sekarang menggunakan hanya 32 bit untuk mengidentifikasi rumah,

660
00:38:44,860 --> 00:38:49,530
yang berarti hanya ada 1 definisi kanonik rumah saya Mather dan Pfoho

661
00:38:49,530 --> 00:38:52,090
dan itu di meja rumah.

662
00:38:52,090 --> 00:38:55,880
Jadi jika saya ingin bergabung sekarang tabel ini, pikirkan cara ini.

663
00:38:55,880 --> 00:39:01,980
Di sini saya punya meja murid-murid saya, dan di sisi kanan ada angka-angka, 1 dan 2.

664
00:39:01,980 --> 00:39:04,180
1 adalah Mather, 2 adalah Pfoho.

665
00:39:04,180 --> 00:39:08,580
Kami memiliki angka-angka yang sama pada tabel lainnya, yang disebut rumah,

666
00:39:08,580 --> 00:39:11,020
1 dan 2 dan 3 untuk mereka 3 rumah.

667
00:39:11,020 --> 00:39:14,990
Apa yang kita sekarang ingin lakukan adalah memiliki kemampuan dalam kode, PHP dan SQL,

668
00:39:14,990 --> 00:39:18,800
untuk semacam bergabung kembali tabel ini, di mana jika ini adalah para siswa dan ini adalah rumah-rumah,

669
00:39:18,800 --> 00:39:22,050
kami ingin entah bagaimana menggabungkan mereka sehingga 1 baris dengan 1,

670
00:39:22,050 --> 00:39:25,670
2 baris dengan 2, dan sehingga kita bisa mencari tahu di mana David

671
00:39:25,670 --> 00:39:28,000
dan di mana Mike dan di mana orang lain hidup.

672
00:39:28,000 --> 00:39:31,850
Untuk melakukan hal ini kita dapat mengeksekusi query SQL seperti berikut ini.

673
00:39:31,850 --> 00:39:40,470
SELECT * FROM siswa BERGABUNG rumah ON -

674
00:39:40,470 --> 00:39:43,000
Dan sekarang apa bidang yang kita ingin bergabung pada?

675
00:39:43,000 --> 00:39:49,520
Jadi students.house = houses.id.

676
00:39:49,520 --> 00:39:54,150
>> Sebuah samar sedikit, tetapi bagian ini secara harfiah berarti membuat tabel sementara baru

677
00:39:54,150 --> 00:39:56,690
itulah hasil dari bergabung dengan mahasiswa dan rumah-rumah.

678
00:39:56,690 --> 00:40:00,340
Dan bagaimana Anda ingin menggabungkan ujung jari saya di sini?

679
00:40:00,340 --> 00:40:05,280
Set 'lapangan rumah sama dengan rumah' para siswa ID lapangan.

680
00:40:05,280 --> 00:40:10,220
Dan jika saya sekarang klik Go, aku kembali persis apa yang saya berharap untuk.

681
00:40:10,220 --> 00:40:15,890
David adalah di Mather, Mike adalah di Pfoho, dan saya juga melihat pengidentifikasi unik.

682
00:40:15,890 --> 00:40:18,640
Tapi intinya adalah sekarang saya punya tabel lengkap.

683
00:40:18,640 --> 00:40:23,020
Dan jadi takeaway di sini untuk pset 7 atau benar-benar untuk tugas akhir:

684
00:40:23,020 --> 00:40:25,830
Jika Anda menemukan bahwa Anda menyimpan setiap bagian dari informasi yang berlebihan,

685
00:40:25,830 --> 00:40:28,850
apakah itu rumah, mungkin itu sebuah kota, negara, dan ZIP

686
00:40:28,850 --> 00:40:32,050
mana ZIP dapat biasanya tetapi tidak selalu digunakan sebagai identifikasi unik,

687
00:40:32,050 --> 00:40:35,810
pergi melalui latihan mental dan kemudian dengan sesuatu seperti phpMyAdmin

688
00:40:35,810 --> 00:40:40,660
anjak bahwa data umum karena terutama karena website Anda akan lebih baik digunakan

689
00:40:40,660 --> 00:40:45,440
dan lebih populer, ini adalah bagaimana Anda memastikan bahwa segala sesuatu adalah super cepat,

690
00:40:45,440 --> 00:40:51,930
dengan memberikan database sebagai petunjuk sebanyak keunikan mungkin.

691
00:40:51,930 --> 00:40:53,860
Itu banyak.

692
00:40:53,860 --> 00:40:59,010
Ada pertanyaan? Baiklah. Mari kita istirahat 5 menit di sana dan berkumpul kembali.

693
00:41:01,600 --> 00:41:03,540
Baiklah.

694
00:41:03,540 --> 00:41:08,680
Berikut ini adalah contoh yang digunakan beberapa tahun yang lalu ketika saya mengambil CS161,

695
00:41:08,680 --> 00:41:10,960
yang merupakan kelas sistem operasi di kampus

696
00:41:10,960 --> 00:41:15,160
yang dikenal sebagai menakjubkan tetapi jumlah gila kerja,

697
00:41:15,160 --> 00:41:19,810
dan itu benar-benar berfokus pada beberapa tingkat rendah masalah yang timbul dalam sistem operasi

698
00:41:19,810 --> 00:41:22,700
dan juga bahkan di dalam dunia database.

699
00:41:22,700 --> 00:41:27,040
>> Kisah yang diceritakan oleh profesor saya, Margo Seltzer, tahun itu adalah sebagai berikut.

700
00:41:27,040 --> 00:41:30,990
Misalkan Anda memiliki asrama lemari es kecil untuk Anda dan teman sekamar Anda

701
00:41:30,990 --> 00:41:34,030
dan Anda berdua benar-benar seperti susu.

702
00:41:34,030 --> 00:41:36,360
Jadi kamu pulang dari kelas satu hari, teman sekamar Anda belum ada,

703
00:41:36,360 --> 00:41:39,650
Anda membuka lemari es, dan Anda menyadari, "Oh sialan, kita keluar dari susu."

704
00:41:39,650 --> 00:41:42,070
Jadi Anda menutup lemari es, Anda berjalan di seberang jalan ke CVS

705
00:41:42,070 --> 00:41:45,830
dan mendapatkan di garis semakin panjang untuk membeli susu di CVS.

706
00:41:45,830 --> 00:41:48,470
Sementara itu, teman sekamar Anda pulang dari kelasnya,

707
00:41:48,470 --> 00:41:51,690
datang ke kamar, membuka lemari es benar-benar ingin susu,

708
00:41:51,690 --> 00:41:54,130
membuka lemari es dan, "Sial, tidak ada susu."

709
00:41:54,130 --> 00:41:57,890
Jadi dia menutup lemari es, berjalan keluar pintu, dan pergi ke ABP

710
00:41:57,890 --> 00:42:00,910
atau di tempat lain selain CVS di mana Anda tidak akan berbenturan satu sama lain

711
00:42:00,910 --> 00:42:02,790
untuk pergi mendapatkan susu.

712
00:42:02,790 --> 00:42:04,820
Tentu saja beberapa menit kemudian, Anda berdua bisa kembali ke rumah

713
00:42:04,820 --> 00:42:07,740
dan sekarang Anda memiliki susu dua kali sebanyak yang Anda benar-benar ingin.

714
00:42:07,740 --> 00:42:10,670
Dan menjadi susu, sekarang itu akan pergi buruk karena Anda suka susu

715
00:42:10,670 --> 00:42:14,200
tetapi Anda tidak benar-benar seperti susu, jadi sekarang Anda memiliki terlalu banyak susu, sehingga akan asam.

716
00:42:14,200 --> 00:42:16,830
Ini adalah situasi yang mengerikan, mengerikan.

717
00:42:16,830 --> 00:42:22,920
Apa yang bisa memecahkan masalah ini jika Anda adalah rumah teman sekamar pertama? Ya.

718
00:42:22,920 --> 00:42:25,970
[Mahasiswa] Anda harus telah meninggalkan catatan. [Tertawa]

719
00:42:25,970 --> 00:42:28,090
Baik. Anda harus telah meninggalkan catatan.

720
00:42:28,090 --> 00:42:32,320
Anda harus telah menempatkan catatan Post-it atau sejenisnya berkata, "Pergi untuk susu,"

721
00:42:32,320 --> 00:42:36,830
dan kemudian teman sekamar Anda akan konseptual telah terkunci benar-benar melakukan hal itu.

722
00:42:36,830 --> 00:42:38,010
Atau Anda bisa pergi 1 langkah lebih lanjut.

723
00:42:38,010 --> 00:42:41,060
Anda benar-benar bisa mengunci lemari es dengan beberapa jenis gembok,

724
00:42:41,060 --> 00:42:44,870
dan sekarang teman sekamar Anda benar-benar akan terkunci keluar dari lemari es.

725
00:42:44,870 --> 00:42:48,520
Jika kita generalisasi kembali ke pemrograman,

726
00:42:48,520 --> 00:42:51,610
Anda hampir bisa memikirkan kulkas sebagai semacam variabel atau struct,

727
00:42:51,610 --> 00:42:53,500
semacam wadah untuk informasi.

728
00:42:53,500 --> 00:42:58,290
Masalahnya fundamental di sini adalah bahwa Anda berdua diizinkan untuk memeriksa

729
00:42:58,290 --> 00:43:02,370
atau membaca keadaan ini struktur data,

730
00:43:02,370 --> 00:43:08,050
tetapi Anda dilihat itu pada waktu yang berbeda dan belum Anda berdua membuat keputusan

731
00:43:08,050 --> 00:43:11,920
berdasarkan pada keadaan dunia pada saat-saat yang berbeda dalam waktu.

732
00:43:11,920 --> 00:43:15,570
Jadi Anda telah mengunci kulkas, Anda akan setidaknya menghindari teman sekamar Anda

733
00:43:15,570 --> 00:43:19,070
dari yang telah mampu memeriksa keadaan dunia,

734
00:43:19,070 --> 00:43:22,530
sehingga dia tidak bisa membuat keputusan yang sama.

735
00:43:22,530 --> 00:43:25,780
Jadi database, ternyata, memiliki masalah ini terus-menerus.

736
00:43:25,780 --> 00:43:31,050
>> Mari kita lihat apakah kita dapat membangun sebuah skenario.

737
00:43:31,050 --> 00:43:34,310
Misalkan Anda semacam orang jahat dan Anda pergi ke Bank of America

738
00:43:34,310 --> 00:43:37,950
atau salah satu dari tempat-tempat lain di alun-alun yang memiliki sisi beberapa ATM berdampingan,

739
00:43:37,950 --> 00:43:41,200
dan entah bagaimana Anda menemukan cara untuk menduplikasi kartu ATM - tidak terlalu sulit.

740
00:43:41,200 --> 00:43:42,730
Ini hanya strip magnetik.

741
00:43:42,730 --> 00:43:45,180
Dan jadi apa yang ingin Anda coba lakukan adalah memainkan permainan ini

742
00:43:45,180 --> 00:43:49,060
dimana Anda menempatkan 1 kartu ke 1 mesin, kartu lain ke mesin lain,

743
00:43:49,060 --> 00:43:51,980
dan Anda pada dasarnya ingin mencoba untuk menarik uang secara bersamaan,

744
00:43:51,980 --> 00:43:54,930
karena bayangkan cerita yang berlangsung sebagai berikut.

745
00:43:54,930 --> 00:43:57,350
Mesin di sebelah kiri mengambil kartu Anda dan PIN Anda,

746
00:43:57,350 --> 00:44:00,240
dan kemudian Anda berkata, "Berikan saya $ 100."

747
00:44:00,240 --> 00:44:04,790
ATM ini diprogram untuk pertama kali melakukan pilih pada database-nya atau setara -

748
00:44:04,790 --> 00:44:10,780
apa database itu menggunakan - untuk melihat apakah pengguna ini memiliki setidaknya $ 100 dalam account nya?

749
00:44:10,780 --> 00:44:16,180
Jika demikian, maka meludahkan $ 100 dan kurangi $ 100 dari keseimbangan mereka.

750
00:44:16,180 --> 00:44:20,470
Tapi tentu saja jika ada beberapa mesin di sini atau berbagai cara memeriksa

751
00:44:20,470 --> 00:44:23,560
keadaan dunia itu, lemari besi bank, untuk melihat berapa banyak uang yang Anda miliki,

752
00:44:23,560 --> 00:44:26,780
misalkan hanya kebetulan mesin di sebelah kiri dan kanan

753
00:44:26,780 --> 00:44:30,140
keduanya menanyakan hal itu pada kira-kira saat yang sama dalam waktu.

754
00:44:30,140 --> 00:44:34,160
>> Dan ini tentu bisa terjadi. ATM adalah komputer hari ini.

755
00:44:34,160 --> 00:44:37,670
Jadi jika mesin di sebelah kiri berkata, "Ya, Anda memiliki setidaknya $ 100,"

756
00:44:37,670 --> 00:44:42,150
Sementara mesin di sebelah kanan berkata, "Ya, Anda memiliki setidaknya $ 100,"

757
00:44:42,150 --> 00:44:47,420
maka keduanya melanjutkan untuk menyelesaikan program-program mereka dan benar-benar meludahkan $ 100

758
00:44:47,420 --> 00:44:50,820
dan berkata, "Sebelumnya Anda harus $ 200."

759
00:44:50,820 --> 00:44:54,890
"Biar memperbarui variabel sekarang menjadi $ 100 tersisa di rekening."

760
00:44:54,890 --> 00:44:58,780
Tetapi jika keduanya telah memeriksa saldo account Anda dan menemukan bahwa itu $ 200

761
00:44:58,780 --> 00:45:02,000
dan keduanya kemudian melakukan matematika dan mengatakan 200 - 100,

762
00:45:02,000 --> 00:45:06,990
mesin telah berpotensi memuntahkan dua tagihan $ 100 dalam setiap mesin,

763
00:45:06,990 --> 00:45:11,360
tapi mereka hanya diperbarui saldo jumlah akun Anda menjadi $ 100.

764
00:45:11,360 --> 00:45:15,130
Dengan kata lain, Anda telah mengambil keluar $ 200, tetapi karena mereka memeriksa keadaan dunia

765
00:45:15,130 --> 00:45:18,840
secara bersamaan dan kemudian membuat keputusan berdasarkan nilai tersebut,

766
00:45:18,840 --> 00:45:21,930
mereka tidak mungkin melakukan matematika pada akhirnya benar.

767
00:45:21,930 --> 00:45:25,520
Jadi dalam situasi bank yang terlalu Anda benar-benar ingin memiliki semacam lockout

768
00:45:25,520 --> 00:45:28,450
sehingga segera setelah Anda sudah memeriksa keadaan beberapa variabel

769
00:45:28,450 --> 00:45:31,220
yang benar-benar penting, seperti saldo rekening,

770
00:45:31,220 --> 00:45:36,070
jangan biarkan orang lain membuat keputusan berdasarkan itu sampai Anda selesai melakukan hal Anda,

771
00:45:36,070 --> 00:45:38,920
di mana dalam hal ini Anda adalah ATM di sebelah kiri.

772
00:45:38,920 --> 00:45:41,160
Kunci orang lain keluar.

773
00:45:41,160 --> 00:45:44,650
Anda benar-benar dapat mencapai efek ini dalam beberapa cara yang berbeda.

774
00:45:44,650 --> 00:45:48,660
>> Cara termudah di MySQL adalah garis SQL yang kami berikan kepada Anda

775
00:45:48,660 --> 00:45:52,030
dalam spesifikasi masalah set yang terlihat persis seperti ini.

776
00:45:52,030 --> 00:45:57,420
Masukkan ke dalam tabel - apa pun namanya - id, simbol, dan berbagi, sejumlah saham,

777
00:45:57,420 --> 00:45:59,660
nilai-nilai berikut, misalnya.

778
00:45:59,660 --> 00:46:03,370
Jika Anda belum membaca spec belum, ini adalah contoh yang melibatkan bagaimana Anda pergi tentang

779
00:46:03,370 --> 00:46:07,340
membeli 10 saham dari saham penny untuk Presiden Skroob,

780
00:46:07,340 --> 00:46:10,340
ID pengguna yang akan terjadi pada nomor 7?

781
00:46:10,340 --> 00:46:14,070
Ini mengatakan INSERT INTO tabel berikut id, simbol, dan jumlah saham

782
00:46:14,070 --> 00:46:18,200
dari 7, 'DVN.V', dan 10.

783
00:46:18,200 --> 00:46:21,510
Tapi - tapi, tapi, tapi - baris kedua adalah yang penting.

784
00:46:21,510 --> 00:46:26,310
ON duplikat saham UPDATE KEY = saham + VALUES (saham).

785
00:46:26,310 --> 00:46:28,350
Jadi benar-benar samar tampak pada pandangan pertama.

786
00:46:28,350 --> 00:46:31,990
Tapi fakta bahwa ini query SQL, meskipun membungkus ke 2 baris,

787
00:46:31,990 --> 00:46:35,920
adalah 1 query yang panjang, itu berarti itu atom

788
00:46:35,920 --> 00:46:41,000
dalam arti bahwa permintaan ini baik akan dieksekusi semua bersama-sama atau tidak sama sekali.

789
00:46:41,000 --> 00:46:45,100
Dan dengan definisi MySQL, itulah cara mereka menerapkan query ini.

790
00:46:45,100 --> 00:46:51,010
Ini adalah dengan definisi di manual dijamin untuk mengeksekusi sekaligus atau tidak sama sekali.

791
00:46:51,010 --> 00:46:54,020
Motivasi untuk ini adalah sebagai berikut.

792
00:46:54,020 --> 00:46:58,540
Jika dalam kasus ini Anda mencoba untuk membeli 10 saham,

793
00:46:58,540 --> 00:47:02,260
itu semacam cerita yang sama seperti susu, itu semacam cerita yang sama seperti ATM.

794
00:47:02,260 --> 00:47:04,970
>> Jika Anda membuat kesalahan dengan tidak menggunakan sintaks ini

795
00:47:04,970 --> 00:47:09,610
melainkan memilih dari database untuk melihat berapa banyak saham ini saham penny

796
00:47:09,610 --> 00:47:13,750
apakah Presiden Skroob miliki, dan kira dia memiliki 10 saham,

797
00:47:13,750 --> 00:47:19,330
dan kemudian beberapa detik kemudian Anda kemudian melakukan pernyataan UPDATE,

798
00:47:19,330 --> 00:47:24,810
yang merupakan pernyataan lain di SQL yang mengatakan pergi ke depan dan menambahkan 10 saham lebih

799
00:47:24,810 --> 00:47:28,700
sampai 10 saat ini sehingga idealnya total adalah 20,

800
00:47:28,700 --> 00:47:33,490
masalahnya adalah karena dalam sistem database saat ini dan karena di komputer saat ini

801
00:47:33,490 --> 00:47:35,990
Anda memiliki beberapa prosesor, beberapa core -

802
00:47:35,990 --> 00:47:38,920
dengan kata lain, komputer harfiah dapat melakukan beberapa hal sekaligus -

803
00:47:38,920 --> 00:47:44,270
tidak ada jaminan bahwa Anda SELECT dan UPDATE Anda dalam hal ini

804
00:47:44,270 --> 00:47:46,150
akan terjadi kembali ke belakang.

805
00:47:46,150 --> 00:47:49,140
Jadi skenario buruk akan Anda lakukan SELECT

806
00:47:49,140 --> 00:47:51,670
untuk melihat berapa banyak saham ini saham penny tidak Skroob miliki,

807
00:47:51,670 --> 00:47:54,710
dan kemudian hanya dengan kesempatan lain query database dijalankan -

808
00:47:54,710 --> 00:47:57,740
mungkin Skroob dalam jendela browser lain mencoba untuk membeli 10 saham

809
00:47:57,740 --> 00:48:00,700
di jendela lain sama sekali, seperti ATM -

810
00:48:00,700 --> 00:48:05,410
dan anggaplah bahwa permintaan yang lain mendapat di antara SELECT dan UPDATE.

811
00:48:05,410 --> 00:48:10,210
Ini bisa menjadi kasus yang Skroob sekarang kehilangan beberapa jumlah saham

812
00:48:10,210 --> 00:48:14,340
karena proses lain memeriksa keadaan dunianya,

813
00:48:14,340 --> 00:48:17,800
atau ia mendapat saham lebih banyak daripada yang seharusnya.

814
00:48:17,800 --> 00:48:23,250
Kami tidak akan masuk ke ihwal apa yang alur cerita tertentu akan,

815
00:48:23,250 --> 00:48:28,380
tapi intinya adalah jika Anda harus memeriksa nilai variabel dan kemudian membuat keputusan,

816
00:48:28,380 --> 00:48:32,500
jika ada risiko orang lain melakukan sesuatu di antara 2 pernyataan,

817
00:48:32,500 --> 00:48:36,220
seperti yang dapat terjadi dalam sistem multiprosesor, dalam sistem multicore,

818
00:48:36,220 --> 00:48:41,220
komputer dengan kemampuan untuk melakukan hal-hal sekaligus, hal-hal buruk bisa terjadi

819
00:48:41,220 --> 00:48:44,530
seperti rekening bank yang didebet salah, membeli susu dua kali lebih banyak,

820
00:48:44,530 --> 00:48:46,730
atau dalam hal ini jumlah saham yang salah.

821
00:48:46,730 --> 00:48:48,370
Tapi ada cara yang lebih mudah untuk berpikir tentang hal ini.

822
00:48:48,370 --> 00:48:53,290
>> Ternyata SQL juga mendukung, jika Anda mengkonfigurasi meja Anda dengan benar,

823
00:48:53,290 --> 00:48:56,920
sesuatu yang disebut transaksi, yang saya berpendapat sebenarnya lebih mudah untuk memahami

824
00:48:56,920 --> 00:49:00,650
dari ini, tapi itu bukan 1-kapal, sehingga itu sebenarnya sedikit lebih terlibat.

825
00:49:00,650 --> 00:49:04,960
Ada secara harfiah pernyataan di SQL disebut TRANSAKSI MULAI.

826
00:49:04,960 --> 00:49:08,300
Sama seperti ada SELECT, UPDATE, INSERT, DELETE, dan JOIN dan sekelompok orang lain,

827
00:49:08,300 --> 00:49:10,970
ada kata kunci seperti TRANSAKSI MULAI.

828
00:49:10,970 --> 00:49:13,560
Dan apa yang Anda kemudian lakukan dalam konteks pset 7 -

829
00:49:13,560 --> 00:49:17,270
Anda tidak perlu melakukan ini untuk pset 7; itu secara eksplisit menyangkal tidak diperlukan,

830
00:49:17,270 --> 00:49:18,830
tapi untuk proyek akhir ini dapat berguna -

831
00:49:18,830 --> 00:49:22,820
jika Anda memanggil query dari START TRANSAKSI dan kemudian permintaan lain

832
00:49:22,820 --> 00:49:25,620
dan kemudian lain permintaan dan kemudian yang lain, yang lain, dan yang lain,

833
00:49:25,620 --> 00:49:31,860
pertanyaan tersebut sebenarnya tidak akan dijalankan sampai Anda sebut pernyataan SQL COMMIT,

834
00:49:31,860 --> 00:49:37,220
di mana titik, apakah itu 2 pernyataan atau 20 pernyataan, mereka semua akan dijalankan sekaligus,

835
00:49:37,220 --> 00:49:42,770
yang berarti tidak ada orang lain sengaja dapat membeli susu terlalu banyak atau debit terlalu banyak uang

836
00:49:42,770 --> 00:49:46,340
atau membeli saham terlalu banyak karena semua pertanyaan Anda akan mengeksekusi

837
00:49:46,340 --> 00:49:48,410
kembali untuk kembali ke kembali ke belakang.

838
00:49:48,410 --> 00:49:51,580
Dan ini super penting, terutama ketika Anda sedang melakukan sesuatu seperti ini.

839
00:49:51,580 --> 00:49:54,900
Ini adalah contoh yang sewenang-wenang yang mengatakan mari kita memperbarui rekening bank

840
00:49:54,900 --> 00:50:00,200
dengan menetapkan keseimbangan sama dengan saldo - $ 1000 dimana nomor rekening 2.

841
00:50:00,200 --> 00:50:04,260
Dan kemudian pernyataan kedua sekarang mari kita menyetor bahwa $ 1000

842
00:50:04,260 --> 00:50:07,310
ke orang lain rekening bank yang nomor rekening adalah 1.

843
00:50:07,310 --> 00:50:10,400
>> Dengan kata lain, ini adalah contoh sempurna dari mana Anda ingin memastikan

844
00:50:10,400 --> 00:50:13,590
bahwa kedua pernyataan terjadi atau tidak sama sekali

845
00:50:13,590 --> 00:50:15,450
karena jika pelanggan akan mendapatkan kacau

846
00:50:15,450 --> 00:50:17,670
dan Anda akan mengambil uang mereka dan tidak menyetorkannya tempat lain,

847
00:50:17,670 --> 00:50:20,470
atau bank akan mendapatkan kacau di mana Anda akan menyimpan uang

848
00:50:20,470 --> 00:50:23,140
namun tidak benar-benar mengurangi dari akun pengguna.

849
00:50:23,140 --> 00:50:25,810
Jadi Anda ingin keduanya untuk melaksanakan bersama-sama.

850
00:50:25,810 --> 00:50:29,140
Jadi masuk ke dalam transaksi dunia.

851
00:50:29,140 --> 00:50:31,360
Jadi itu sesuatu yang perlu di belakang pikiran Anda,

852
00:50:31,360 --> 00:50:34,710
tidak begitu banyak untuk tujuan hanya sebuah proyek akhir,

853
00:50:34,710 --> 00:50:36,700
tetapi jika Anda ingin mengambil tugas akhir Anda di suatu tempat,

854
00:50:36,700 --> 00:50:39,040
jika Anda ingin untuk memulai beberapa perusahaan di sekitarnya,

855
00:50:39,040 --> 00:50:41,270
jika Anda ingin memecahkan beberapa masalah kelompok mahasiswa di kampus

856
00:50:41,270 --> 00:50:45,210
dan benar-benar memiliki website, hidup aktif, ini adalah semacam bug halus yang dapat timbul

857
00:50:45,210 --> 00:50:49,480
jika Anda tidak cukup memikirkan apa yang bisa terjadi jika 2 orang

858
00:50:49,480 --> 00:50:54,190
mencoba untuk mengakses situs Web Anda di harfiah saat yang sama dalam waktu,

859
00:50:54,190 --> 00:50:56,890
dimana permintaan mereka dinyatakan mungkin bisa terjalin.

860
00:50:58,840 --> 00:51:01,420
>> Siap untuk beberapa JavaScript, teaser daripadanya?

861
00:51:01,420 --> 00:51:04,320
Ini adalah bahasa terakhir kami untuk semester. Baiklah.

862
00:51:04,320 --> 00:51:09,940
Untungnya, JavaScript terlihat sangat, sangat, sangat mirip dengan 2 bahasa, C dan PHP,

863
00:51:09,940 --> 00:51:11,140
sudah kita lakukan sejauh ini.

864
00:51:11,140 --> 00:51:14,340
Tidak ada JavaScript di pset 7, tapi itu alat yang sangat berguna

865
00:51:14,340 --> 00:51:18,840
ketika datang untuk melakukan web berbasis proyek akhir atau benar-benar hanya pemrograman web lebih umum.

866
00:51:18,840 --> 00:51:20,950
Jadi gambaran singkat dari sesuatu yang disebut DOM.

867
00:51:20,950 --> 00:51:23,600
Berikut ini adalah halaman web super sederhana yang benar-benar hanya mengatakan halo, dunia

868
00:51:23,600 --> 00:51:25,970
baik dalam judul dan dalam tubuh.

869
00:51:25,970 --> 00:51:29,270
Sebagai indentasi telah menyarankan untuk beberapa waktu,

870
00:51:29,270 --> 00:51:31,380
memang ada hirarki ke halaman web.

871
00:51:31,380 --> 00:51:34,220
Saya bisa menggambar potongan yang sama dari HTML sebagai pohon,

872
00:51:34,220 --> 00:51:37,470
berpikir kembali ke diskusi kita tentang struktur data dalam C, sebagai berikut.

873
00:51:37,470 --> 00:51:40,710
Saya punya beberapa simpul akar khusus yang disebut node dokumen,

874
00:51:40,710 --> 00:51:43,650
dan kita akan melihat analog ini dalam JavaScript hanya dalam beberapa saat.

875
00:51:43,650 --> 00:51:48,330
Anak pertama dan anak tunggal dari bahwa dalam kasus ini adalah tag HTML.

876
00:51:48,330 --> 00:51:49,880
Tidak ada pemetaan langsung doctype tersebut.

877
00:51:49,880 --> 00:51:53,170
Itu adalah hal yang istimewa, jadi kami hanya harus mengabaikannya ketika datang ke DOM,

878
00:51:53,170 --> 00:51:55,810
Document Object Model ini pohon.

879
00:51:55,810 --> 00:51:59,530
Perhatikan bahwa tag HTML, yang saya telah digambarkan sebagai persegi panjang sewenang-wenang,

880
00:51:59,530 --> 00:52:02,890
memiliki 2 anak: kepala dan tubuh.

881
00:52:02,890 --> 00:52:04,840
>> Mereka sama-sama digambarkan sebagai persegi panjang.

882
00:52:04,840 --> 00:52:08,970
Hal ini bermakna bahwa pictorially kepala di sebelah kiri tubuh.

883
00:52:08,970 --> 00:52:11,960
Implikasinya adalah bahwa kepala datang pertama di pohon.

884
00:52:11,960 --> 00:52:14,910
Jadi sebenarnya ada yang memesan ke sebuah pohon ketika Anda menggambar seperti ini,

885
00:52:14,910 --> 00:52:17,460
meskipun bentuk dan entah apa lagi yang sewenang-wenang.

886
00:52:17,460 --> 00:52:20,360
Kepala Sementara itu memiliki seorang anak tunggal yang disebut title,

887
00:52:20,360 --> 00:52:25,170
dan judul sebenarnya memiliki anak sendiri, yaitu "halo, dunia",

888
00:52:25,170 --> 00:52:32,210
yang saya sengaja menarik sebagai oval sini untuk membuatnya sedikit berbeda dari persegi panjang.

889
00:52:32,210 --> 00:52:37,420
Ini persegi panjang adalah elemen, sedangkan halo, dunia benar-benar node teks.

890
00:52:37,420 --> 00:52:39,850
Jadi itu adalah simpul di pohon, tapi itu jenis yang berbeda dari node

891
00:52:39,850 --> 00:52:41,730
jadi saya menarik itu sewenang-wenang berbeda.

892
00:52:41,730 --> 00:52:45,000
Demikian pula apakah tubuh memiliki anak disebut halo, dunia juga,

893
00:52:45,000 --> 00:52:47,910
begitu berbeda simpul meskipun mereka kebetulan teks yang sama,

894
00:52:47,910 --> 00:52:52,100
tapi aku sudah ditarik menggunakan bentuk yang sama. Jadi siapa yang peduli?

895
00:52:52,100 --> 00:52:56,820
Nah, apa yang bagus tentang HTML adalah bahwa hal itu memiliki sifat hirarkis.

896
00:52:56,820 --> 00:53:01,010
Dan apa yang bagus tentang JavaScript dan khususnya perpustakaan yang tersedia secara bebas

897
00:53:01,010 --> 00:53:07,120
dan populer seperti jQuery, Anda dapat menavigasi struktur pohon begitu luar biasa mudah.

898
00:53:07,120 --> 00:53:11,790
Salah satu hal yang kita lakukan di C dengan pointer dan pohon melintasi dan recursing pada node

899
00:53:11,790 --> 00:53:15,300
anak kiri ke anak kanan, tiba-tiba kita dapat semacam mengambil begitu saja

900
00:53:15,300 --> 00:53:19,450
sebagai luar biasa mencerahkan jika tidak sedikit frustasi

901
00:53:19,450 --> 00:53:22,470
tapi tidak hampir cara yang efisien untuk pergi tentang pemrograman.

902
00:53:22,470 --> 00:53:24,470
Dan sebagainya dengan bahasa tingkat tinggi seperti JavaScript

903
00:53:24,470 --> 00:53:28,340
kita akan dapat menavigasi pohon ini jauh lebih intuitif.

904
00:53:28,340 --> 00:53:30,430
>> Dan memang sintaks akan menjadi cukup akrab.

905
00:53:30,430 --> 00:53:32,950
Jika Anda belum pernah melihat sebelumnya JavaScript, ini adalah referensi benar-benar baik

906
00:53:32,950 --> 00:53:35,910
dari orang-orang Mozilla, orang-orang yang membuat Firefox,

907
00:53:35,910 --> 00:53:38,370
jadi jangan ragu untuk menelusuri bahwa pada kenyamanan Anda.

908
00:53:38,370 --> 00:53:41,590
Apa yang Anda akan menemukan - dan ini slide yang identik dengan apa yang kita digunakan pada hari lain -

909
00:53:41,590 --> 00:53:44,030
sama, utamanya hilang.

910
00:53:44,030 --> 00:53:47,010
Jadi ketika Anda menulis sebuah program dalam JavaScript, tidak ada fungsi utama.

911
00:53:47,010 --> 00:53:48,690
Anda hanya mulai menulis kode.

912
00:53:48,690 --> 00:53:51,660
Tapi perbedaan utama antara JavaScript dan C dan PHP

913
00:53:51,660 --> 00:53:55,890
adalah bahwa sementara C dan PHP sejauh ini telah dilaksanakan sisi server

914
00:53:55,890 --> 00:53:59,180
oleh alat dalam kasus ini atau lebih umum oleh server,

915
00:53:59,180 --> 00:54:04,270
JavaScript dengan desain biasanya dijalankan oleh browser.

916
00:54:04,270 --> 00:54:08,440
Dengan kata lain, Anda mungkin menulis kode JavaScript, seperti yang kita akan,

917
00:54:08,440 --> 00:54:13,080
pada server di alat, tetapi Anda termasuk di antara HTML, CSS antara Anda,

918
00:54:13,080 --> 00:54:16,100
antara GIF dan PNG dan JPEG Anda

919
00:54:16,100 --> 00:54:19,170
sehingga ketika pengguna mengunjungi halaman web Anda, jika Anda menggunakan JavaScript,

920
00:54:19,170 --> 00:54:21,770
bahwa kode JavaScript berasal dari server ke browser,

921
00:54:21,770 --> 00:54:24,540
dan itu adalah browser yang benar-benar melaksanakan itu.

922
00:54:24,540 --> 00:54:27,960
Jadi ini memiliki implikasi yang berarti untuk properti bahkan intelektual.

923
00:54:27,960 --> 00:54:32,600
Ini konyol untuk berpikir tentang melindungi IP Anda ketika datang ke kode JavaScript

924
00:54:32,600 --> 00:54:37,560
karena dengan sifat bahasa itu dijalankan biasanya sisi browser.

925
00:54:37,560 --> 00:54:40,360
>> Anda dapat mengaburkan itu, yang berarti Anda dapat membuatnya terlihat gila dan jelek

926
00:54:40,360 --> 00:54:45,400
tanpa spasi, nama variabel mengerikan, untuk membuat lebih sulit bagi orang untuk mencuri IP Anda,

927
00:54:45,400 --> 00:54:48,120
tapi kuncinya adalah bahwa hal itu dijalankan sisi browser.

928
00:54:48,120 --> 00:54:51,790
Meskipun sebagai sisi server selain JavaScript dapat digunakan,

929
00:54:51,790 --> 00:54:54,480
kasus penggunaan yang paling umum saat ini adalah masih pada browser.

930
00:54:54,480 --> 00:54:59,800
Dan inilah apa yang tampak seperti. Berikut adalah jika-lain jika-lain membangun seperti C, seperti PHP.

931
00:54:59,800 --> 00:55:02,420
Berikut adalah ekspresi Boolean ketika Anda "atau" 2 hal bersama-sama.

932
00:55:02,420 --> 00:55:04,330
Berikut ini adalah ketika Anda "dan" 2 hal bersama-sama.

933
00:55:04,330 --> 00:55:08,300
Berikut ini adalah pernyataan switch, yang mirip dengan PHP

934
00:55:08,300 --> 00:55:10,810
karena Anda dapat mengaktifkan berbagai jenis nilai.

935
00:55:10,810 --> 00:55:15,180
Loops sama memiliki untuk loop di sini, yang terstruktur identik dengan apa yang telah kita lihat sebelumnya.

936
00:55:15,180 --> 00:55:18,110
Sementara loop, kami telah mendapat lakukan sementara loop.

937
00:55:18,110 --> 00:55:20,290
Variabel, pernah jadi sedikit berbeda.

938
00:55:20,290 --> 00:55:24,560
Anda mendeklarasikan variabel seperti yang Anda lakukan di PHP dan C,

939
00:55:24,560 --> 00:55:27,860
tapi sama ini JavaScript lemah diketik.

940
00:55:27,860 --> 00:55:32,730
Anda tidak menentukan int atau float atau string atau sesuatu seperti itu biasanya.

941
00:55:32,730 --> 00:55:34,240
Anda dapat menentukan var.

942
00:55:34,240 --> 00:55:38,040
Anda tidak harus menentukan var, tetapi memiliki implikasi jika Anda tidak.

943
00:55:38,040 --> 00:55:42,000
Biasanya jika Anda menghilangkan var, Anda secara tidak sengaja membuat variabel global bukan lokal.

944
00:55:42,000 --> 00:55:46,420
Jadi biarkan saya mengusulkan bahwa Anda hampir selalu hanya mengatakan var dan kemudian nama variabel.

945
00:55:46,420 --> 00:55:48,740
Ini bukan tipe, itu hanya var untuk variabel.

946
00:55:48,740 --> 00:55:52,930
Ini akan menjadi contoh, apakah itu 123 atau "halo, dunia".

947
00:55:52,930 --> 00:55:58,910
Array hadir dan sintaktis mirip dengan PHP.

948
00:55:58,910 --> 00:56:03,690
Aku akan mengatakan angka var dan kemudian saya menggunakan tanda kurung siku lagi untuk mendeklarasikan variabel

949
00:56:03,690 --> 00:56:08,870
yang tipe adalah array yang memiliki angka-angka tertentu di dalamnya dipisahkan dengan koma.

950
00:56:08,870 --> 00:56:11,740
Dan kemudian terakhir, ini adalah satu-satunya yang benar-benar terlihat berbeda.

951
00:56:11,740 --> 00:56:16,700
Ingatlah bahwa di PHP kita akan mengimplementasikan array asosiatif untuk mahasiswa

952
00:56:16,700 --> 00:56:20,220
seperti Zamyla yang mungkin terlihat seperti ini, di mana variabel ini disebut mahasiswa.

953
00:56:20,220 --> 00:56:23,370
Tanda kurung persegi berarti di sini datang array.

954
00:56:23,370 --> 00:56:28,500
>> Kenyataan bahwa aku tidak menggunakan indeks numerik, tetapi string - id, rumah, dan nama -

955
00:56:28,500 --> 00:56:30,990
berarti bahwa ini adalah array asosiatif,

956
00:56:30,990 --> 00:56:34,490
dan panah-panah dengan tanda sama dan braket siku

957
00:56:34,490 --> 00:56:37,310
berarti bahwa kuncinya adalah "id", nilai adalah 1;

958
00:56:37,310 --> 00:56:39,310
kuncinya adalah "rumah", nilai tersebut Winthrop House;

959
00:56:39,310 --> 00:56:41,800
kuncinya adalah "nama", nilai tersebut Zamyla Chan.

960
00:56:41,800 --> 00:56:47,110
Jadi ada 3 kunci dalam array asosiatif ini, masing-masing memiliki nilai sendiri.

961
00:56:47,110 --> 00:56:52,880
Kita telah melihat bahwa di pset 7, atau Anda akan segera, dalam ide JavaScript yang sama,

962
00:56:52,880 --> 00:56:55,220
tapi itu akan terlihat seperti ini.

963
00:56:55,220 --> 00:57:00,070
Jadi var mahasiswa - ada tanda-tanda dolar dan tidak menyebutkan jenis masih namun var -

964
00:57:00,070 --> 00:57:05,860
sama dan kemudian buka kurung kurawal karena dalam JavaScript ketika Anda memiliki pasangan nilai kunci,

965
00:57:05,860 --> 00:57:08,900
Anda benar-benar menggunakan sesuatu yang disebut objek.

966
00:57:08,900 --> 00:57:13,490
Dan anda yang tidak mengambil APCS atau sejenisnya mungkin ingat benda dari Jawa

967
00:57:13,490 --> 00:57:15,140
atau bahasa yang sama.

968
00:57:15,140 --> 00:57:17,880
JavaScript tidak Jawa, pertama-tama.

969
00:57:17,880 --> 00:57:21,600
Itu adalah tahun desain yang disengaja keputusan lalu mengetuk off sesuatu yang lain yang populer,

970
00:57:21,600 --> 00:57:25,640
namanya, meskipun tidak memiliki hubungan mendasar ke Jawa itu sendiri.

971
00:57:25,640 --> 00:57:31,490
JavaScript memiliki benda-benda, dan Anda membuat mereka dengan cara notasi kurung kurawal.

972
00:57:31,490 --> 00:57:36,710
Obyek dalam JavaScript yang cukup banyak setara dengan array asosiatif di PHP

973
00:57:36,710 --> 00:57:40,030
ketika datang ke menyimpan data dalam diri mereka.

974
00:57:40,030 --> 00:57:44,100
>> Tetapi bahkan lebih kuat dalam JavaScript dapat Anda mengasosiasikan sangat mudah fungsi

975
00:57:44,100 --> 00:57:48,040
dalam suatu objek, dan meskipun Anda dapat melakukan hal ini dalam bahasa lain,

976
00:57:48,040 --> 00:57:50,040
itu cukup paradigma umum, seperti yang akan kita lihat.

977
00:57:50,040 --> 00:57:54,380
Singkatnya, obyek ini merupakan mahasiswa, yang sangat Zamyla,

978
00:57:54,380 --> 00:58:00,380
dan itu mirip konseptual, hanya sintaktis berbeda dari ini.

979
00:58:00,380 --> 00:58:03,840
Mari kita benar-benar menggunakan JavaScript dalam sebuah file.

980
00:58:03,840 --> 00:58:05,570
Ternyata ada tag script.

981
00:58:05,570 --> 00:58:08,180
Kami telah melihat tag gaya dan kami telah melihat tag HTML lainnya.

982
00:58:08,180 --> 00:58:11,510
Tag script sebenarnya akan berisi beberapa kode JavaScript.

983
00:58:11,510 --> 00:58:15,500
Biarkan aku pergi ke dalam alat di mana kita memiliki beberapa kode sumber pra-dibuat.

984
00:58:15,500 --> 00:58:18,700
Saya belum diposting belum di website, tapi saya akan melakukan itu setelah kelas.

985
00:58:18,700 --> 00:58:21,770
Mari kita membuka satu ini, blink.html.

986
00:58:21,770 --> 00:58:27,560
Kembali di tahun 1990-an, ada benar-benar sebuah tag HTML disebut tag blink,

987
00:58:27,560 --> 00:58:30,340
dan ini adalah salah satu tag yang paling mengagumkan terlalu sering digunakan di Internet

988
00:58:30,340 --> 00:58:36,140
dimana Anda akan mengunjungi beberapa halaman gaya 1990-an web dan mulai melihat teks berkedip seperti ini,

989
00:58:36,140 --> 00:58:39,810
hasil tag marquis, yang telah teks akan seperti ini.

990
00:58:39,810 --> 00:58:45,070
Salah satu dari beberapa kali di mana dunia telah benar-benar menyepakati standar web,

991
00:58:45,070 --> 00:58:48,250
semua orang di seluruh papan membunuh tag berkedip beberapa tahun yang lalu.

992
00:58:48,250 --> 00:58:52,860
Tapi kita bisa membangkitkan dengan JavaScript sebagai demonstrasi kekuatan yang Anda miliki

993
00:58:52,860 --> 00:58:56,660
ketika Anda dapat menulis sebuah program dalam sebuah halaman web.

994
00:58:56,660 --> 00:59:00,240
Pertama mari kita melewatkan hal-hal baru dan fokus hanya pada yang lama.

995
00:59:00,240 --> 00:59:01,780
>> Berikut adalah barang lama dalam contoh ini.

996
00:59:01,780 --> 00:59:06,350
Saya memiliki sebuah tag HTML, tag kepala, dan tag judul.

997
00:59:06,350 --> 00:59:11,210
Lalu aku memiliki tag body di sini dengan div, yang recall hanya sebuah divisi persegi panjang halaman

998
00:59:11,210 --> 00:59:14,720
bahwa saya sudah diberi ID yang unik secara sewenang-wenang dari "ucapan" untuk,

999
00:59:14,720 --> 00:59:18,320
hanya jadi saya memiliki cara unik merujuk ke sana, yang memiliki beberapa teks yang sangat sederhana:

1000
00:59:18,320 --> 00:59:20,220
halo, dunia.

1001
00:59:20,220 --> 00:59:23,940
Sekarang biarkan aku gulir ke atas ke atas file ini dan melihat apa yang baru.

1002
00:59:23,940 --> 00:59:27,710
Hal pertama yang top up baru adalah tag script,

1003
00:59:27,710 --> 00:59:31,280
dan dalam pemberitahuan tag script saya sudah menyatakan fungsi.

1004
00:59:31,280 --> 00:59:34,610
Untuk menyatakan fungsi dalam JavaScript, sangat mirip dengan PHP,

1005
00:59:34,610 --> 00:59:37,930
Anda benar-benar menulis fungsi maka nama fungsi, tanda kurung,

1006
00:59:37,930 --> 00:59:40,400
dan mungkin beberapa argumen jika itu membutuhkan apapun.

1007
00:59:40,400 --> 00:59:43,510
Lalu aku punya penjepit keriting saya seperti biasa, dan sekarang kami memiliki beberapa kode yang sedikit baru,

1008
00:59:43,510 --> 00:59:45,230
tapi mari kita lihat apa artinya ini.

1009
00:59:45,230 --> 00:59:48,670
Jadi div var, ini hanya berarti memberi saya div disebut variabel.

1010
00:59:48,670 --> 00:59:50,530
Saya bisa menyebutnya foo, tapi aku ingin itu harus disebut div

1011
00:59:50,530 --> 00:59:52,620
untuk alasan yang akan menjadi jelas dalam satu detik.

1012
00:59:52,620 --> 00:59:57,480
Kemudian ternyata dalam JavaScript - dan ini adalah kode JavaScript tertanam di halaman web saya -

1013
00:59:57,480 --> 01:00:01,760
ada variabel global khusus yang disebut macam dokumen.

1014
01:00:01,760 --> 01:00:04,780
JavaScript sebenarnya merupakan bahasa berorientasi objek.

1015
01:00:04,780 --> 01:00:07,230
Kami tidak akan pergi ke detail di 50 seperti apa yang berarti,

1016
01:00:07,230 --> 01:00:11,180
tapi untuk sekarang tahu bahwa sebuah benda yang cukup banyak seperti struct.

1017
01:00:11,180 --> 01:00:14,740
Seperti kita melihat jalan kembali ketika di salah satu dari masalah awal set

1018
01:00:14,740 --> 01:00:17,150
di mana kami menempatkan banyak informasi dalam sebuah struct,

1019
01:00:17,150 --> 01:00:21,330
sama adalah mendokumentasikan struct khusus yang dilengkapi dengan browser,

1020
01:00:21,330 --> 01:00:24,810
dilengkapi dengan halaman web. Ini bukan sesuatu yang saya buat.

1021
01:00:24,810 --> 01:00:28,210
Di dalam struktur dokumen, meskipun, Anda tidak hanya data yang

1022
01:00:28,210 --> 01:00:30,010
tetapi Anda juga memiliki fungsi.

1023
01:00:30,010 --> 01:00:34,090
>> Dan setiap kali Anda memiliki fungsi dalam struktur, dalam suatu objek,

1024
01:00:34,090 --> 01:00:36,490
itu disebut metode. Tapi itu hal yang sama.

1025
01:00:36,490 --> 01:00:40,110
Metode adalah fungsi yang kebetulan berada di dalam sesuatu yang lain.

1026
01:00:40,110 --> 01:00:42,990
Jadi ini berarti bahwa variabel global khusus yang disebut dokumen

1027
01:00:42,990 --> 01:00:47,690
telah disebut fungsi getElementById yang benar-benar melakukan itu.

1028
01:00:47,690 --> 01:00:52,460
Ini akan membuat Anda sebuah elemen dari DOM, Document Object Model pohon,

1029
01:00:52,460 --> 01:00:55,520
mana ID adalah dalam ucapan kasus.

1030
01:00:55,520 --> 01:00:59,200
Dengan kata lain, semua waktu kita dihabiskan untuk struktur data datang ke dalam bermain di sini.

1031
01:00:59,200 --> 01:01:01,400
Ini gambar DOM bahwa kita memiliki beberapa saat yang lalu,

1032
01:01:01,400 --> 01:01:06,100
meskipun halaman ini sedikit berbeda, jika saya punya div dalam gambar ini,

1033
01:01:06,100 --> 01:01:11,180
apa document.getElementById akan kembali kepada saya secara efektif akan menjadi pointer

1034
01:01:11,180 --> 01:01:15,440
ke persegi panjang di pohon, referensi ke persegi panjang di atas pohon.

1035
01:01:15,440 --> 01:01:18,410
Jadi itulah apa artinya benar-benar memanggil salah satu fungsi.

1036
01:01:18,410 --> 01:01:21,960
Dalam kasus ini lagi itu div. Ini bukan badan atau judul.

1037
01:01:21,960 --> 01:01:26,480
Jadi mari kita lihat apa yang saya lakukan kemudian dengan div ini sekarang bahwa saya memilikinya dalam div ini disebut variabel.

1038
01:01:26,480 --> 01:01:32,580
Ternyata dengan JavaScript Anda memiliki kemampuan untuk men-tweak CSS dari halaman Anda secara dinamis.

1039
01:01:32,580 --> 01:01:39,060
Sampai saat ini, semua CSS yang telah kami lakukan, meskipun terbatas, dalam gaya atribut,

1040
01:01:39,060 --> 01:01:41,730
atau di mana pun yang telah kita menempatkan CSS?

1041
01:01:42,730 --> 01:01:45,810
Aku agak manja yang satu. Dalam tag gaya di bagian atas file.

1042
01:01:45,810 --> 01:01:49,180
Atau tempat ketiga telah?

1043
01:01:50,710 --> 01:01:54,590
>> Sebuah file eksternal, sesuatu. Css.

1044
01:01:54,590 --> 01:01:56,730
Jadi mereka adalah 3 tempat yang telah kami lakukan sejauh CSS,

1045
01:01:56,730 --> 01:01:59,310
tapi hasil tangkapan adalah kita telah keras kode semuanya.

1046
01:01:59,310 --> 01:02:04,060
Anda memutuskan seperti yang Anda terjun ke pset 7, kami memutuskan sebelum kuliah apa yang akan kita CSS.

1047
01:02:04,060 --> 01:02:07,380
Tetapi jika Anda ingin mengubah CSS Anda, Anda benar-benar dapat melakukan itu

1048
01:02:07,380 --> 01:02:09,370
setelah Anda memiliki bahasa pemrograman yang sebenarnya.

1049
01:02:09,370 --> 01:02:13,910
CSS, HTML - bahasa pemrograman tidak. JavaScript.

1050
01:02:13,910 --> 01:02:18,200
Jadi ternyata bahwa segera setelah Anda memiliki salah satu persegi panjang dari pohon

1051
01:02:18,200 --> 01:02:23,050
disebut DOM, memiliki sendiri beberapa data di dalamnya.

1052
01:02:23,050 --> 01:02:27,820
Jadi div bahwa aku hanya menyambar dari pohon memiliki apa yang kita akan menelepon properti di dalamnya

1053
01:02:27,820 --> 01:02:34,390
disebut gaya, dan properti gaya sendiri telah properti yang disebut visibilitas.

1054
01:02:34,390 --> 01:02:37,330
Saya tahu ini hanya dengan melihat panduan pengguna CSS.

1055
01:02:37,330 --> 01:02:41,160
Ternyata ada properti visibilitas CSS yang melakukan apa yang dikatakannya.

1056
01:02:41,160 --> 01:02:44,530
Itu membuat sesuatu yang terlihat atau tidak, terlihat atau tidak.

1057
01:02:44,530 --> 01:02:46,810
Dan bagaimana Anda melakukannya adalah ini.

1058
01:02:46,810 --> 01:02:50,510
Saya minta pemrograman jika visibilitas div ini tersembunyi,

1059
01:02:50,510 --> 01:02:53,390
apa yang harus saya mengubahnya ke? Terlihat.

1060
01:02:53,390 --> 01:02:58,840
Lain jika visibilitas halaman ini tidak tersembunyi, secara logis saya membuatnya tersembunyi.

1061
01:02:58,840 --> 01:03:04,070
Saya tidak tahu mengapa hal itu terlihat dan tersembunyi dan tidak terlihat dan tak terlihat.

1062
01:03:04,070 --> 01:03:06,000
Ini adalah keputusan desain yang buruk sepanjang jalan.

1063
01:03:06,000 --> 01:03:09,530
Tetapi mereka memang bertentangan dalam CSS: terlihat dan tersembunyi.

1064
01:03:09,530 --> 01:03:15,520
Semua ini tidak itu berarti mengubah CSS dari file saya dan mematikan, dan mematikan

1065
01:03:15,520 --> 01:03:16,870
untuk itu div tertentu.

1066
01:03:16,870 --> 01:03:20,630
Tapi sekali lagi, ini adalah fungsi yang disebut berkedip. Kapan fungsi berkedip disebut?

1067
01:03:20,630 --> 01:03:24,080
Ternyata bahwa ada jendela lain khusus yang disebut variabel global,

1068
01:03:24,080 --> 01:03:28,220
semangat yang sama dokumen, tetapi sementara dokumen mengacu ke halaman web Anda,

1069
01:03:28,220 --> 01:03:31,700
seperti pohon DOM, HTML Anda dikirim dari server,

1070
01:03:31,700 --> 01:03:35,250
Jendela mengacu pada krom sekitarnya, address bar, bar judul,

1071
01:03:35,250 --> 01:03:37,880
dan semua hal-hal di sekitar halaman web Anda.

1072
01:03:37,880 --> 01:03:42,800
>> Dan ternyata bahwa objek memiliki jendela dalam fungsi khusus itu disebut setInterval

1073
01:03:42,800 --> 01:03:44,360
yang melakukan apa yang dikatakannya.

1074
01:03:44,360 --> 01:03:48,600
Ini akan mengatur interval - dalam hal ini setiap 500 milidetik -

1075
01:03:48,600 --> 01:03:52,270
dan, mengambil menebak, apa yang akan dilakukan setiap 500 milidetik?

1076
01:03:52,270 --> 01:03:55,240
Ini akan mengeksekusi bahwa blink fungsi.

1077
01:03:55,240 --> 01:03:58,560
Dan apa yang bagus di sini adalah bahwa kita bisa melakukan ini di C meskipun kita tidak pernah melakukannya.

1078
01:03:58,560 --> 01:04:01,580
C memang memiliki sesuatu yang disebut fungsi pointer di mana Anda dapat melewati fungsi sekitar

1079
01:04:01,580 --> 01:04:03,140
sebagai argumen.

1080
01:04:03,140 --> 01:04:07,620
Demikian pula dalam JavaScript dapat Anda berikan nama fungsi ke fungsi lain.

1081
01:04:07,620 --> 01:04:10,630
Dan perhatikan apa yang saya lakukan. Aku tidak melakukan hal ini.

1082
01:04:10,630 --> 01:04:14,380
Jika saya menempatkan tanda kurung setelah sekejap, itu berarti memanggil fungsi berkedip.

1083
01:04:14,380 --> 01:04:17,430
Jika saya menghilangkan mereka, itu berarti di sini adalah fungsi berkedip

1084
01:04:17,430 --> 01:04:21,330
sehingga setInterval yang dapat menyebutnya setiap 500 milidetik.

1085
01:04:21,330 --> 01:04:28,200
Jadi hasil akhirnya, mengerikan meskipun, adalah bahwa jika saya pergi ke localhost dan pergi ke blink.html,

1086
01:04:28,200 --> 01:04:32,120
Saya sekarang memiliki hal ini terjadi lagi dan lagi.

1087
01:04:32,120 --> 01:04:34,950
Dan jika saya benar-benar Inspect Element, mari kita lihat apakah kita bisa melihat ini.

1088
01:04:34,950 --> 01:04:38,550
Biarkan saya Inspect Element, biarkan aku gulir ke bawah hanya sedikit,

1089
01:04:38,550 --> 01:04:44,320
biarkan aku memilih Elements di sini, dan perhatikan bagian dalam DOM inspektur Chrome.

1090
01:04:44,320 --> 01:04:48,840
Ini benar-benar mengubah bolak-balik setiap 500 milidetik.

1091
01:04:48,840 --> 01:04:55,660
Jika kita pergi ke teman kita Nate,

1092
01:04:55,660 --> 01:05:00,020
jika Anda pernah bertanya-tanya bagaimana hal ini bekerja, ide serupa dengan interval,

1093
01:05:00,020 --> 01:05:04,810
namun Nate sebenarnya memanfaatkan sangat efektif warna dalam kasus khusus ini di sini.

1094
01:05:04,810 --> 01:05:07,350
Jadi apa lagi yang bisa kita benar-benar melakukan dengan ini?

1095
01:05:07,350 --> 01:05:09,990
Mari kita membuka contoh lain dan mencoba sesuatu

1096
01:05:09,990 --> 01:05:12,940
itu pemrograman bahkan lebih berguna daripada membuat berkedip hal.

1097
01:05:12,940 --> 01:05:17,990
Biarkan aku pergi ke direktori bentuk kami hari ini dan masuk ke form0.

1098
01:05:17,990 --> 01:05:20,820
Ini adalah bentuk paling jelek mungkin bahwa aku bisa datang dengan,

1099
01:05:20,820 --> 01:05:23,290
dan biarkan aku hanya menunjukkan apa yang tampak seperti di browser.

1100
01:05:23,290 --> 01:05:28,960
>> Biarkan aku pergi ke localhost / bentuk, dan ini adalah form0.

1101
01:05:28,960 --> 01:05:33,400
Ini adalah bentuk HTML Super jelek yang memiliki beberapa bidang untuk email, password,

1102
01:05:33,400 --> 01:05:37,190
sandi, dan kemudian kotak centang sedikit untuk menyetujui beberapa persyaratan dan ketentuan.

1103
01:05:37,190 --> 01:05:41,350
Menangkap adalah jika saya mengunjungi formulir ini dan saya tidak ingin memberikan alamat email saya,

1104
01:05:41,350 --> 01:05:44,730
Saya tidak ingin setuju dengan persyaratan dan kondisi yang mungkin, saya bisa klik Daftar

1105
01:05:44,730 --> 01:05:46,920
dan itu memungkinkan saya melalui pula.

1106
01:05:46,920 --> 01:05:50,800
Hal ini terjadi untuk menyerahkan ke file PHP bodoh disebut dump.php.

1107
01:05:50,800 --> 01:05:58,420
Semua hal ini adalah mencetak isi dari $ _GET hanya untuk tujuan diagnostik.

1108
01:05:58,420 --> 01:06:01,580
Itulah yang disampaikan oleh pengguna hanya sekarang.

1109
01:06:01,580 --> 01:06:05,010
Tapi bagaimana kalau kita benar-benar ingin memvalidasi pengiriman formulir pengguna.

1110
01:06:05,010 --> 01:06:06,530
Biarkan aku pergi ke versi 1.

1111
01:06:06,530 --> 01:06:11,420
Ini form1.html. Ini terlihat estetis sama buruknya, tapi perhatikan bagaimana mewah itu.

1112
01:06:11,420 --> 01:06:15,450
Jika saya klik Daftar tanpa bekerja sama, saya dimarahi.

1113
01:06:15,450 --> 01:06:17,320
"Anda harus memberikan alamat email Anda."

1114
01:06:17,320 --> 01:06:21,670
Baiklah. Jadi biarkan aku coba itu. Jadi malan@harvard.edu. Aku tidak membutuhkan password.

1115
01:06:21,670 --> 01:06:25,100
Daftar. "Anda harus memberikan password." Baiklah.

1116
01:06:25,100 --> 01:06:28,470
Jadi saya akan memberikan password merah. Daftar.

1117
01:06:28,470 --> 01:06:32,300
"Kata sandi tidak cocok." Saya harus sekarang ketik di sini merah.

1118
01:06:32,300 --> 01:06:35,710
Saya sengaja diperiksa itu. Daftar.

1119
01:06:35,710 --> 01:06:39,860
"Anda harus menyetujui syarat dan kondisi." Baiklah. Setuju ada. Daftar.

1120
01:06:39,860 --> 01:06:43,700
Dan sekarang itu menunjukkan saya output diagnostik di sana.

1121
01:06:43,700 --> 01:06:45,630
>> Jadi apa yang baru saja terjadi?

1122
01:06:45,630 --> 01:06:48,330
Kami punya kemampuan untuk memvalidasi pengiriman form.

1123
01:06:48,330 --> 01:06:51,420
Bahkan, jika Anda melakukan menyelam ke pset 7, ada fungsi minta maaf

1124
01:06:51,420 --> 01:06:54,620
yang membuatnya cukup mudah untuk berteriak pada pengguna dengan pesan di layar.

1125
01:06:54,620 --> 01:06:57,580
Saya menggunakan mekanisme yang sedikit berbeda, fungsi waspada,

1126
01:06:57,580 --> 01:07:03,690
yang bukan merupakan fungsi yang tersenyum pada karena membuat pesan pengguna sangat jelek.

1127
01:07:03,690 --> 01:07:05,710
Tapi mari kita lihat apa yang saya lakukan di sini.

1128
01:07:05,710 --> 01:07:09,620
Ini form1.html, dan melihat bahwa saya memiliki beberapa sintaks yang cukup familiar:

1129
01:07:09,620 --> 01:07:12,920
body tag, tag form, atribut aksi, atribut metode.

1130
01:07:12,920 --> 01:07:17,050
Tapi perhatikan saya berikan formulir saya ID unik untuk kenyamanan.

1131
01:07:17,050 --> 01:07:19,190
Lalu aku punya medan email yang jenis teks,

1132
01:07:19,190 --> 01:07:23,780
field kata sandi yang jenis password, konfirmasi lapangan yang jenis password,

1133
01:07:23,780 --> 01:07:28,070
dan kemudian kotak centang yang namanya kesepakatan di sini, tipe kotak centang.

1134
01:07:28,070 --> 01:07:30,380
Dan kemudian aku punya tombol kirim.

1135
01:07:30,380 --> 01:07:33,050
Tapi perhatikan di atas apa lagi saya miliki.

1136
01:07:33,050 --> 01:07:35,810
Pertama-tama, ada lagi penggunaan tag script.

1137
01:07:35,810 --> 01:07:40,520
Jika Anda memiliki beberapa kode JavaScript di file lain, seperti dengan CSS Anda dapat memasukkannya.

1138
01:07:40,520 --> 01:07:44,530
Dan Anda melakukannya dengan sumber naskah, dan kemudian melihat aku menghubungkan rupanya

1139
01:07:44,530 --> 01:07:50,349
untuk googleapis.com ke jalur yang sangat panjang tapi nama file yang berakhir di jquery.min

1140
01:07:50,349 --> 01:07:52,420
minimal js..

1141
01:07:52,420 --> 01:07:55,969
jQuery adalah library super populer untuk JavaScript yang hanya membuat JavaScript

1142
01:07:55,969 --> 01:07:58,230
semua lebih user-friendly untuk digunakan.

1143
01:07:58,230 --> 01:08:00,610
Ini secara efektif menjadi standar de facto.

1144
01:08:00,610 --> 01:08:04,090
Jadi meskipun apa yang akan Anda lihat adalah tidak murni JavaScript per se,

1145
01:08:04,090 --> 01:08:09,340
itu adalah sebuah perpustakaan di atas JavaScript seperti perpustakaan CS50 adalah lapisan

1146
01:08:09,340 --> 01:08:13,670
di atas tingkat rendah kode C, kenyataannya adalah hampir semua orang di Internet menggunakannya.

1147
01:08:13,670 --> 01:08:18,030
Jadi ini bukan roda pelatihan. Ini adalah hanya terbaik berlatih hari ini.

1148
01:08:18,030 --> 01:08:22,830
Sekarang perhatikan di bawah ini yang merupakan tag script saya sendiri, dan perhatikan apa yang saya lakukan di sini.

1149
01:08:22,830 --> 01:08:27,450
Ternyata bahwa jQuery melakukan sesuatu sedikit mewah.

1150
01:08:27,450 --> 01:08:29,660
JavaScript memiliki tanda-tanda dolar, tapi mereka tidak ada artinya.

1151
01:08:29,660 --> 01:08:32,870
>> Mereka seperti huruf A atau B atau C.

1152
01:08:32,870 --> 01:08:36,670
jQuery telah cukup mengadopsi konvensi atau semacam klaim meletakkan fakta

1153
01:08:36,670 --> 01:08:40,280
bahwa $ akan menjadi simbol khusus mereka.

1154
01:08:40,280 --> 01:08:44,950
Jadi segera setelah Anda memuat file ini JavaScript global sampai di sini dengan tag script,

1155
01:08:44,950 --> 01:08:49,080
Anda memiliki akses ke variabel global khusus yang disebut $.

1156
01:08:49,080 --> 01:08:53,009
Ini lebih tepat disebut jQuery, tapi itu tidak terlihat hampir seseksi $.

1157
01:08:53,009 --> 01:08:56,250
Tapi $ tidak memiliki arti khusus. Di PHP itu memiliki arti khusus.

1158
01:08:56,250 --> 01:08:58,440
Anda harus memiliki itu di depan variabel.

1159
01:08:58,440 --> 01:09:01,670
Ini hanyalah sebuah hal seksi yang mereka mengambil.

1160
01:09:01,670 --> 01:09:03,389
Apa yang terjadi di sini?

1161
01:09:03,389 --> 01:09:08,830
Perhatikan aku lewat dengan fungsi jQuery dokumen global variabel saya

1162
01:09:08,830 --> 01:09:10,860
dan kemudian aku menelepon. siap.

1163
01:09:10,860 --> 01:09:15,480
Apa jQuery dasarnya tidak itu memungkinkan Anda untuk mengambil beberapa hal JavaScript vanili

1164
01:09:15,480 --> 01:09:17,889
seperti objek dokumen, objek window,

1165
01:09:17,889 --> 01:09:20,790
dan jika Anda lulus ke fungsi jQuery -

1166
01:09:20,790 --> 01:09:24,429
dan sekali lagi, harus jelas, ini adalah fungsi yang disebut jQuery -

1167
01:09:24,429 --> 01:09:28,240
apa yang dilakukannya itu kembali kepada Anda sebuah versi khusus dari dokumen

1168
01:09:28,240 --> 01:09:30,700
yang memiliki fungsi lebih terkait dengan itu.

1169
01:09:30,700 --> 01:09:34,760
Jadi dalam JavaScript baku tidak ada fungsi siap,

1170
01:09:34,760 --> 01:09:37,810
tetapi jika Anda melewatkan dokumen ke fungsi jQuery pertama,

1171
01:09:37,810 --> 01:09:40,960
itu kembali kepada Anda sebuah versi khusus dari objek dokumen

1172
01:09:40,960 --> 01:09:43,030
yang memiliki fitur mewah lagi.

1173
01:09:43,030 --> 01:09:48,230
Dan itulah mengapa orang-orang seperti itu. Itu hanya membuat hal-hal yang mudah untuk dilakukan, karena kita akan melihat.

1174
01:09:48,230 --> 01:09:49,820
Jadi, apa ini berarti baris kode?

1175
01:09:49,820 --> 01:09:52,690
Baris kode ini di sini berarti ketika dokumen siap -

1176
01:09:52,690 --> 01:09:56,830
dengan kata lain, sekali browser dilakukan membaca ini atas file ke bawah -

1177
01:09:56,830 --> 01:09:59,200
pergi ke depan dan menjalankan fungsi berikut.

1178
01:09:59,200 --> 01:10:03,540
Apa benar-benar menarik dalam JavaScript - dan PHP memiliki ini juga -

1179
01:10:03,540 --> 01:10:05,450
adalah fungsi anonim.

1180
01:10:05,450 --> 01:10:10,560
Dalam JavaScript Anda dapat mendeklarasikan fungsi yang memiliki nama tidak ada tetapi mereka memiliki tubuh.

1181
01:10:10,560 --> 01:10:12,570
Perhatikan apa yang terjadi di sini.

1182
01:10:12,570 --> 01:10:16,220
>> Ini adalah fungsi yang disebut siap, dan itu hanya berarti melakukan hal berikut

1183
01:10:16,220 --> 01:10:20,220
ketika halaman web secara keseluruhan sudah siap, ketika itu semua telah dibaca dari server.

1184
01:10:20,220 --> 01:10:23,090
Apa yang Anda ingin lakukan? Saya ingin menjalankan serangkaian kode.

1185
01:10:23,090 --> 01:10:27,120
Perhatikan bahwa kita tidak ingin mengeksekusi kode ini segera.

1186
01:10:27,120 --> 01:10:34,350
Jika saya dihilangkan ini, ini berarti segera mulai melaksanakan baris-baris kode.

1187
01:10:34,350 --> 01:10:39,040
Tapi fakta bahwa saya mengatakan tidak, tidak, tidak, membungkus ini dalam fungsi anonim seperti ini

1188
01:10:39,040 --> 01:10:43,000
berarti tidak melaksanakannya belum, menyebutnya akhirnya.

1189
01:10:43,000 --> 01:10:45,430
Kami melihat ini beberapa saat yang lalu dalam contoh bentuk sebelumnya kami.

1190
01:10:45,430 --> 01:10:49,990
Apa fungsi yang kita sebut akhirnya, 500 milidetik kemudian? Blink.

1191
01:10:49,990 --> 01:10:51,480
Jadi ide yang sama.

1192
01:10:51,480 --> 01:10:53,950
Sekali lagi, bahkan jika ini tampak sedikit aneh, hanya mengambil untuk saat ini pada iman

1193
01:10:53,950 --> 01:10:57,060
bahwa untuk menyatakan fungsi anonim yang disebut pada akhirnya,

1194
01:10:57,060 --> 01:11:01,720
Anda hanya menulis function () {

1195
01:11:01,720 --> 01:11:05,380
Jadi apa kode yang akan kita mengeksekusi pada akhirnya? Berikut ini.

1196
01:11:05,380 --> 01:11:10,460
Hal ini juga terlihat agak baru, tetapi ini berarti inilah fungsi jQuery,

1197
01:11:10,460 --> 01:11:13,430
dan sekarang ini adalah jalan pintas.

1198
01:11:13,430 --> 01:11:18,830
Ini potongan HTML di bagian bawah layar tentu memiliki beberapa representasi pohon.

1199
01:11:18,830 --> 01:11:21,730
Ini bukan ini. Halaman ini lebih menarik daripada contoh ini, dunia halo.

1200
01:11:21,730 --> 01:11:25,210
Tapi ada beberapa pohon yang sesuai dengan HTML ini.

1201
01:11:25,210 --> 01:11:28,910
Ini akan menjadi sakit di leher harus mengimplementasikan beberapa jenis fungsi rekursif

1202
01:11:28,910 --> 01:11:34,380
untuk memulai pada simpul akar dan kemudian menemukan node yang ID adalah registrasi.

1203
01:11:34,380 --> 01:11:38,340
Jadi apa yang membuat jQuery super mudah bagi kita secara harfiah ini.

1204
01:11:38,340 --> 01:11:43,000
Pergi ke depan dan mendapatkan saya apapun div atau bentuk apapun, apapun HTML elemen

1205
01:11:43,000 --> 01:11:45,820
memiliki ID pendaftaran.

1206
01:11:45,820 --> 01:11:52,440
Ini sama dengan document.getElementById ('pendaftaran').

1207
01:11:52,440 --> 01:11:54,170
>> Mengapa orang-orang seperti jQuery?

1208
01:11:54,170 --> 01:12:00,110
Karena itu lebih pendek untuk mengetik. Tapi itu semua itu. Ini ide yang sama.

1209
01:12:00,110 --> 01:12:02,630
Dapatkan saya tag mana ID adalah pendaftaran.

1210
01:12:02,630 --> 01:12:06,300
Dan ketika itu tag, yang kebetulan formulir, dikirimkan,

1211
01:12:06,300 --> 01:12:08,300
pergi ke depan dan menjalankan kode ini.

1212
01:12:08,300 --> 01:12:11,320
Jadi mari kita mengambil satu melihat sekarang bagaimana kita melakukan validasi form.

1213
01:12:11,320 --> 01:12:15,950
Sintaks ini diakui samar pada awalnya, tapi apa yang terjadi?

1214
01:12:15,950 --> 01:12:21,050
Jika baris kode ini benar, aku akan berteriak pada pengguna untuk memberikan alamat email-nya.

1215
01:12:21,050 --> 01:12:22,970
Jadi apa ini baris kode?

1216
01:12:22,970 --> 01:12:25,560
$ Berarti jQuery. Sekarang perhatikan ini.

1217
01:12:25,560 --> 01:12:27,920
Ini adalah jenis seperti CSS.

1218
01:12:27,920 --> 01:12:33,370
Jika Anda telah menyelam ke dalam CSS belum, Anda akan tahu bahwa ini berarti elemen mana ID adalah pendaftaran.

1219
01:12:33,370 --> 01:12:39,840
Ruang berarti menemukan anak atau keturunan pendaftaran yang namanya masukan.

1220
01:12:39,840 --> 01:12:42,970
Dan kemudian hal ini di alun-alun kurung adalah filter kecil.

1221
01:12:42,970 --> 01:12:47,010
Dan bahkan jika ini terlihat samar, ini hanya berarti pergi ke bentuk yang ID adalah registrasi,

1222
01:12:47,010 --> 01:12:51,230
masuk ke bagian dalam elemen input itu yang namanya email,

1223
01:12:51,230 --> 01:12:55,440
dan kemudian mendapatkan nilai, nilai apa pun yang akan terjadi -

1224
01:12:55,440 --> 01:12:59,670
asdf kalau itu semua saya diketik atau malan@harvard.edu kalau itu yang saya mengetik.

1225
01:12:59,670 --> 01:13:05,250
Jadi jika nilai bidang email form == apa-apa, berteriak pada pengguna.

1226
01:13:05,250 --> 01:13:09,700
Lain jika nilai kolom password == apa-apa, berteriak pada pengguna.

1227
01:13:09,700 --> 01:13:19,520
>> Lain jika nilai dari bidang sandi tidak sama dengan nilai bidang konfirmasi,

1228
01:13:19,520 --> 01:13:22,850
yang merupakan elemen bentuk lain, berteriak pada pengguna.

1229
01:13:22,850 --> 01:13:25,680
Dan kemudian yang terakhir - dan satu ini juga memiliki beberapa sintaks baru sendiri,

1230
01:13:25,680 --> 01:13:29,270
tetapi sekali Anda sudah melihatnya, itu setidaknya sedikit lebih masuk akal -

1231
01:13:29,270 --> 01:13:34,060
lain jika bentuk yang ID adalah registrasi memiliki elemen input yang namanya kesepakatan

1232
01:13:34,060 --> 01:13:39,720
dan diperiksa, pergi ke depan dan berteriak pada pengguna.

1233
01:13:39,720 --> 01:13:42,520
Jadi saya benar-benar mengakui ini benar-benar luar biasa pada pandangan pertama.

1234
01:13:42,520 --> 01:13:46,530
Ini banyak sintaks baru. Tapi semua jQuery berikut jenis-jenis pola.

1235
01:13:46,530 --> 01:13:49,880
Dan jujur, aku bahkan tidak tahu ini ada sampai beberapa menit yang lalu.

1236
01:13:49,880 --> 01:13:53,640
Aku Googled, "Bagaimana Anda memeriksa apakah kotak centang diperiksa dalam jQuery?"

1237
01:13:53,640 --> 01:13:55,680
dan ini adalah sintaks, karena ada cara yang berbeda untuk melakukannya

1238
01:13:55,680 --> 01:13:58,010
dengan kode JavaScript aktual baku.

1239
01:13:58,010 --> 01:14:01,030
Sehingga halaman pertama dari Set Soal 7 menekankan,

1240
01:14:01,030 --> 01:14:04,500
pset 7 sangat banyak latihan dalam bootstrap diri

1241
01:14:04,500 --> 01:14:08,650
di mana kita berikan, mudah-mudahan, suatu kerangka kerja konseptual yang dapat digunakan untuk mengatasi pset tersebut.

1242
01:14:08,650 --> 01:14:12,280
>> Tapi seperti yang sering terjadi dengan desain web, itu terserah Anda benar-benar melihat-lihat,

1243
01:14:12,280 --> 01:14:16,680
menggabungkan potongan kode dan contoh dari Web asalkan Anda mengutipnya

1244
01:14:16,680 --> 01:14:17,960
per istilah pada lembar pertama itu,

1245
01:14:17,960 --> 01:14:21,460
dan menyadari bahwa belajar HTML, CSS, JavaScript dan bahkan SQL

1246
01:14:21,460 --> 01:14:26,020
benar-benar dimaksudkan untuk menjadi latihan ini di rumah seperti yang kita mulai untuk mengambil roda off pelatihan.

1247
01:14:26,020 --> 01:14:29,150
Dan menyadari juga ada begitu banyak hal lagi yang dapat Anda lakukan dengan browser.

1248
01:14:29,150 --> 01:14:33,790
Dalam sebagian besar elemen ada hal-hal lain yang disebut event handler.

1249
01:14:33,790 --> 01:14:37,140
Dan meskipun kita hanya melihat orang-orang yang disebut onsubmit dan onready,

1250
01:14:37,140 --> 01:14:40,310
Anda dapat melakukan hal-hal seperti OnKeyDown, onkeyup,

1251
01:14:40,310 --> 01:14:43,410
seperti ketika pengguna menyentuh tombol, Anda dapat mendengarkan untuk itu dan sampai kunci.

1252
01:14:43,410 --> 01:14:45,940
Gmail memiliki shortcut keyboard.

1253
01:14:45,940 --> 01:14:49,490
Bagaimana Google menerapkan cara pintas keyboard seperti C untuk menulis?

1254
01:14:49,490 --> 01:14:54,120
Mereka mendengarkan untuk acara, sebagaimana mereka disebut, seperti onkeypress atau onkeyup dan OnKeyDown.

1255
01:14:54,120 --> 01:14:56,360
Jika Anda pernah melayang mouse anda ke atas beberapa pilihan menu

1256
01:14:56,360 --> 01:15:00,180
dan semua yang, tiba-tiba voila, muncul menu atau perubahan warna grafis,

1257
01:15:00,180 --> 01:15:01,920
bagaimana mereka melakukan itu?

1258
01:15:01,920 --> 01:15:06,940
Daripada mendengarkan onready atau onsubmit, Anda mendengarkan onmouseover atau onmouseout.

1259
01:15:06,940 --> 01:15:10,920
>> Jadi singkatnya, dengan dasar-dasar yang sangat sederhana bahwa kita sudah mulai menggores permukaan saat ini

1260
01:15:10,920 --> 01:15:13,940
dan kami akan menyelam lebih lanjut untuk Rabu, Anda miliki, semakin,

1261
01:15:13,940 --> 01:15:17,530
kekuatan untuk melaksanakan hal-hal yang Anda sudah akrab dengan.

1262
01:15:17,530 --> 01:15:21,620
Jadi mari kita berakhir di sana, dan kami akan terus ini pada hari Rabu.

1263
01:15:22,690 --> 01:15:24,320
>> [CS50.TV]