1
00:00:00,000 --> 00:00:02,570
[Powered by Google Translate] [Settimana 9]

2
00:00:02,570 --> 00:00:04,740
[David J. Malan - Harvard University]

3
00:00:04,740 --> 00:00:07,170
[Questo è CS50. - CS50.TV]

4
00:00:07,170 --> 00:00:12,350
Bene. Bentornato. Questo è CS50, e questo è l'inizio della settimana 9.

5
00:00:12,350 --> 00:00:16,600
Oggi ci concentriamo in particolare sul design, non più nel contesto di C

6
00:00:16,600 --> 00:00:20,010
ma nel contesto di PHP e un po 'di SQL e un po' di JavaScript,

7
00:00:20,010 --> 00:00:23,730
in particolare verso la fine di entrambi pset 7 e anche il progetto finale.

8
00:00:23,730 --> 00:00:26,310
In realtà, se si è a quel punto nel progetto finale

9
00:00:26,310 --> 00:00:30,100
dove presumibilmente di circa un'ora fa, almeno, ha iniziato a dare qualche pensiero

10
00:00:30,100 --> 00:00:33,730
per il progetto finale e stai pensando che ci piacerebbe collaborare con 1 o 2 compagni di classe,

11
00:00:33,730 --> 00:00:36,150
se hai problemi di connessione con detti compagni di classe,

12
00:00:36,150 --> 00:00:40,570
non esitate a compilare il modulo di cs50.net/partners/form.

13
00:00:40,570 --> 00:00:42,880
Chiede te chi sei, che tipo di progetto su cui state pensando,

14
00:00:42,880 --> 00:00:44,870
in cui si vive solo per motivi logistici.

15
00:00:44,870 --> 00:00:49,510
E poi se si vuole tenere d'occhio la prossima settimana o giù di lì l'URL foglio di là,

16
00:00:49,510 --> 00:00:53,520
è possibile vedere una versione di sola lettura del documento Google

17
00:00:53,520 --> 00:00:56,010
in cui stiamo raccolta di tali informazioni.

18
00:00:56,010 --> 00:00:58,930
Quindi, se si desidera lavorare con qualcuno, con tutti i mezzi sentitevi liberi di raggiungere le persone

19
00:00:58,930 --> 00:01:00,480
attraverso tale meccanismo.

20
00:01:00,480 --> 00:01:02,690
Ma la maggior parte delle persone fanno il lavoro da solo. E 'tutto bene.

21
00:01:02,690 --> 00:01:06,120
Quindi non credo che questo sia in qualche modo obbligatorio.

22
00:01:06,120 --> 00:01:09,680
Venerdì scorso è stato solo io e alcuni del team qui,

23
00:01:09,680 --> 00:01:11,100
teatro vuoto per la maggior parte.

24
00:01:11,100 --> 00:01:14,600
Ci sono stati 3 turisti seduti lassù, così che era un po 'imbarazzante.

25
00:01:14,600 --> 00:01:18,970
Quello che abbiamo parlato era database e abbiamo parlato di pset 7 un po '.

26
00:01:18,970 --> 00:01:22,200
E se non è successo per la cattura che in video appena ancora, va bene.

27
00:01:22,200 --> 00:01:26,770
Cercherò di definire tutti i termini che altrimenti diamo per scontato

28
00:01:26,770 --> 00:01:28,840
sulla base di lezione Venerdì.

29
00:01:28,840 --> 00:01:32,550
>> Ma oggi stiamo andando a cercare di ottenere il punto

30
00:01:32,550 --> 00:01:34,990
non solo di essere in grado di fare qualcosa di simile pset 7

31
00:01:34,990 --> 00:01:37,360
ma in realtà capire che cosa sta succedendo sotto il cofano,

32
00:01:37,360 --> 00:01:41,910
in particolare alcune delle astrazioni che abbiamo messo in atto nel file functions.php

33
00:01:41,910 --> 00:01:45,780
per rendere la vostra vita un po 'più facile, ma in ultima analisi, in modo da capire

34
00:01:45,780 --> 00:01:48,760
in modo che quando le ruote di formazione venire fuori in poche settimane si può ancora sopravvivere

35
00:01:48,760 --> 00:01:53,750
nel mondo reale e fare queste cose senza un quadro CS50 sotto di voi.

36
00:01:53,750 --> 00:01:57,500
Questo $ _SESSION, per quelli di voi che hanno familiarità

37
00:01:57,500 --> 00:02:01,960
o che già catturato il video il Venerdì, cosa SESSIONE facciamolo

38
00:02:01,960 --> 00:02:04,330
in un PHP-based web?

39
00:02:04,330 --> 00:02:09,650
Questa è una variabile superglobale, che significa che è simile nello spirito alla GET e POST

40
00:02:09,650 --> 00:02:13,970
e pochi altri, ma che cosa è questa cosa serve?

41
00:02:13,970 --> 00:02:18,320
>> Che cosa è SESSIONE usa? Gia '. [Studente] Logging in

42
00:02:18,320 --> 00:02:21,040
Scusa? [Studente] Logging in Logging in effetti.

43
00:02:21,040 --> 00:02:25,100
In pset 7 si sta utilizzando questo superglobale SESSIONE per facilitare Logging in

44
00:02:25,100 --> 00:02:28,600
E che cosa è bella di questo superglobale è che è un array associativo.

45
00:02:28,600 --> 00:02:33,190
Un array associativo, ricordo, è solo un array, ma i cui indici non devono più essere numeri

46
00:02:33,190 --> 00:02:37,670
come 012. Essi possono essere numeri oppure possono essere anche stringhe.

47
00:02:37,670 --> 00:02:44,890
E quindi se hai tuffò pset 7 ancora, si può ricordare che abbiamo memorizzato un ID chiave denominata

48
00:02:44,890 --> 00:02:50,330
all'interno di questo array associativo il cui valore è qualcosa come 123 -

49
00:02:50,330 --> 00:02:53,780
qualunque sia attualmente connesso ID dell'utente è.

50
00:02:53,780 --> 00:02:59,470
La ragione per questo è che, anche dopo che l'utente ha visitato localhost

51
00:02:59,470 --> 00:03:02,720
o più in generale il mio sito web e poi hanno effettuato l'accesso,

52
00:03:02,720 --> 00:03:07,320
anche se non si fa clic su un collegamento o tornare al mio sito web per 5 minuti

53
00:03:07,320 --> 00:03:10,730
o anche un'ora o anche un giorno, ma lasciano la loro finestra del browser aperta,

54
00:03:10,730 --> 00:03:14,370
attraverso questo superglobale posso ricordare che sono loggato

55
00:03:14,370 --> 00:03:21,140
>> In altre parole, mi permette di memorizzare un po 'a lungo termine, qualcosa che voglio su un utente.

56
00:03:21,140 --> 00:03:24,390
E si può pensare davvero come l'incarnazione di un carrello della spesa.

57
00:03:24,390 --> 00:03:27,740
Luoghi come Amazon, ovviamente, puoi mettere le cose in un carrello della spesa,

58
00:03:27,740 --> 00:03:32,230
ma HTTP, il protocollo che alimenta il Web, è stateless

59
00:03:32,230 --> 00:03:34,230
nel senso che quando si visita un sito web,

60
00:03:34,230 --> 00:03:37,290
per la maggior parte non si dispone di un po 'di connessione di rete costante

61
00:03:37,290 --> 00:03:39,270
tra il browser e il server.

62
00:03:39,270 --> 00:03:42,190
Non appena hai scaricato il codice HTML e le immagini JPEG e le GIF e tutto il resto,

63
00:03:42,190 --> 00:03:48,200
la connessione va via e non resta che una copia del codice HTML e quant'altro dal server.

64
00:03:48,200 --> 00:03:53,000
Ma se il server vuole ricordare qualcosa su di te,

65
00:03:53,000 --> 00:03:57,580
il peso è sul server di registrare effettivamente tali informazioni.

66
00:03:57,580 --> 00:04:00,130
E così il programmatore che ha il controllo del server

67
00:04:00,130 --> 00:04:04,400
può mettere qualsiasi cosa che si desidera all'interno di questo array associativo superglobale

68
00:04:04,400 --> 00:04:06,850
e sarà la prossima volta che l'utente ritorna,

69
00:04:06,850 --> 00:04:12,070
che si tratti di minuti o addirittura giorni dopo, a meno che chiudere il proprio finestra del browser,

70
00:04:12,070 --> 00:04:14,360
in cui SESSIONE punto scompare.

71
00:04:14,360 --> 00:04:17,779
Quindi è di archiviazione effimera, è non-persistente, e ha lo scopo di andare via

72
00:04:17,779 --> 00:04:22,360
appena l'utente chiude il browser - non solo quella scheda, spesso l'intero browser,

73
00:04:22,360 --> 00:04:24,930
così efficacemente la registrazione l'utente.

74
00:04:24,930 --> 00:04:28,000
Così come è questa cosa effettivamente attuato?

75
00:04:28,000 --> 00:04:31,360
Diamo un rapido sguardo a un semplice esempio abbiamo guardato il Venerdì.

76
00:04:31,360 --> 00:04:33,340
Per chi non conosce, è stato semplice come questo.

77
00:04:33,340 --> 00:04:35,910
Questa è una pagina web il cui unico scopo nella vita è quello di dirmi

78
00:04:35,910 --> 00:04:38,000
quante volte ho visitato questa pagina.

79
00:04:38,000 --> 00:04:41,670
Questa è la prima volta qui il Lunedi che l'ho visitato, così si dice 0 volte.

80
00:04:41,670 --> 00:04:46,940
>> Ma se mi metto a ricaricare la pagina, si dice 1 volta, 2, 3, 4, 5,

81
00:04:46,940 --> 00:04:49,800
e questo puo 'solo continuare a contare su, su, su, su, su

82
00:04:49,800 --> 00:04:53,130
per ogni volta che ho effettivamente fare clic su Ricarica su di esso.

83
00:04:53,130 --> 00:04:58,830
Così come è questo lavoro? Lasciami andare all'interno di questo file chiamato counter.php.

84
00:04:58,830 --> 00:05:02,490
La parte superiore di esso è tutti i commenti blu, ma la parte interessante è qui.

85
00:05:02,490 --> 00:05:06,670
Alla riga 13 si chiama questa funzione session_start,

86
00:05:06,670 --> 00:05:09,600
e che è letteralmente tutto quello che devi fare se vuoi avere accesso

87
00:05:09,600 --> 00:05:13,610
a questo superglobale speciale chiamata $ _SESSION.

88
00:05:13,610 --> 00:05:17,430
Questo rende possibile, e vedremo in un momento come questo è tutto possibile.

89
00:05:17,430 --> 00:05:20,350
In linea 16 avviso quello che sto facendo.

90
00:05:20,350 --> 00:05:25,960
Se la chiave, chiamato contatore - in altre parole, il valore di indice - "contatore"

91
00:05:25,960 --> 00:05:32,310
esiste all'interno di questo array chiamato SESSIONE, allora che cosa sto facendo con esso nella riga sottostante?

92
00:05:32,310 --> 00:05:36,650
Qual è la linea 18 facendo?

93
00:05:36,650 --> 00:05:40,360
>> [Risposta degli studenti incomprensibile] Che cos'è? [Studente] Conservazione del valore. Bene.

94
00:05:40,360 --> 00:05:45,800
E 'la memorizzazione del valore che è in sessione al momento in una nuova variabile locale temporanea,

95
00:05:45,800 --> 00:05:48,250
$ Contatore in tutte minuscole.

96
00:05:48,250 --> 00:05:50,770
Si noti che PHP è già in corso un po 'pigro qui.

97
00:05:50,770 --> 00:05:55,550
Si noti che non abbiamo alcuna menzione di int o float o stringa o qualcosa di simile

98
00:05:55,550 --> 00:06:00,480
perché PHP è debolmente tipizzato, per cui non è necessario specificare il tipo di una variabile,

99
00:06:00,480 --> 00:06:03,310
e in questo caso qui non ho nemmeno ancora dichiarato.

100
00:06:03,310 --> 00:06:08,980
Lo sto dichiarando all'interno di queste parentesi graffe e, diversamente da C, questo è in realtà va bene.

101
00:06:08,980 --> 00:06:13,800
Non importa quanto profondamente annidato la dichiarazione di una variabile è in PHP -

102
00:06:13,800 --> 00:06:16,650
all'interno di parentesi graffe, all'interno della parentesi graffa e simili -

103
00:06:16,650 --> 00:06:21,230
sarà in quel momento nel tempo esistono per il resto del programma,

104
00:06:21,230 --> 00:06:22,680
nel bene e nel male.

105
00:06:22,680 --> 00:06:26,930
Così diventa immediatamente globale, non appena lo si definisce come stiamo facendo qui.

106
00:06:26,930 --> 00:06:31,620
>> In caso contrario, se non trovo che ci sia qualcosa nel superglobale SESSION,

107
00:06:31,620 --> 00:06:34,680
Mi pare di inizializzazione questo contatore variabile a 0,

108
00:06:34,680 --> 00:06:37,580
in tal modo solo supponendo che l'utente non è mai stato qui prima.

109
00:06:37,580 --> 00:06:40,030
E allora questo corso è di incrementare il contatore come?

110
00:06:40,030 --> 00:06:44,480
Sto aggiornando il valore che c'è dentro di questo array associativo

111
00:06:44,480 --> 00:06:49,530
impostandolo uguale a tutto ciò che è attualmente contatore + 1.

112
00:06:49,530 --> 00:06:53,520
Se scorrere verso il basso qui per il codice HTML della pagina, in realtà è abbastanza semplice.

113
00:06:53,520 --> 00:06:58,920
Tutto quello che ho nel corpo di questa pagina è: "Hai visitato questo sito volte così e così."

114
00:06:58,920 --> 00:07:00,350
E questo è un costrutto PHP.

115
00:07:00,350 --> 00:07:06,080
Se lo fai <? =, Questo equivale effettivamente a quale funzione?

116
00:07:07,920 --> 00:07:12,600
E 'davvero una cosa del genere equivale a printf, che abbiamo visto molte volte in C,

117
00:07:12,600 --> 00:07:15,940
anche se, come forse sapete già dalla spec in pset 7,

118
00:07:15,940 --> 00:07:20,160
stampa è anche una funzione che si limita a stampare qualcosa, in realtà non utilizzare i codici di formato,

119
00:07:20,160 --> 00:07:23,270
e si può effettivamente dire eco pure.

120
00:07:23,270 --> 00:07:27,460
Sono tutti sempre in modo leggermente diverso, anche se l'effetto netto è in definitiva la stessa.

121
00:07:27,460 --> 00:07:31,270
Quindi, questo uso del segno di uguale è solo una sorta di un modo elegante per farlo

122
00:07:31,270 --> 00:07:34,910
più brevemente di quanto si possa altrimenti essere in grado di.

123
00:07:34,910 --> 00:07:38,370
Ecco, questo è tutto il sito fa. Si stampa il valore del contatore.

124
00:07:38,370 --> 00:07:40,550
Come tutto questo realmente accadendo?

125
00:07:40,550 --> 00:07:43,250
Si può richiamare una settimana fa abbiamo iniziato a cercare sotto la cappa

126
00:07:43,250 --> 00:07:47,910
il modo in cui una pagina Web funziona utilizzando questa scheda Impostazioni.

127
00:07:47,910 --> 00:07:51,900
>> Chrome ha questo sia nella versione per Mac, la versione per Windows, e anche la versione per Linux,

128
00:07:51,900 --> 00:07:59,510
e Firefox e IE hanno meccanismi simili per cui si dispone di questo debugger incorporato

129
00:07:59,510 --> 00:08:01,400
all'interno del browser.

130
00:08:01,400 --> 00:08:03,040
Diamo uno sguardo al seguente.

131
00:08:03,040 --> 00:08:06,960
Abbiamo un sacco di schede qui, e ricordare che quello più a sinistra è Elements,

132
00:08:06,960 --> 00:08:10,700
e non importa quanto godawful il codice HTML e JavaScript in una pagina,

133
00:08:10,700 --> 00:08:15,710
Ricordiamo che con la scheda elementi si può effettivamente navigare il codice HTML gerarchicamente

134
00:08:15,710 --> 00:08:17,050
e bello e pulito.

135
00:08:17,050 --> 00:08:19,370
Quindi, se si sta cercando di imparare da un sito web come Google o Facebook

136
00:08:19,370 --> 00:08:22,370
o davvero qualsiasi sito web, si rendono conto che probabilmente stai meglio

137
00:08:22,370 --> 00:08:26,360
guardando il codice sorgente in questo modo invece di visualizzare la fonte prima,

138
00:08:26,360 --> 00:08:29,580
che può essere un disastro, come abbiamo visto in particolare sul sito di Google.

139
00:08:29,580 --> 00:08:32,220
Quindi, se io invece fare clic sulla scheda di rete qui,

140
00:08:32,220 --> 00:08:34,830
vediamo cosa succede durante la mia visita questa pagina.

141
00:08:34,830 --> 00:08:38,669
In primo luogo vorrei cancellare la cache.

142
00:08:38,669 --> 00:08:43,570
Ho intenzione di andare in Impostazioni in Chrome e poi andare alla Storia

143
00:08:43,570 --> 00:08:46,420
e quindi cancellare tutti i dati di navigazione.

144
00:08:46,420 --> 00:08:48,170
Potrebbe essere usato per fare questo per altri scopi, [risate]

145
00:08:48,170 --> 00:08:51,990
ma quando si tratta di siti web in via di sviluppo, in realtà è utile -

146
00:08:51,990 --> 00:08:55,980
se stai ridendo sai. [Risate]

147
00:08:55,980 --> 00:08:59,310
In realtà è molto utile nello sviluppo di siti web, perché la realtà è

148
00:08:59,310 --> 00:09:04,100
cose come i biscotti e cose del genere memorizzati nella cache i file HTML, cache file JavaScript

149
00:09:04,100 --> 00:09:06,390
può effettivamente diventare un grande mal di testa, perché se per qualsiasi ragione

150
00:09:06,390 --> 00:09:11,500
il browser decide di memorizzare nella cache alcuni file e tu hai fatto cambiamenti a questo file sul server

151
00:09:11,500 --> 00:09:14,670
ma il browser non ha davvero capito che il file è stato modificato

152
00:09:14,670 --> 00:09:19,060
e quindi in realtà non ri-scaricare anche quando si fa clic sul pulsante Ricarica,

153
00:09:19,060 --> 00:09:23,210
uno dei modi più infallibili per fare solo che la colpa non è con il codice,

154
00:09:23,210 --> 00:09:26,480
è con il comportamento del browser, è quello di andare in qui nel tuo browser

155
00:09:26,480 --> 00:09:29,950
e solo cancellare tutta la storia in modo che non c'è confusione.

156
00:09:29,950 --> 00:09:33,210
>> E poi se si vuole veramente essere paranoici, chiudere il browser, riavviarlo,

157
00:09:33,210 --> 00:09:35,660
e quindi assicurarsi che tutto funzioni come previsto.

158
00:09:35,660 --> 00:09:38,820
Così, in breve, dalla cache è un bene quando si fa sviluppo.

159
00:09:38,820 --> 00:09:40,690
Ecco quindi la scheda di rete.

160
00:09:40,690 --> 00:09:46,020
Ho già aveva visitato il sito di 9 volte, ma lasciami andare avanti ora e fare clic su Ricarica.

161
00:09:46,020 --> 00:09:47,500
E sono tornato a 0.

162
00:09:47,500 --> 00:09:52,100
Facciamo vedere come in realtà è che questo superglobale sessione è in corso di attuazione.

163
00:09:52,100 --> 00:09:55,990
Io vado a cliccare sulla richiesta 1 HTTP che è stato fatto,

164
00:09:55,990 --> 00:09:58,810
e questa finestra di debug mi permette di guardare all'interno di questo.

165
00:09:58,810 --> 00:10:01,970
Qui vedo solo la risposta dal server, che non è interessante.

166
00:10:01,970 --> 00:10:04,030
Ho visto questo in molti modi.

167
00:10:04,030 --> 00:10:06,350
Ma ciò che è tecnicamente interessanti sono le intestazioni.

168
00:10:06,350 --> 00:10:11,770
Se scorrere verso il basso qui e concentrarsi sulle intestazioni di richiesta e fare clic su visualizza sorgente,

169
00:10:11,770 --> 00:10:14,400
quello che sto andando a vedere è letteralmente la richiesta HTTP

170
00:10:14,400 --> 00:10:17,250
che appena andato dal mio browser al server,

171
00:10:17,250 --> 00:10:21,400
GET è la parola chiave e poi / counter.php essere il nome del file,

172
00:10:21,400 --> 00:10:25,670
HTTP/1.1 solo di essere la versione di HTTP che il mio browser utilizza.

173
00:10:25,670 --> 00:10:31,070
Questa linea: ecco un piccolo promemoria dal browser al server quello che il nome del server è

174
00:10:31,070 --> 00:10:33,020
che vuole parlare.

175
00:10:33,020 --> 00:10:38,200
E poi il resto di questo a volte è interessante, ma non è rilevante in questo momento.

176
00:10:38,200 --> 00:10:40,090
>> Questo è solo una specie di curiosità.

177
00:10:40,090 --> 00:10:43,530
Cryptic se questa stringa è, ogni volta che il browser visita un sito web

178
00:10:43,530 --> 00:10:47,110
è informare il server browser che si sta utilizzando

179
00:10:47,110 --> 00:10:50,040
e il sistema operativo che si sta utilizzando e la versione della stessa.

180
00:10:50,040 --> 00:10:52,650
Quindi, se vi siete mai chiesti come siti come CNN e quant'altro

181
00:10:52,650 --> 00:10:56,860
sapere quali sono le percentuali sono di utenti Mac sugli utenti Web, PC,

182
00:10:56,860 --> 00:11:00,820
Utenti di Internet Explorer, gli utenti Chrome e simili, è perché tutti i browser

183
00:11:00,820 --> 00:11:04,300
stanno dicendo ogni singolo sito web là fuori ciò che siamo.

184
00:11:04,300 --> 00:11:07,410
Non necessariamente contengono informazioni personali,

185
00:11:07,410 --> 00:11:13,060
ma lo fa dire al server che cosa il vostro indirizzo IP e il browser e il sistema operativo in uso.

186
00:11:13,060 --> 00:11:14,720
Ecco dove queste informazioni sono.

187
00:11:14,720 --> 00:11:19,960
Ma ciò che è più interessante ora, quando si tratta di queste sessioni è l'intestazione della risposta.

188
00:11:19,960 --> 00:11:22,530
Permettetemi di fare clic su Visualizzazione accanto alla risposta.

189
00:11:22,530 --> 00:11:24,590
La cosa interessante qui è un paio di cose.

190
00:11:24,590 --> 00:11:27,580
1, siamo tornati un codice di stato 200.

191
00:11:27,580 --> 00:11:29,840
Non abbiamo mai vedere questo codice di stato, perché significa che tutto va bene.

192
00:11:29,840 --> 00:11:32,920
Letteralmente significa bene in contrasto con qualcos'altro.

193
00:11:32,920 --> 00:11:36,380
Che cosa è un numero che a volte vediamo che è male? [Studente] 404.

194
00:11:36,380 --> 00:11:39,860
404, file not found, 403 si potrebbe inciampare su di già,

195
00:11:39,860 --> 00:11:43,660
che è vietata, il che significa che si è dimenticato di qualcosa di chmod, molto probabilmente.

196
00:11:43,660 --> 00:11:45,190
E ci sono un mucchio di altri.

197
00:11:45,190 --> 00:11:47,760
>> Giù qui, questo è un po 'pazzo.

198
00:11:47,760 --> 00:11:52,340
Ho davvero appena scritto questo file pochi minuti fa da incollandolo in gedit.

199
00:11:52,340 --> 00:11:57,100
Perché questa pagina scadrà nel 1981, prima c'era davvero un Web?

200
00:11:58,010 --> 00:12:00,730
Che cosa sta succedendo lì?

201
00:12:00,730 --> 00:12:04,390
>> [Risposta incomprensibile studente] La data e ora. Ma perché?

202
00:12:06,110 --> 00:12:09,120
E 'un po' arbitraria, ma in realtà è utile.

203
00:12:09,120 --> 00:12:15,500
Che cosa questo sta dicendo al mio browser non è questo file PHP che hai appena chiesto è già scaduto.

204
00:12:15,500 --> 00:12:18,580
Infatti, è scaduto 30 anni fa.

205
00:12:18,580 --> 00:12:20,260
Ma che cosa significa in realtà?

206
00:12:20,260 --> 00:12:22,500
Significa solo che la prossima volta che l'utente visita la pagina,

207
00:12:22,500 --> 00:12:25,540
se per il ricarico o digitando l'URL nella barra degli indirizzi,

208
00:12:25,540 --> 00:12:28,010
assicuratevi di andare a prendere una nuova copia di esso.

209
00:12:28,010 --> 00:12:30,840
Questa è una specie di un esempio di busting della cache,

210
00:12:30,840 --> 00:12:33,790
una parola stupida che significa solo cercando di scoraggiare i browser

211
00:12:33,790 --> 00:12:37,260
da realtà caching HTML che è stato inviato da un server di

212
00:12:37,260 --> 00:12:41,490
in modo che non accidentalmente colpito ricarica e poi vedere la stessa versione del file.

213
00:12:41,490 --> 00:12:43,730
In realtà si desidera che il server di inviare una nuova copia.

214
00:12:43,730 --> 00:12:47,440
Quindi il fatto che il 1981 significa solo che questo è ciò che l'apparecchio è la scelta

215
00:12:47,440 --> 00:12:50,280
come una data arbitraria nel passato.

216
00:12:50,280 --> 00:12:53,380
Ma la linea vera succosa è questo.

217
00:12:53,380 --> 00:12:57,550
Anche prima del 50 probabilmente siete vagamente familiare con i biscotti.

218
00:12:57,550 --> 00:13:01,820
A partire da ora, soprattutto tra quelli meno confortevoli o in mezzo,

219
00:13:01,820 --> 00:13:04,120
che cosa è un cookie nella vostra comprensione in questo momento

220
00:13:04,120 --> 00:13:06,980
anche se stiamo per rendere la vostra comprensione più tecnico?

221
00:13:08,150 --> 00:13:10,070
Che cos'è un cookie? Gia '.

222
00:13:10,070 --> 00:13:13,890
[Studente] Informazioni sull'utente, come se hanno scritto il proprio nome utente o qualcosa del genere.

223
00:13:13,890 --> 00:13:17,370
>> Bene. Si tratta di informazioni sull'utente, se hanno digitato il nome utente già.

224
00:13:17,370 --> 00:13:21,190
I cookie sono un modo con cui i server di ricordare qualcosa su un utente.

225
00:13:21,190 --> 00:13:25,810
E che un cookie è in realtà è un file di testo o una sequenza di byte

226
00:13:25,810 --> 00:13:28,340
che è piantato dal server all'interno del browser,

227
00:13:28,340 --> 00:13:31,960
e all'interno di quel file o tra questi byte è una sorta di identificativo.

228
00:13:31,960 --> 00:13:35,640
Forse è letteralmente il nome utente, ma più spesso è qualcosa di più criptico di aspetto

229
00:13:35,640 --> 00:13:43,700
come questa cosa qui - bo8dal3ct e così via - questa stringa alfanumerica davvero grande

230
00:13:43,700 --> 00:13:47,050
che è in realtà solo vuole essere un identificatore univoco per voi.

231
00:13:47,050 --> 00:13:49,790
Oppure si può pensare ad esso come una sorta di timbro di mano virtuale.

232
00:13:49,790 --> 00:13:53,020
Se si va a qualche club o un parco di divertimenti, per ricordare che hai effettivamente pagato

233
00:13:53,020 --> 00:13:55,850
e andato in, hanno messo un piccolo adesivo rosso sulla mano di qualche tipo,

234
00:13:55,850 --> 00:13:59,270
e che ricorda le persone al banco che hai già pagato

235
00:13:59,270 --> 00:14:01,340
e si può andare e venire a piacimento.

236
00:14:01,340 --> 00:14:04,250
I cookie sono un po 'simile nello spirito a quella.

237
00:14:04,250 --> 00:14:08,070
La prima volta che ho visitato questo sito, come ho appena fatto dopo aver eliminato la cache,

238
00:14:08,070 --> 00:14:11,620
il server web, l'apparecchio in questo caso, mettere un timbro sulla mano

239
00:14:11,620 --> 00:14:15,030
il cui nome è PHPSESSID, ID di sessione,

240
00:14:15,030 --> 00:14:18,260
il cui valore è la stringa alfanumerica veramente lungo.

241
00:14:18,260 --> 00:14:22,470
>> Ecco, questo è ormai una sorta di blasonate sulla mia mano in modo che la prossima volta che mi ha colpito ricaricare

242
00:14:22,470 --> 00:14:25,230
o manualmente visitare questo URL in un browser,

243
00:14:25,230 --> 00:14:29,230
il mio browser per definizione di HTTP sta per presentare il timbro a mano

244
00:14:29,230 --> 00:14:31,940
ancora e ancora e ancora.

245
00:14:31,940 --> 00:14:34,550
Così, anche se il server non necessariamente sa chi sono io,

246
00:14:34,550 --> 00:14:39,610
almeno loro sanno che io sono lo stesso utente o per lo meno, più in particolare, lo stesso browser.

247
00:14:39,610 --> 00:14:45,660
E così questo è in definitiva come il superglobale SESSION viene implementato.

248
00:14:45,660 --> 00:14:51,200
Il server non ha idea di chi sei quando si rivisita un sito web per la seconda o la terza volta

249
00:14:51,200 --> 00:14:53,410
a meno che non presenti questo francobollo mano.

250
00:14:53,410 --> 00:14:55,530
E non appena si presenti quel timbro mano,

251
00:14:55,530 --> 00:14:59,370
il server web va essenzialmente in un piccolo database propria

252
00:14:59,370 --> 00:15:06,040
e controlli, va bene, ho appena visto il timbro mano di bo8dal3ct utente e così via.

253
00:15:06,040 --> 00:15:09,850
Fammi vedere quali informazioni il programmatore ha memorizzato

254
00:15:09,850 --> 00:15:12,380
interno della superglobale per questo utente,

255
00:15:12,380 --> 00:15:17,000
e poi voglio fare in modo che che i dati è di nuovo all'interno del SESSIONE superglobale

256
00:15:17,000 --> 00:15:19,830
in modo che il programmatore può nuovamente accedere ai dati

257
00:15:19,830 --> 00:15:23,360
anche se è stato fissato alcuni minuti o ore fa.

258
00:15:23,360 --> 00:15:26,150
Quindi, in altre parole, i biscotti, che ha ottenuto una cattiva reputazione per qualche tempo

259
00:15:26,150 --> 00:15:29,990
a causa delle insicurezze nei browser e possono davvero violare la nostra privacy e tutto questo,

260
00:15:29,990 --> 00:15:31,900
in realtà hanno grande utilità perché senza di loro

261
00:15:31,900 --> 00:15:36,110
si sarebbe costantemente l'accesso a ogni pagina di Facebook si visita

262
00:15:36,110 --> 00:15:40,680
o ogni e-mail di Gmail si legge se il browser non ha un modo di ricordare

263
00:15:40,680 --> 00:15:43,320
che hai già autenticato.

264
00:15:43,320 --> 00:15:46,640
>> Quindi, in questo modo i cookie vengono inviati avanti e indietro attraverso il filo.

265
00:15:46,640 --> 00:15:52,470
Un'altra curiosità sui cookie, soprattutto qui, è che questo è completamente in chiaro.

266
00:15:52,470 --> 00:15:54,930
Non c'è la crittografia sta succedendo qui di sorta,

267
00:15:54,930 --> 00:15:57,240
e in effetti sto usando HTTP in questo momento.

268
00:15:57,240 --> 00:16:00,890
Uno dei nostri momenti preferiti in CS50, che è ormai 2 anni fa,

269
00:16:00,890 --> 00:16:04,750
è stato tutto il tempo di uno strumento chiamato Firesheep è venuto fuori.

270
00:16:04,750 --> 00:16:08,320
Questo è stato un software gratuito che è stato fatto da un ricercatore di sicurezza

271
00:16:08,320 --> 00:16:13,250
come un campanello d'allarme per la comunità per dire quanto atrocemente implementato

272
00:16:13,250 --> 00:16:17,900
alcuni meccanismi di autenticazione sul web erano.

273
00:16:17,900 --> 00:16:22,880
Così, per qualche tempo, Facebook è stato quasi interamente su HTTP, HTTPS n.

274
00:16:22,880 --> 00:16:25,640
E anche se non avete idea di come la crittografia funziona, S è sicuro

275
00:16:25,640 --> 00:16:27,950
quindi vuol dire che ci sia almeno un po 'di crittazione.

276
00:16:27,950 --> 00:16:30,610
Facebook ha utilizzato per crittografare i nomi utente e le password,

277
00:16:30,610 --> 00:16:33,560
ma non appena si guardò i vostri Pokemon oi vostri messaggi o tuo feed di notizie,

278
00:16:33,560 --> 00:16:35,360
tutto questo è chiaro.

279
00:16:35,360 --> 00:16:37,870
Così è stato fino a poco Gmail un anno o due fa.

280
00:16:37,870 --> 00:16:41,100
Ogni volta che ci si è collegati, sì, hanno usato la crittografia sicura,

281
00:16:41,100 --> 00:16:44,300
ma poi non l'hanno fatto. E perché sarebbe?

282
00:16:44,300 --> 00:16:49,210
Perché non utilizzare la crittografia per tutto il tempo in casi d'uso come questo?

283
00:16:49,210 --> 00:16:53,700
Che cos'è? Penso di aver sentito qualcosa. [Studente] Velocità.

284
00:16:53,700 --> 00:16:56,250
Velocità, giusto? Ci sono modi per aggirare questo.

285
00:16:56,250 --> 00:16:59,610
Ma se solo tipo di pensare logicamente, se si crittografa qualcosa,

286
00:16:59,610 --> 00:17:01,820
quello che dovete fare almeno un po 'di lavoro di più.

287
00:17:01,820 --> 00:17:05,460
In pset 2 quando è stato implementato Cesare o Vigenère o anche Crack,

288
00:17:05,460 --> 00:17:07,760
solo la stampa di una stringa è relativamente facile.

289
00:17:07,760 --> 00:17:12,040
Crittografia e quindi la stampa di una stringa minimamente richiede un lavoro un po 'di più.

290
00:17:12,040 --> 00:17:14,520
>>  Per i super-siti web popolari come Google e Facebook,

291
00:17:14,520 --> 00:17:18,839
se si deve lavorare di più per ogni utente per ogni singola pagina web che visitano,

292
00:17:18,839 --> 00:17:20,520
che vuole solo più tempo di CPU.

293
00:17:20,520 --> 00:17:22,920
E se avete bisogno di più tempo di CPU, potrebbe essere necessario più server,

294
00:17:22,920 --> 00:17:24,270
il che significa che potrebbe essere necessario più soldi.

295
00:17:24,270 --> 00:17:27,579
E così per molti anni, questo proprio non era davvero delle migliori pratiche.

296
00:17:27,579 --> 00:17:31,440
La gente utilizza la crittografia SSL solo quando avevano bisogno di.

297
00:17:31,440 --> 00:17:34,960
Ma si è scoperto, e come costui con Firesheep in super chiaro,

298
00:17:34,960 --> 00:17:37,920
quando voi ragazzi che sono attualmente su Facebook in questo momento -

299
00:17:37,920 --> 00:17:39,880
Per curiosità, vediamo se ti confessa.

300
00:17:39,880 --> 00:17:42,620
Se siete su Facebook in questo momento in qualche scheda, anche se non è in primo piano,

301
00:17:42,620 --> 00:17:46,610
è l'URL HTTP o HTTPS?

302
00:17:46,610 --> 00:17:50,560
[Più studenti] S. S? [Risate]

303
00:17:50,560 --> 00:17:55,510
Va bene. Qualsiasi HTTP? Situato a solo 1? Va bene.

304
00:17:55,510 --> 00:17:58,940
Così tutti noi possiamo incidere account di Facebook di quel tizio in questo momento.

305
00:17:58,940 --> 00:18:04,100
Per la maggior parte questo è diventato attivo di default, almeno in alcuni siti web.

306
00:18:04,100 --> 00:18:08,120
E per farla breve, se il tuo traffico web non è crittografato,

307
00:18:08,120 --> 00:18:12,960
non solo il codice HTML andare avanti e indietro attraverso le WiFis in chiaro,

308
00:18:12,960 --> 00:18:16,760
in modo da fare le cose come i biscotti andare avanti e indietro per tutta l'aria

309
00:18:16,760 --> 00:18:18,940
senza alcuna forma di crittografia.

310
00:18:18,940 --> 00:18:23,540
Quindi, se avete un po 'di buon senso programmazione o un po' di usare Google competenze

311
00:18:23,540 --> 00:18:27,410
per trovare software gratuito che fa questo, tutto ciò che dovete fare è sedersi a Starbucks

312
00:18:27,410 --> 00:18:30,680
o sedersi in un aeroporto dove è generalmente chiaro WiFi

313
00:18:30,680 --> 00:18:36,070
e solo guardare per parole chiave come Set-Cookie: PHPSESSID o

314
00:18:36,070 --> 00:18:39,300
perché se si ha la conoscenza tecnologica per guardare solo il WiFi

315
00:18:39,300 --> 00:18:43,010
per tutti i bit che tutto il flusso d'aria per questo modello,

316
00:18:43,010 --> 00:18:50,840
si può quindi dire che la PHPSESSID ragazzo sembra essere bo8dal e così via.

317
00:18:50,840 --> 00:18:53,890
E poi di nuovo, se siete sufficientemente smaliziati o avere lo strumento giusto,

318
00:18:53,890 --> 00:18:58,890
si può quindi solo riconfigurare il browser per iniziare a presentare quel timbro mano

319
00:18:58,890 --> 00:19:05,030
a Facebook.com, e Facebook è solo andare a supporre che sei quel tipo

320
00:19:05,030 --> 00:19:09,880
perché tutti sanno che non è chi sei, ma che si dispone di questo identificatore univoco.

321
00:19:09,880 --> 00:19:14,650
Quindi, se si ruba che identificatore univoco e presentarlo al server Web come il tuo,

322
00:19:14,650 --> 00:19:16,860
sono solo intenzione di mostrare feed di notizie di quella persona

323
00:19:16,860 --> 00:19:18,980
o di quella persona messaggi o poke.

324
00:19:18,980 --> 00:19:23,190
>> E io ora come Google per attivare HTTPS per Facebook forse.

325
00:19:23,190 --> 00:19:25,150
Ma è davvero così semplice come sembra.

326
00:19:25,150 --> 00:19:27,660
E così Facebook e Google e simili hanno ottenuto davvero bravo in questo,

327
00:19:27,660 --> 00:19:31,870
ma tenete gli occhi aperti tanto più per i siti web visitati che non utilizzano il protocollo HTTP

328
00:19:31,870 --> 00:19:35,020
e avere un qualche tipo di informazioni sensibili su di loro,

329
00:19:35,020 --> 00:19:37,490
se è finanziario o personale o simili.

330
00:19:37,490 --> 00:19:43,180
Se non si utilizza questo, molto probabilmente i cookie come questo può essere molto facilmente rubati

331
00:19:43,180 --> 00:19:46,270
e poi forgiato, ed è esattamente quello che ha fatto Firesheep.

332
00:19:46,270 --> 00:19:48,250
Non c'era bisogno di essere un programmatore.

333
00:19:48,250 --> 00:19:51,680
Tutto quello che doveva fare era disporre di una connessione Internet, scaricare questo strumento gratuito,

334
00:19:51,680 --> 00:19:56,490
e quello che vorrei fare è la connessione e poi ti mostrano i nomi di Facebook

335
00:19:56,490 --> 00:20:00,170
in ognuno di Sanders, in questa dimostrazione particolare, intorno a te

336
00:20:00,170 --> 00:20:03,260
e tutto quello che doveva fare era fare clic sul loro nome e il software automatizzato il processo

337
00:20:03,260 --> 00:20:05,970
di sniffing il cookie, presentandolo a Facebook come il tuo,

338
00:20:05,970 --> 00:20:07,990
e, voilà, sei loggato

339
00:20:07,990 --> 00:20:11,190
Quindi questo è un altro di quei "non fare questo" ufficialmente.

340
00:20:11,190 --> 00:20:14,660
Se si dispone di una rete domestica e si desidera sperimentare, con tutti i mezzi,

341
00:20:14,660 --> 00:20:17,530
ma realizzare questo non attraversare la linea in un ambiente universitario.

342
00:20:17,530 --> 00:20:20,030
>> Ma l'obiettivo qui è davvero a sottolineare non come fare

343
00:20:20,030 --> 00:20:22,320
ma come difendersi da questo genere di cose.

344
00:20:22,320 --> 00:20:26,180
E la soluzione banale qui, anche se essa stessa è viziata,

345
00:20:26,180 --> 00:20:31,360
è quello di ridurre realmente l'uso di altri siti che non utilizzano HTTPS costantemente.

346
00:20:31,360 --> 00:20:34,520
Quindi, siti come Facebook e Google hanno sempre più caselle di controllo

347
00:20:34,520 --> 00:20:36,200
dove si può optare per questo genere di cose,

348
00:20:36,200 --> 00:20:40,000
e le banche hanno avuto per anni per ragioni analoghe.

349
00:20:40,000 --> 00:20:43,580
Quindi, solo un po 'di un fattore di paura, se possiamo. Ma che è, in poche parole.

350
00:20:43,580 --> 00:20:46,420
È così che un server si ricorda chi sei.

351
00:20:46,420 --> 00:20:50,760
E non appena si riesce a ricordare chi sei, si può ricordare nulla di te

352
00:20:50,760 --> 00:20:56,140
che il programmatore ha memorizzato all'interno di questo superglobale speciale chiamata $ _SESSION.

353
00:20:56,140 --> 00:20:59,750
E per pset 7 si è in uso banalmente solo per ricordare un int,

354
00:20:59,750 --> 00:21:02,260
vale a dire l'ID univoco dell'utente che ha effettuato l'accesso,

355
00:21:02,260 --> 00:21:05,880
in modo che sappiamo che ci sono stato prima.

356
00:21:05,880 --> 00:21:12,450
Tutte le domande poi su sessioni o cookie o simili?

357
00:21:12,450 --> 00:21:15,130
Firesheep non funziona più bene,

358
00:21:15,130 --> 00:21:18,310
e si deve mettere il computer in una speciale modalità promiscua

359
00:21:18,310 --> 00:21:20,700
così si sta effettivamente in ascolto del traffico, oltre voi stessi.

360
00:21:20,700 --> 00:21:23,940
Quindi, se si sta scaricando Firesheep, rendersene conto è non è così facile

361
00:21:23,940 --> 00:21:26,850
come una volta di dimostrare.

362
00:21:26,850 --> 00:21:29,070
Bene. E non lo fanno a Sanders. Fatelo a casa.

363
00:21:29,070 --> 00:21:30,890
Basi di dati.

364
00:21:30,890 --> 00:21:33,580
Una delle cose che abbiamo fatto in pset 7 molto deliberatamente

365
00:21:33,580 --> 00:21:37,780
è stato vi diamo una tabella di database di esempio per gli utenti che ha alcuni ID utente,

366
00:21:37,780 --> 00:21:41,020
alcuni nomi utente e le password criptate in esso alcuni.

367
00:21:41,020 --> 00:21:44,520
E come vedrete, se non l'hai già fatto, si sta andando ad avere per modificare la tabella un po '.

368
00:21:44,520 --> 00:21:47,710
Stai andando ad avere per aggiungere un po 'di cache per ciascuno degli utenti in tale tabella,

369
00:21:47,710 --> 00:21:51,130
e si sta andando ad avere per aggiungere un'altra tabella storia, una tabella di portafogli,

370
00:21:51,130 --> 00:21:53,310
o forse chiamarlo qualcos'altro.

371
00:21:53,310 --> 00:21:56,740
Ma in termini di pensare a come fare questo, cerchiamo di aprire questo strumento

372
00:21:56,740 --> 00:22:00,570
che abbiamo usato il Venerdì, ma se non familiare, l'apparecchio è dotato di uno strumento di

373
00:22:00,570 --> 00:22:04,680
chiamato phpMyAdmin che è guarda caso scritto in PHP,

374
00:22:04,680 --> 00:22:07,950
ma il suo scopo nella vita, dopo il login qui come jharvard di cremisi,

375
00:22:07,950 --> 00:22:15,160
è di darmi una interfaccia user-friendly di visualizzare e modificare il mio database.

376
00:22:15,160 --> 00:22:18,040
>> Il database che sto correndo l'apparecchio si chiama MySQL.

377
00:22:18,040 --> 00:22:23,420
Questo è molto popolare, ed è un database gratuito open source che è estremamente facile da usare,

378
00:22:23,420 --> 00:22:25,620
in particolare con la parte anteriore finisce così.

379
00:22:25,620 --> 00:22:29,350
Ciò che questo strumento mi permette di fare, per esempio, è attizzare intorno ai tavoli.

380
00:22:29,350 --> 00:22:30,890
Lasciatemi andare avanti e farlo.

381
00:22:30,890 --> 00:22:36,580
Venerdì abbiamo creato una tabella denominata studenti che era super semplice.

382
00:22:36,580 --> 00:22:41,680
Aveva 3 colonne - id, nome, e-mail - e ho inserito manualmente un paio di righe

383
00:22:41,680 --> 00:22:44,420
come David e Mike in questo esempio particolare.

384
00:22:44,420 --> 00:22:47,290
Prendiamo questo un po 'oltre, e supponiamo che vogliamo ricordare di più

385
00:22:47,290 --> 00:22:49,660
di un semplice nome ed email su un utente.

386
00:22:49,660 --> 00:22:53,090
Permettetemi di fare clic su Struttura qui in alto.

387
00:22:53,090 --> 00:22:55,440
E ancora, il pset ti guida attraverso i passi necessari qui,

388
00:22:55,440 --> 00:22:58,150
quindi non preoccupatevi se una parte di questa è un po 'veloce.

389
00:22:58,150 --> 00:22:59,690
Poi ho intenzione di fare clic su qui.

390
00:22:59,690 --> 00:23:02,270
Ho intenzione di aggiungere un certo numero di colonne dopo e-mail

391
00:23:02,270 --> 00:23:04,130
perché voglio aggiungere qualcosa di simile a casa.

392
00:23:04,130 --> 00:23:06,640
Ho dimenticato di registrare casa di uno studente.

393
00:23:06,640 --> 00:23:11,400
Lasciatemi fare clic su Vai, e ora abbiamo questa forma che è, purtroppo, un po 'largo da sinistra a destra,

394
00:23:11,400 --> 00:23:13,710
ma ho intenzione di chiamare il nome di questa casa campo,

395
00:23:13,710 --> 00:23:16,050
e poi il tipo di ora deve scegliere.

396
00:23:16,050 --> 00:23:18,870
Quindi cerchiamo di fare una chiacchierata breve descrizione dei vari tipi di MySQL

397
00:23:18,870 --> 00:23:24,590
perché mentre PHP è debolmente tipizzato e che tipo di gioca a tira e molla con i tipi,

398
00:23:24,590 --> 00:23:29,430
in un database in particolare è importante super per utilizzare effettivamente la tipizzazione a vostro vantaggio

399
00:23:29,430 --> 00:23:33,260
perché una delle cose MySQL e altri motori di database può fare per voi

400
00:23:33,260 --> 00:23:37,910
è assicurarsi di non inserire dati fasulli nel database.

401
00:23:37,910 --> 00:23:41,850
Questa è una sorta di errori di controllo a vostra disposizione.

402
00:23:41,850 --> 00:23:46,250
>> Per la casa che, ovviamente, non voglio che sia un int, che è un valore a 32 bit in MySQL.

403
00:23:46,250 --> 00:23:49,810
Abbiamo fatto parlare brevemente il Venerdì su varchar, che sta per lunghezza variabile char.

404
00:23:49,810 --> 00:23:54,720
Che cosa è questo? Ciò consente di specificare che si desidera che questo sia una stringa di qualche tipo.

405
00:23:54,720 --> 00:23:56,840
Non so davvero in anticipo quanto è lungo,

406
00:23:56,840 --> 00:24:00,100
quindi ci arbitrariamente pronunciare un nome casa può essere 255 caratteri,

407
00:24:00,100 --> 00:24:04,190
ma si potrebbe andare con 32, 64 - un numero davvero.

408
00:24:04,190 --> 00:24:10,700
Ma il vantaggio di utilizzare un varchar sopra un campo denominato char è quello?

409
00:24:10,700 --> 00:24:15,110
Proprio intuitivamente se scorrere verso il basso qui, si noti c'è char e c'è varchar.

410
00:24:15,110 --> 00:24:19,520
Varchar è a lunghezza variabile char, char è una lunghezza fissa char.

411
00:24:19,520 --> 00:24:24,730
Quindi, basandoci solo su tale definizione, qual è il vantaggio o svantaggio di ciascuno di questi?

412
00:24:24,730 --> 00:24:30,490
In altre parole, che si preoccupa per la distinzione, o perché te ne importa?

413
00:24:31,660 --> 00:24:35,750
>> Gia '. [Studente] Varchar ha più flessibilità, ma occupa più memoria.

414
00:24:35,750 --> 00:24:40,730
Bene. Varchar occupa più - Vediamo. Non so se ho sentito bene.

415
00:24:40,730 --> 00:24:42,360
Puoi dire che ancora una volta?

416
00:24:42,360 --> 00:24:45,850
[Studente] ho detto varchar probabilmente ha più flessibilità, ma ci vuole più memoria.

417
00:24:45,850 --> 00:24:51,170
Interessante. Va bene. Varchar dà probabilmente una maggiore flessibilità ma occupa più memoria.

418
00:24:51,170 --> 00:24:53,220
Quest'ultimo non è necessariamente vero.

419
00:24:53,220 --> 00:24:56,290
Dipende dal contesto, ma torniamo a questo.

420
00:24:56,290 --> 00:25:03,230
>> [Risposta incomprensibile studente] Esattamente.

421
00:25:03,230 --> 00:25:06,900
In realtà è il caso che char in genere utilizzare più memoria

422
00:25:06,900 --> 00:25:10,950
perché un carattere, come in C, è come una stringa, è un array di caratteri.

423
00:25:10,950 --> 00:25:13,690
Quindi, se si dice un campo char di lunghezza 255,

424
00:25:13,690 --> 00:25:16,910
il database è letteralmente sta per darti 255 caratteri.

425
00:25:16,910 --> 00:25:22,290
E se la casa finisce per essere personaggi Mather e 6 in totale,

426
00:25:22,290 --> 00:25:25,090
stai perdendo più di 200 caratteri.

427
00:25:25,090 --> 00:25:29,640
>> Così un varchar effettivamente utilizza solo i caratteri che è necessario

428
00:25:29,640 --> 00:25:31,590
fino ad un importo massimo.

429
00:25:31,590 --> 00:25:35,470
Ma il prezzo da pagare è in realtà le prestazioni, potenzialmente.

430
00:25:35,470 --> 00:25:39,740
Se sapete in anticipo che tutte le stringhe saranno 8 caratteri -

431
00:25:39,740 --> 00:25:43,090
per esempio, se si desidera che le password di lunghezza 8 -

432
00:25:43,090 --> 00:25:47,350
al rialzo di utilizzare un campo char a volte, se non spesso,

433
00:25:47,350 --> 00:25:51,100
è quello di specificare una lunghezza fissa per qualcosa come una password

434
00:25:51,100 --> 00:25:53,300
perché ora il database può essere ancora più intelligente.

435
00:25:53,300 --> 00:25:58,160
Se si sa che ogni campo char, ogni stringa in una colonna è la stessa lunghezza,

436
00:25:58,160 --> 00:26:00,780
si ritorna la funzione di accesso casuale.

437
00:26:00,780 --> 00:26:05,110
È possibile passare in giro tra i vari campi char nella tabella di database

438
00:26:05,110 --> 00:26:07,940
perché pensare a un database come righe e colonne.

439
00:26:07,940 --> 00:26:11,670
Quindi se ogni una delle stringhe della stessa lunghezza,

440
00:26:11,670 --> 00:26:17,820
si sa che la prima è in byte 0, la prossima è nel byte 8

441
00:26:17,820 --> 00:26:20,240
e poi 16 e poi 24 e così via.

442
00:26:20,240 --> 00:26:24,500
Quindi, se tutte le stringhe sono della stessa lunghezza, è possibile saltare in modo più efficiente.

443
00:26:24,500 --> 00:26:26,710
Così che può essere un vantaggio in termini di prestazioni,

444
00:26:26,710 --> 00:26:29,420
ma in genere non si ha il lusso di sapere in anticipo,

445
00:26:29,420 --> 00:26:32,170
quindi un varchar è la strada da percorrere.

446
00:26:32,170 --> 00:26:36,030
Ecco un altro dettaglio che anche Facebook ha incontrato alla fine.

447
00:26:36,030 --> 00:26:39,670
Ints sono grandi, e abbiamo una sorta di utilizzarli per impostazione predefinita ogni volta che si desidera un numero,

448
00:26:39,670 --> 00:26:41,750
ma è solo 32 bit.

449
00:26:41,750 --> 00:26:46,210
>> E anche se Facebook non hanno abbastanza 4 miliardi di utenti ora,

450
00:26:46,210 --> 00:26:48,680
ci sono sicuramente alcune persone là fuori con più account

451
00:26:48,680 --> 00:26:50,960
o gli account che sono stati aperti e poi chiusi,

452
00:26:50,960 --> 00:26:55,130
e così Facebook stesso credo che qualche anno fa aveva la transizione da int

453
00:26:55,130 --> 00:27:00,010
a, come è giustamente chiamato, bigint, che si trova a soli 64 bit, invece.

454
00:27:00,010 --> 00:27:02,230
Quindi, anche questa è una decisione di progettazione.

455
00:27:02,230 --> 00:27:06,570
Si sarebbe incredibilmente fortunato se il tuo progetto finale risulta di avvio,

456
00:27:06,570 --> 00:27:10,010
ha 4 miliardi e 1 utenti, prendere o lasciare,

457
00:27:10,010 --> 00:27:13,200
in tal caso, con interi potrebbe essere un po 'miope.

458
00:27:13,200 --> 00:27:16,230
Ma in realtà, la tabella utenti è probabilmente bene con int.

459
00:27:16,230 --> 00:27:19,340
Ma per qualcosa come pset 7, come la vostra tabella di storia,

460
00:27:19,340 --> 00:27:23,700
si potrebbe avere migliaia, milioni di utenti se si evolvono in etrade.com.

461
00:27:23,700 --> 00:27:26,020
Così, mentre si potrebbe non avere più di 4 miliardi di utenti,

462
00:27:26,020 --> 00:27:30,070
quegli utenti che non hanno possono avere più di 4 miliardi di transazioni nel corso del tempo -

463
00:27:30,070 --> 00:27:33,200
compra e vende le cose e della loro storia.

464
00:27:33,200 --> 00:27:38,090
Quindi, se si fa anticipare - ancora una volta, si tratta di problemi bene avere se si dispone di questa quantità di dati -

465
00:27:38,090 --> 00:27:40,920
se si fa anticipare dati che superano la dimensione di un int,

466
00:27:40,920 --> 00:27:47,740
andare con qualcosa di simile a bigint è una direzione non abbastanza frequentemente adottata dai progettisti

467
00:27:47,740 --> 00:27:49,710
perché dato che la gente non sarà un problema,

468
00:27:49,710 --> 00:27:51,930
ma è così facile scegliere qualcosa di più grande di questo.

469
00:27:51,930 --> 00:27:55,380
Decimale stiamo usando in pset 7, che specifica precisione fissa

470
00:27:55,380 --> 00:27:59,840
in modo da poter evitare i problemi che coinvolgono float e double e reali e simili.

471
00:27:59,840 --> 00:28:02,440
>> E poi ci sono alcuni altri campi qui. Ci onda le mani su di loro in una certa misura.

472
00:28:02,440 --> 00:28:07,270
Ma date, gli orari tutti hanno un formato predefinito in MySQL,

473
00:28:07,270 --> 00:28:10,830
e il vantaggio di memorizzare date come date e non VARCHAR

474
00:28:10,830 --> 00:28:15,730
significa che il database può effettivamente riformattare in diversi formati,

475
00:28:15,730 --> 00:28:18,800
se un formato degli Stati Uniti o formato europeo o simili - ma lo vuoi -

476
00:28:18,800 --> 00:28:22,700
molto più efficiente se fosse solo un po 'di generico varchar.

477
00:28:22,700 --> 00:28:25,150
E poi c'è qualche altra binary, varbinary, blob.

478
00:28:25,150 --> 00:28:28,580
Si tratta di oggetti binari di grandi dimensioni, ed è possibile anche memorizzare dati binari

479
00:28:28,580 --> 00:28:30,750
così come i dati geometrici in un database.

480
00:28:30,750 --> 00:28:34,350
Ma per noi di solito ci preoccupiamo int e VARCHAR e simili.

481
00:28:34,350 --> 00:28:36,230
Facciamo finire questo esempio con la casa.

482
00:28:36,230 --> 00:28:40,030
Casa ho intenzione di dire arbitrariamente sarà 255 caratteri.

483
00:28:40,030 --> 00:28:42,850
Poi valore di default che potrebbe fare questo.

484
00:28:42,850 --> 00:28:47,440
Potremmo per impostazione predefinita mettere tutti in Mather Casa, per esempio.

485
00:28:47,440 --> 00:28:49,710
Ecco come si potrebbe specificare che il database

486
00:28:49,710 --> 00:28:52,460
dovrebbe assicurare che qualcuno ha sempre un valore. Ma lascio che sia.

487
00:28:52,460 --> 00:28:55,270
Infatti, per le persone che vivono fuori dal campus e non in una casa,

488
00:28:55,270 --> 00:28:59,590
forse in realtà desidera specificare che il valore predefinito è NULL per la casa,

489
00:28:59,590 --> 00:29:04,890
e poi ho bisogno di selezionare questa casella e dire il database che va bene se la casa dell'utente è NULL.

490
00:29:04,890 --> 00:29:07,270
>> Ancora una volta, questo è un altro meccanismo di difesa si può mettere in atto

491
00:29:07,270 --> 00:29:10,590
quindi non hanno nemmeno bisogno di mettere nel codice PHP necessariamente.

492
00:29:10,590 --> 00:29:14,630
La banca dati in modo che le cose sono o non sono NULL.

493
00:29:14,630 --> 00:29:17,310
E poi, infine, Attributi.

494
00:29:17,310 --> 00:29:18,920
Nessuno di questi sono davvero rilevanti.

495
00:29:18,920 --> 00:29:22,880
Binario, unsigned - nessuno di questi sono rilevanti per un varchar.

496
00:29:22,880 --> 00:29:24,220
Index.

497
00:29:24,220 --> 00:29:27,320
Qualcuno sa o ricordare o avere una stima di ciò che è un indice

498
00:29:27,320 --> 00:29:29,510
per qualcosa come casa?

499
00:29:29,510 --> 00:29:35,240
Anche questo è in realtà una decisione di progetto importante e relativamente facile.

500
00:29:35,240 --> 00:29:39,200
Per coloro che non hanno ancora visto, il Venerdì abbiamo parlato brevemente sulle chiavi primarie.

501
00:29:39,200 --> 00:29:43,240
In una tabella di database, una chiave primaria è il campo o colonna

502
00:29:43,240 --> 00:29:46,270
che identifica in modo univoco le righe nella tabella.

503
00:29:46,270 --> 00:29:49,150
Così nella tabella corrente ID che abbiamo, abbiamo nomi ed e-mail.

504
00:29:49,150 --> 00:29:52,050
Quale di questi è il miglior candidato a essere una chiave primaria,

505
00:29:52,050 --> 00:29:55,810
il cui ruolo è quello di identificare univocamente le righe?

506
00:29:55,810 --> 00:29:57,530
Probabilmente ID.

507
00:29:57,530 --> 00:29:59,930
Probabilmente, si potrebbe anche usare quello che però?

508
00:29:59,930 --> 00:30:02,860
Forse si potrebbe utilizzare la posta elettronica perché, in teoria, è unico nel suo genere

509
00:30:02,860 --> 00:30:05,380
a meno che le persone condividono account e-mail.

510
00:30:05,380 --> 00:30:09,980
Ma la realtà è che se si sta utilizzando un ID numerico come 1234,

511
00:30:09,980 --> 00:30:14,170
che è solo a 32 bit, mentre un indirizzo di posta elettronica potrebbe essere questo numero di byte o questo byte molti.

512
00:30:14,170 --> 00:30:16,610
Quindi, in termini di efficienza per gli identificatori univoci,

513
00:30:16,610 --> 00:30:19,270
tende ad essere buona solo per usare un int

514
00:30:19,270 --> 00:30:23,090
anche se avete qualche candidato stringa che si potrebbe forse usare.

515
00:30:23,090 --> 00:30:26,760
>> Per qualcosa di simile a casa, questo non dovrebbe essere una chiave primaria

516
00:30:26,760 --> 00:30:30,770
perché allora solo 1 persona potrebbe vivere in Mather e 1 persona in Currier e simili.

517
00:30:30,770 --> 00:30:32,790
Allo stesso modo, questo non dovrebbe essere unico.

518
00:30:32,790 --> 00:30:37,830
La differenza tra primario e unico è che nel caso della nostra tabella corrente,

519
00:30:37,830 --> 00:30:42,620
ID dovrebbe essere primaria ma e-mail non è di primaria importanza per le ragioni che abbiamo appena citato -

520
00:30:42,620 --> 00:30:44,740
prestazioni - ma dovrebbe comunque essere univoci.

521
00:30:44,740 --> 00:30:47,200
Così si può ancora applicare l'univocità senza la pretesa

522
00:30:47,200 --> 00:30:49,520
che si tratta di un super importante settore primario.

523
00:30:49,520 --> 00:30:52,610
Ma questo è molto utile: Index.

524
00:30:52,610 --> 00:30:56,180
Se si conosce in anticipo per il vostro progetto finale, per pset 7, o, in generale,

525
00:30:56,180 --> 00:30:59,480
che questa casa campo sta per essere qualcosa che effettuare una ricerca molto

526
00:30:59,480 --> 00:31:01,910
utilizzando la parola chiave di selezione o qualcosa d'altro,

527
00:31:01,910 --> 00:31:05,180
allora si può dire preventivamente il database di lavorare la sua magia

528
00:31:05,180 --> 00:31:10,510
e assicurarsi che viene creato nella memoria tutte le strutture di dati di fantasia necessario

529
00:31:10,510 --> 00:31:13,770
per velocizzare le ricerche basate sulla casa.

530
00:31:13,770 --> 00:31:17,860
Forse sarà utilizzare una tabella hash, forse userà una lista concatenata.

531
00:31:17,860 --> 00:31:21,260
In realtà, si tende ad utilizzare un albero, spesso una struttura chiamata B-tree -

532
00:31:21,260 --> 00:31:24,090
Non un albero binario, ma un B-albero - che è un albero molto ampia

533
00:31:24,090 --> 00:31:27,370
che si potrebbe vedere in una classe come CS124, la classe di strutture di dati.

534
00:31:27,370 --> 00:31:31,800
Ma insomma, non si deve preoccupare che quando si usa il software intelligente di database.

535
00:31:31,800 --> 00:31:35,890
Si può semplicemente dire "Indice di questo campo in modo da poter cercare in modo più efficiente."

536
00:31:35,890 --> 00:31:40,250
>> Se si lascia questa via e si tenta di cercare per tutta la banca dati che vive a Mather,

537
00:31:40,250 --> 00:31:42,710
lo devolverà in ricerca lineare.

538
00:31:42,710 --> 00:31:45,360
E se hai 6000 undergrads tutti vivendo in una casa,

539
00:31:45,360 --> 00:31:47,900
si sta andando a cercare l'intera tabella per trovare le Matherites,

540
00:31:47,900 --> 00:31:52,190
mentre se si dice indice, speriamo che sia qualcosa di simile a una ricerca logaritmica

541
00:31:52,190 --> 00:31:54,510
per trovare questo tipo di studenti.

542
00:31:54,510 --> 00:31:56,750
Questa è solo una caratteristica gratuito per attivare,

543
00:31:56,750 --> 00:31:59,530
anche se non hanno un prezzo di una certa quantità di spazio.

544
00:31:59,530 --> 00:32:02,690
Infine, incremento automatico, questo campo AI,

545
00:32:02,690 --> 00:32:05,830
il che significa che solo se si tratta di un int e non si desidera prendersi cura di incrementare da soli

546
00:32:05,830 --> 00:32:07,570
ogni volta che c'è un nuovo utente, verificare che,

547
00:32:07,570 --> 00:32:11,910
e ogni utente che viene inserito automaticamente ottenere un nuovo ID.

548
00:32:11,910 --> 00:32:15,620
Facciamo clic su Salva, e ora andiamo a trovare un difetto a questo disegno.

549
00:32:15,620 --> 00:32:20,200
Se vado in Usa, si noti che sia Mike e la mia casa è NULL.

550
00:32:20,200 --> 00:32:22,420
Posso usare phpMyAdmin per modificare manualmente.

551
00:32:22,420 --> 00:32:25,110
Posso andare qui e digitare Mather e poi premere Invio,

552
00:32:25,110 --> 00:32:27,740
e ora notare la tabella è diverso.

553
00:32:27,740 --> 00:32:29,270
Ma notate che potessi fare anche qualcos'altro.

554
00:32:29,270 --> 00:32:33,530
ID David è 1, per cui phpMyAdmin è ancora solo uno strumento di amministrazione;

555
00:32:33,530 --> 00:32:35,970
questo non è qualcosa che gli utenti sono sempre di andare a vedere.

556
00:32:35,970 --> 00:32:38,810
Quindi, se io invece fare clic sulla scheda SQL sulla parte superiore -

557
00:32:38,810 --> 00:32:41,450
e ancora, pset 7 vi introdurrà più di queste domande -

558
00:32:41,450 --> 00:32:45,260
Posso eseguire manualmente il comando SQL strutturato linguaggio di query

559
00:32:45,260 --> 00:32:56,410
UPDATE utenti SET casa = 'Pfoho' WHERE id = 1.

560
00:32:56,410 --> 00:33:00,830
Queste query SQL sono, ben abbastanza, abbastanza leggibile da sinistra a destra.

561
00:33:00,830 --> 00:33:04,350
Aggiornare la tabella utenti, impostare il campo chiamato casa per Pfoho

562
00:33:04,350 --> 00:33:06,830
dove ID dell'utente è 1.

563
00:33:06,830 --> 00:33:11,480
Oppure potrei anche fare dove email = 'malan@harvard.edu'.

564
00:33:11,480 --> 00:33:14,860
Finché univoco che identifica me, che avrebbe funzionato così.

565
00:33:14,860 --> 00:33:18,810
Ma ID tende ad essere più elevato di prestazioni, quindi cerchiamo di farlo.

566
00:33:18,810 --> 00:33:22,950
Facciamo clic su Vai. Ok, lecture.users non esiste. Qual è il mio errore?

567
00:33:22,950 --> 00:33:26,220
Qual è la tabella in realtà chiamato qui?

568
00:33:26,220 --> 00:33:28,770
Si chiama gli studenti solo perché questo è quello che abbiamo fatto qui in alto a sinistra.

569
00:33:28,770 --> 00:33:31,860
Si chiama gli studenti e non gli utenti. Quindi, fare clic su Vai ora.

570
00:33:31,860 --> 00:33:34,330
1 row affected. Query in 0.01 secondi.

571
00:33:34,330 --> 00:33:38,010
Se io ora fare clic su Sfoglia, ora vive in Pfoho Malan.

572
00:33:38,010 --> 00:33:42,070
Ecco, questo è un altro assaggio di SQL, ma il pset vi guiderà attraverso un po 'di più di questo.

573
00:33:42,070 --> 00:33:44,710
>> C'è una decisione stupida che ho già fatto qui.

574
00:33:44,710 --> 00:33:47,820
Direi che questo disegno di database è inefficiente

575
00:33:47,820 --> 00:33:51,650
perché le persone più che aggiungere alla tabella studenti,

576
00:33:51,650 --> 00:33:54,730
più di noi, io iniziare ad aggiungere, il più delle TF ho iniziare ad aggiungere,

577
00:33:54,730 --> 00:33:58,320
stiamo per iniziare a vedere che cosa esuberi in questa tabella?

578
00:34:00,840 --> 00:34:06,020
>> Gia '. [Studente] Visto che è tra gli studenti, stiamo usando la stessa [incomprensibile]

579
00:34:06,020 --> 00:34:07,360
Lo stesso - destra, esattamente.

580
00:34:07,360 --> 00:34:10,400
Quindi, se 400 persone vivono in Mather, prendere o lasciare,

581
00:34:10,400 --> 00:34:15,000
alla fine questa tabella sta per avere 400 righe che dicono "Mather," "Mather,"

582
00:34:15,000 --> 00:34:16,590
"Mather", "Mather", "Mather".

583
00:34:16,590 --> 00:34:19,820
Stiamo perdendo tutti questi byte, e ci sono un paio di take-away lì.

584
00:34:19,820 --> 00:34:23,080
1, c'è il caso angolo pazzesco dove se qualcuno paga un sacco di soldi

585
00:34:23,080 --> 00:34:25,949
e rinomina Mather, ora dobbiamo cambiare la nostra intera tabella del database.

586
00:34:25,949 --> 00:34:29,730
Questo non succederà spesso, anche se una volta era chiamato Pfoho North House 15 anni fa,

587
00:34:29,730 --> 00:34:32,310
così accade. Ma questo non è tutto ciò che convincente.

588
00:34:32,310 --> 00:34:36,000
Più convincente di un caso d'angolo come quello di dover aggiornare i dati in massa

589
00:34:36,000 --> 00:34:41,150
per un database è perché la possibilità di immagazzinarli MATHER ancora e ancora e ancora e ancora?

590
00:34:41,150 --> 00:34:43,020
Questo è un sacco di caratteri, 6 caratteri.

591
00:34:43,020 --> 00:34:45,500
Non possiamo fare anche di meglio, soprattutto per Pforzheimer?

592
00:34:45,500 --> 00:34:48,320
Sicuramente possiamo fare meglio di che molti personaggi.

593
00:34:48,320 --> 00:34:51,790
Perché non associare un identificatore univoco di ogni casa

594
00:34:51,790 --> 00:34:55,020
e negozio che per ogni utente? Quindi cerchiamo di provare questo.

595
00:34:55,020 --> 00:35:00,610
Piuttosto che utilizzare la tabella studenti, lasciami andare fino al mio database conferenza qui in alto a sinistra.

596
00:35:00,610 --> 00:35:02,600
Notiamo qui dice Crea una tabella.

597
00:35:02,600 --> 00:35:04,550
Vorrei creare una nuova tabella denominata case.

598
00:35:04,550 --> 00:35:08,880
Il numero di colonne sarà 2. Invio.

599
00:35:08,880 --> 00:35:11,200
Ora ho 2 campi.

600
00:35:11,200 --> 00:35:14,600
Io vado a chiamare questo il nome, e che sta per essere un varchar di lunghezza 255,

601
00:35:14,600 --> 00:35:18,770
>> ma che è piuttosto arbitraria. Vorrei mettere questo qui per convenzione.

602
00:35:18,770 --> 00:35:22,840
Così si può mettere un ID qui. Diamo ogni casa un identificatore univoco.

603
00:35:22,840 --> 00:35:25,360
Diamo ogni casa un nome.

604
00:35:25,360 --> 00:35:30,980
Facciamo specificare che l'identificatore sarà firmato solo per convenzione di usare solo numeri positivi.

605
00:35:30,980 --> 00:35:35,020
Andiamo avanti e dare a questo un campo a incremento automatico per ora.

606
00:35:35,020 --> 00:35:38,160
E abbiamo bisogno di qualcos'altro?

607
00:35:38,160 --> 00:35:41,010
Andiamo avanti e fare clic su Salva.

608
00:35:41,010 --> 00:35:42,480
Ora ho una seconda tabella.

609
00:35:42,480 --> 00:35:45,860
Si noti per inciso questo è il comando un po 'criptico SQL

610
00:35:45,860 --> 00:35:50,280
che avrebbe dovuto digitare manualmente se non si utilizza uno strumento di amministrazione come phpMyAdmin.

611
00:35:50,280 --> 00:35:51,990
Quindi un altro motivo lo usiamo.

612
00:35:51,990 --> 00:35:55,480
E 'una sorta meravigliosamente utile pedagogicamente, perché è possibile fare clic in giro

613
00:35:55,480 --> 00:36:01,050
e capire come funzionano le cose, semplicemente copiando e incollando quello che ha fatto phpMyAdmin.

614
00:36:01,050 --> 00:36:04,150
Ma il comando CREATE TABLE è ciò che è stato appena eseguito, e qui è il mio tavolo.

615
00:36:04,150 --> 00:36:11,370
Lasciami andare avanti ora e utilizzare SQL prime, piuttosto che eccessivamente facendo clic sulla scheda Inserisci.

616
00:36:11,370 --> 00:36:15,040
Permettetemi di fare INSERT INTO case,

617
00:36:15,040 --> 00:36:22,230
e ho intenzione di dire il nome della casa avrà un valore di 'Mather'.

618
00:36:22,230 --> 00:36:24,790
Tutto qui. Questa sintassi è un po 'più criptico.

619
00:36:24,790 --> 00:36:26,660
Questo è il nome dei campi che vogliamo inserire.

620
00:36:26,660 --> 00:36:30,390
Questi sono i valori che vogliamo inserire in questi campi. Lasciatemi fare clic su Vai.

621
00:36:30,390 --> 00:36:34,410
1 riga inserita in 0.02 secondi. Vorrei ora fare clic su Sfoglia.

622
00:36:34,410 --> 00:36:42,020
>> Notate se fare clic su Sfoglia, c'è Mather, il cui ID è dall'automazione il numero 1.

623
00:36:42,020 --> 00:36:45,000
Fammi fare un altro. Lasciami andare nella scheda SQL.

624
00:36:45,000 --> 00:36:52,950
INSERT INTO case. Il nome della casa avrà un valore di Pfoho e così via.

625
00:36:52,950 --> 00:36:56,350
Vai. E posso continuare a fare questo ancora e ancora e ancora.

626
00:36:56,350 --> 00:36:59,470
Oppure, se ti annoi con phpMyAdmin, si può semplicemente utilizzare la scheda Inserisci

627
00:36:59,470 --> 00:37:01,000
e non è necessario digitare il codice SQL grezzo.

628
00:37:01,000 --> 00:37:04,690
Si può semplicemente sbattere fuori più rapidamente digitando, ad esempio, Currier, Invio,

629
00:37:04,690 --> 00:37:07,610
e ora se noi fare clic su Sfoglia, c'è Currier con ID 3.

630
00:37:07,610 --> 00:37:09,920
Quindi questo è ciò che intendiamo per incremento automatico.

631
00:37:09,920 --> 00:37:12,280
Ma ora dobbiamo aggiustare qualcosa negli studenti.

632
00:37:12,280 --> 00:37:16,240
In studenti quale dovrebbe essere il tipo di dati del campo di casa ora?

633
00:37:16,240 --> 00:37:19,450
Dovrebbe essere un int, giusto?

634
00:37:19,450 --> 00:37:23,950
Quindi l'obiettivo è quello di scomporre, altrimenti noto come normalizzare, le tabelle

635
00:37:23,950 --> 00:37:27,940
in modo da non memorizzare informazioni in modo ridondante in nessuna delle mie tabelle.

636
00:37:27,940 --> 00:37:31,130
E ancora, il percorso eravamo qui sta per dire Mather, Mather,

637
00:37:31,130 --> 00:37:34,220
Mather, Mather, Pfoho, Pfoho, Pfoho, Pfoho, che è molto ridondante

638
00:37:34,220 --> 00:37:36,240
in termini di spreco dei caratteri.

639
00:37:36,240 --> 00:37:40,820
Permettetemi quindi di andare avanti e modificare questa Struttura clic,

640
00:37:40,820 --> 00:37:44,620
e lasciami andare avanti e controllare fuori dal campo casa, fare clic su Cambia,

641
00:37:44,620 --> 00:37:46,990
e ora ho intenzione di cambiare questo è un int.

642
00:37:46,990 --> 00:37:49,490
255 non è più rilevante.

643
00:37:49,490 --> 00:37:54,010
Lasciatemi andare avanti e dire che va bene se è ancora NULL. Salva.

644
00:37:54,010 --> 00:37:55,870
Ora gli studenti della tabella è stata modificata con successo,

645
00:37:55,870 --> 00:37:59,090
e notare ancora una volta casa è un int.

646
00:37:59,090 --> 00:38:02,220
Per inciso, ignorare il numero in parentesi che quando si tratta di interi.

647
00:38:02,220 --> 00:38:03,770
>> Questo è per motivi di eredità.

648
00:38:03,770 --> 00:38:06,920
Indietro nel giorno in cui non aveva GUI, è invece avuto un ambiente a riga di comando,

649
00:38:06,920 --> 00:38:11,580
le 10 e 11, rispettivamente, il numero di caratteri di cui si dovrebbe mostrare

650
00:38:11,580 --> 00:38:13,950
nella finestra di terminale nel visualizzare campi.

651
00:38:13,950 --> 00:38:19,150
Non ha nulla a che fare con la lunghezza in bit del campo vero e proprio, quindi ci basta ignorare che per il momento.

652
00:38:19,150 --> 00:38:20,990
Ora devo andare in questa tabella.

653
00:38:20,990 --> 00:38:24,610
E se David vive in Mather, casa non dovrebbe essere 0,

654
00:38:24,610 --> 00:38:27,350
che è un valore int predefinito più vicino a NULL.

655
00:38:27,350 --> 00:38:29,810
Egli deve vivere in casa 1.

656
00:38:29,810 --> 00:38:36,870
Facciamo arbitrariamente dire che vive in Pfoho Mike, così il numero civico 2.

657
00:38:36,870 --> 00:38:40,160
Ora la mia tabella è un po 'più criptico.

658
00:38:40,160 --> 00:38:41,960
Ma considerare l'efficienza.

659
00:38:41,960 --> 00:38:44,860
Ora sto utilizzando solo 32 bit per identificare la casa,

660
00:38:44,860 --> 00:38:49,530
il che significa che c'è solo 1 definizione canonica di casa mia Mather e Pfoho

661
00:38:49,530 --> 00:38:52,090
e questo è nella tabella case.

662
00:38:52,090 --> 00:38:55,880
Quindi, se voglio rientrare adesso queste tabelle, pensare in questo modo.

663
00:38:55,880 --> 00:39:01,980
Qui ho il mio tavolo studenti, e sul lato destro ci sono questi numeri, 1 e 2.

664
00:39:01,980 --> 00:39:04,180
1 è Mather, 2 è Pfoho.

665
00:39:04,180 --> 00:39:08,580
Abbiamo gli stessi numeri nella tabella altro, che si chiama case,

666
00:39:08,580 --> 00:39:11,020
1 e 2 e 3 per le 3 case.

667
00:39:11,020 --> 00:39:14,990
Ciò che ora vogliamo fare è avere la capacità nel codice, PHP e SQL,

668
00:39:14,990 --> 00:39:18,800
per ordinare di raggiungere queste tabelle, in cui, se questi sono gli studenti e queste sono le case,

669
00:39:18,800 --> 00:39:22,050
vogliamo in qualche modo unire in modo che 1 linea con 1,

670
00:39:22,050 --> 00:39:25,670
2 linee fino a 2, e in modo che siamo in grado di capire dove David

671
00:39:25,670 --> 00:39:28,000
e dove Mike e tutti gli altri in cui vive.

672
00:39:28,000 --> 00:39:31,850
Per fare questo si può eseguire una query SQL simile alla seguente.

673
00:39:31,850 --> 00:39:40,470
SELECT * FROM studenti JOIN case ON -

674
00:39:40,470 --> 00:39:43,000
E ora quali campi vogliamo entrare in?

675
00:39:43,000 --> 00:39:49,520
Così students.house = houses.id.

676
00:39:49,520 --> 00:39:54,150
>> Un po 'criptico, ma questa parte significa, letteralmente, creare una nuova tabella temporanea

677
00:39:54,150 --> 00:39:56,690
questo è il risultato di unire studenti e case.

678
00:39:56,690 --> 00:40:00,340
E come si desidera combinare la punta delle dita qui?

679
00:40:00,340 --> 00:40:05,280
Impostare "campo casa uguale alle case 'campo ID degli studenti.

680
00:40:05,280 --> 00:40:10,220
E se ora fare clic su Vai, torno esattamente quello che speravo di.

681
00:40:10,220 --> 00:40:15,890
David è a Mather, Mike è in Pfoho, e vedo anche gli identificatori univoci.

682
00:40:15,890 --> 00:40:18,640
Ma il punto è ora ho una tabella completa.

683
00:40:18,640 --> 00:40:23,020
E così la asporto qui per pset 7 o proprio per il progetto definitivo:

684
00:40:23,020 --> 00:40:25,830
Se si scopre che sei memorizzare qualsiasi informazione ridondante,

685
00:40:25,830 --> 00:40:28,850
che si tratti di una casa, forse è una città, stato e CAP

686
00:40:28,850 --> 00:40:32,050
dove ZIP può solitamente, ma non sempre essere usato come un identificatore unico,

687
00:40:32,050 --> 00:40:35,810
andare attraverso l'esercizio mentale e poi con qualcosa di simile a phpMyAdmin

688
00:40:35,810 --> 00:40:40,660
di factoring che i dati comuni, perché tanto più che il tuo sito web si fa più ben utilizzato

689
00:40:40,660 --> 00:40:45,440
più popolare, questo è il modo per fare in modo che tutto ciò che è super veloce,

690
00:40:45,440 --> 00:40:51,930
dando il database come molti suggerimenti per quanto riguarda l'unicità possibile.

691
00:40:51,930 --> 00:40:53,860
E 'stato molto.

692
00:40:53,860 --> 00:40:59,010
Hai ancora domande? Bene. Facciamo una pausa di 5 minuti lì e riorganizzarsi.

693
00:41:01,600 --> 00:41:03,540
Bene.

694
00:41:03,540 --> 00:41:08,680
Il seguente è un esempio che è stato usato qualche anno fa, quando ho preso CS161,

695
00:41:08,680 --> 00:41:10,960
che è la classe di sistemi operativi al college

696
00:41:10,960 --> 00:41:15,160
che è noto per essere incredibile, ma una quantità pazzesca di lavoro,

697
00:41:15,160 --> 00:41:19,810
e si concentra in realtà su alcuni dei problemi di basso livello che si presentano nei sistemi operativi

698
00:41:19,810 --> 00:41:22,700
e inoltre anche nel mondo dei database.

699
00:41:22,700 --> 00:41:27,040
>> La storia che è stata raccontata dal mio professore, Margo Seltzer, che è stato il seguente.

700
00:41:27,040 --> 00:41:30,990
Si supponga di avere un piccolo frigorifero dormitorio per voi e il vostro compagno di stanza

701
00:41:30,990 --> 00:41:34,030
e tutti e due piace molto il latte.

702
00:41:34,030 --> 00:41:36,360
Così si arriva a casa dalla classe un giorno, il tuo compagno di stanza non è ancora lì,

703
00:41:36,360 --> 00:41:39,650
si apre il frigo, e ti rendi conto, "Oh accidenti, abbiamo finito il latte."

704
00:41:39,650 --> 00:41:42,070
Così si chiude il frigo, si cammina lungo la strada di CVS

705
00:41:42,070 --> 00:41:45,830
e ottenere nelle linee sempre più lunghi per comprare un po 'di latte a CVS.

706
00:41:45,830 --> 00:41:48,470
Nel frattempo, il tuo compagno di stanza torna a casa dalla sua classe,

707
00:41:48,470 --> 00:41:51,690
entra nella stanza, apre il frigo veramente voglia un po 'di latte,

708
00:41:51,690 --> 00:41:54,130
apre il frigo e, "Accidenti, senza latte."

709
00:41:54,130 --> 00:41:57,890
Così lui o lei chiude il frigo, esce dalla porta, e va a ABP

710
00:41:57,890 --> 00:42:00,910
o da qualche altro di CVS in cui non stai andando a sbattere contro l'altro

711
00:42:00,910 --> 00:42:02,790
di andare a prendere un po 'di latte.

712
00:42:02,790 --> 00:42:04,820
Naturalmente, pochi minuti dopo, entrambi si torna a casa

713
00:42:04,820 --> 00:42:07,740
e ora avete il latte il doppio di quanto effettivamente voluto.

714
00:42:07,740 --> 00:42:10,670
Ed essendo il latte, ora che sta per andare a male perché ti piace il latte

715
00:42:10,670 --> 00:42:14,200
ma non mi piace molto il latte, così ora avete troppo latte, in modo che sta per inacidire.

716
00:42:14,200 --> 00:42:16,830
Si tratta di una terribile, terribile situazione.

717
00:42:16,830 --> 00:42:22,920
Che cosa avrebbe potuto risolvere questa situazione se fossi il compagno di stanza a casa prima? Sì.

718
00:42:22,920 --> 00:42:25,970
[Studente] Si dovrebbe aver lasciato un biglietto. [Risate]

719
00:42:25,970 --> 00:42:28,090
Bene. Si dovrebbe aver lasciato un biglietto.

720
00:42:28,090 --> 00:42:32,320
Avresti dovuto mettere un post-it o come dire, "andato per il latte"

721
00:42:32,320 --> 00:42:36,830
e poi il tuo compagno di stanza concettualmente sarebbe stato bloccato effettivamente farlo.

722
00:42:36,830 --> 00:42:38,010
Oppure si potrebbe andare 1 ulteriore passo in avanti.

723
00:42:38,010 --> 00:42:41,060
Si potrebbe letteralmente bloccare il frigorifero con un qualche tipo di lucchetto,

724
00:42:41,060 --> 00:42:44,870
e ora il tuo compagno di stanza sarà letteralmente bloccato fuori dal frigorifero.

725
00:42:44,870 --> 00:42:48,520
Se generalizziamo tornare alla programmazione,

726
00:42:48,520 --> 00:42:51,610
si può quasi pensare al frigorifero come una sorta di variabile o di una struttura,

727
00:42:51,610 --> 00:42:53,500
una sorta di contenitore per informazioni.

728
00:42:53,500 --> 00:42:58,290
Il problema fondamentale è che tutti e due sono stati autorizzati a ispezionare

729
00:42:58,290 --> 00:43:02,370
o leggere lo stato della struttura di dati,

730
00:43:02,370 --> 00:43:08,050
ma l'hai visto in momenti diversi, eppure entrambi preso una decisione

731
00:43:08,050 --> 00:43:11,920
in base allo stato del mondo in quei momenti diversi.

732
00:43:11,920 --> 00:43:15,570
Così aveva bloccato il frigorifero, si sarebbe almeno evitato il tuo compagno di stanza

733
00:43:15,570 --> 00:43:19,070
da aver potuto ispezionare lo stato del mondo,

734
00:43:19,070 --> 00:43:22,530
così lui o lei non avrebbe potuto fare la stessa decisione.

735
00:43:22,530 --> 00:43:25,780
Così i database, a quanto pare, hanno questo problema costantemente.

736
00:43:25,780 --> 00:43:31,050
>> Vediamo se siamo in grado di costruire uno scenario.

737
00:43:31,050 --> 00:43:34,310
Supponiamo che sei una sorta di cattivo ragazzo e si va a Bank of America

738
00:43:34,310 --> 00:43:37,950
o uno degli altri posti in piazza che hanno un lato paio bancomat a fianco,

739
00:43:37,950 --> 00:43:41,200
e in qualche modo capito come duplicare una carta bancomat - non è poi così difficile.

740
00:43:41,200 --> 00:43:42,730
E 'solo una banda magnetica.

741
00:43:42,730 --> 00:43:45,180
E così quello che si vuole provare a fare è giocare a questo gioco

742
00:43:45,180 --> 00:43:49,060
in base al quale si mette 1 carta in 1 macchina, un'altra carta nella macchina altra,

743
00:43:49,060 --> 00:43:51,980
e in sostanza vuole provare a ritirare i soldi allo stesso tempo,

744
00:43:51,980 --> 00:43:54,930
perché immagino che la storia è la seguente.

745
00:43:54,930 --> 00:43:57,350
La macchina sulla sinistra prende la vostra carta e il vostro PIN,

746
00:43:57,350 --> 00:44:00,240
e poi dici: "Dammi 100 dollari."

747
00:44:00,240 --> 00:44:04,790
Lo sportello automatico è programmato per fare prima una selezione nella sua banca dati o equivalente -

748
00:44:04,790 --> 00:44:10,780
qualsiasi database che sta utilizzando - per vedere l'utente non dispone di almeno 100 dollari nel suo conto?

749
00:44:10,780 --> 00:44:16,180
Se è così, poi sputare fuori i $ 100 e $ 100 da sottrarre il loro equilibrio.

750
00:44:16,180 --> 00:44:20,470
Ma, naturalmente, se ci sono più macchine qui o diversi modi di controllo di

751
00:44:20,470 --> 00:44:23,560
lo stato di quel mondo, il caveau di una banca, per vedere quanti soldi hai,

752
00:44:23,560 --> 00:44:26,780
supponiamo che solo per caso la macchina a sinistra e destra

753
00:44:26,780 --> 00:44:30,140
sia questa domanda più o meno allo stesso momento nel tempo.

754
00:44:30,140 --> 00:44:34,160
>> E questo può certamente accadere. I bancomat sono computer in questi giorni.

755
00:44:34,160 --> 00:44:37,670
Quindi, se la macchina a sinistra dice: "Sì, hai almeno $ 100,"

756
00:44:37,670 --> 00:44:42,150
nel frattempo la macchina a destra dice: "Sì, hai almeno $ 100,"

757
00:44:42,150 --> 00:44:47,420
poi entrambi procedere per terminare i loro programmi ed effettivamente sputare i $ 100

758
00:44:47,420 --> 00:44:50,820
e dire: "In precedenza si era $ 200."

759
00:44:50,820 --> 00:44:54,890
"Lasciatemi aggiornare la variabile da 100 dollari ora lasciato nel conto."

760
00:44:54,890 --> 00:44:58,780
Ma se entrambi hanno verificato il saldo del conto e scoperto che è $ 200

761
00:44:58,780 --> 00:45:02,000
ed entrambi poi fare i conti e diciamo 200 - 100,

762
00:45:02,000 --> 00:45:06,990
le macchine sono potenzialmente sputare fuori due biglietti da 100 dollari a ogni macchina,

763
00:45:06,990 --> 00:45:11,360
ma hanno aggiornato solo il saldo del conto somma da $ 100.

764
00:45:11,360 --> 00:45:15,130
In altre parole, hai preso fuori $ 200, ma perché ispezionato lo stato del mondo

765
00:45:15,130 --> 00:45:18,840
contemporaneamente e poi preso una decisione sulla base di tale valore,

766
00:45:18,840 --> 00:45:21,930
esse non possono fare i conti alla fine correttamente.

767
00:45:21,930 --> 00:45:25,520
Quindi, in una situazione di banca troppo si vuole veramente avere un qualche tipo di blocco

768
00:45:25,520 --> 00:45:28,450
in modo che, non appena si è verificato lo stato di una variabile

769
00:45:28,450 --> 00:45:31,220
questo è molto importante, come il saldo del conto,

770
00:45:31,220 --> 00:45:36,070
non permettere a nessuno di prendere decisioni sulla base di tale finché non si è finito di fare la vostra cosa,

771
00:45:36,070 --> 00:45:38,920
dove in questo caso sono il bancomat a sinistra.

772
00:45:38,920 --> 00:45:41,160
Bloccare tutti gli altri fuori.

773
00:45:41,160 --> 00:45:44,650
Si può effettivamente ottenere questo effetto in un paio di modi diversi.

774
00:45:44,650 --> 00:45:48,660
>> Il modo più semplice in MySQL è una linea di SQL che vi abbiamo dato

775
00:45:48,660 --> 00:45:52,030
nella specifica set problema che appare esattamente come questo.

776
00:45:52,030 --> 00:45:57,420
Inserire nella tabella - come si chiama - un id, un simbolo, e una quota, un numero di azioni,

777
00:45:57,420 --> 00:45:59,660
i seguenti valori, per esempio.

778
00:45:59,660 --> 00:46:03,370
Se non avete letto la specifica ancora, questo è un esempio che coinvolge come si fa a fare

779
00:46:03,370 --> 00:46:07,340
l'acquisto di 10 azioni di questo penny stock per il presidente Skroob,

780
00:46:07,340 --> 00:46:10,340
il cui ID utente sembra essere il numero 7?

781
00:46:10,340 --> 00:46:14,070
Questo dice INSERT INTO tabella il seguente ID, simbolo e numero di azioni

782
00:46:14,070 --> 00:46:18,200
del 7, 'DVN.V', e 10.

783
00:46:18,200 --> 00:46:21,510
Ma - ma, ma, ma - la seconda è l'importante.

784
00:46:21,510 --> 00:46:26,310
ON DUPLICATE parti UPDATE CHIAVE = azioni + VALUES (azioni).

785
00:46:26,310 --> 00:46:28,350
Così totalmente criptico-guardando a prima vista.

786
00:46:28,350 --> 00:46:31,990
Ma il fatto che questa query SQL, anche se si avvolge su due linee,

787
00:46:31,990 --> 00:46:35,920
è 1 query lungo, significa che è atomica

788
00:46:35,920 --> 00:46:41,000
nel senso che questa ricerca potrà essere eseguito tutti insieme o per niente.

789
00:46:41,000 --> 00:46:45,100
E per definizione di MySQL, è così che hanno implementato questa query.

790
00:46:45,100 --> 00:46:51,010
È per definizione nel manuale sempre eseguito tutto in una volta o per niente.

791
00:46:51,010 --> 00:46:54,020
La ragione per questo è come segue.

792
00:46:54,020 --> 00:46:58,540
Se in questo caso si sta cercando di acquistare 10 quote di azioni,

793
00:46:58,540 --> 00:47:02,260
è una specie di storia come il latte, è una specie di storia come il bancomat.

794
00:47:02,260 --> 00:47:04,970
>> Se non fate l'errore di usare questa sintassi

795
00:47:04,970 --> 00:47:09,610
ma invece la selezione dal database per vedere quante azioni di questo penny stock

796
00:47:09,610 --> 00:47:13,750
secondo il presidente Skroob hanno, e supponiamo che ha 10 azioni,

797
00:47:13,750 --> 00:47:19,330
e poi qualche frazione di secondo dopo si quindi eseguire un'istruzione UPDATE,

798
00:47:19,330 --> 00:47:24,810
che è un altro in SQL che dice che andare avanti e aggiungere 10 azioni più

799
00:47:24,810 --> 00:47:28,700
a sua corrente 10 in modo che idealmente il totale è 20,

800
00:47:28,700 --> 00:47:33,490
il problema è che in sistemi di database di oggi e perché nei computer di oggi

801
00:47:33,490 --> 00:47:35,990
si dispone di più processori, core multipli -

802
00:47:35,990 --> 00:47:38,920
in altre parole, i computer possono essere letteralmente fare le cose in una sola volta -

803
00:47:38,920 --> 00:47:44,270
non c'è alcuna garanzia che la SELECT e l'aggiornamento, in questo caso

804
00:47:44,270 --> 00:47:46,150
stanno per accadere back to back.

805
00:47:46,150 --> 00:47:49,140
Quindi uno scenario brutto sarebbe fare il tasto SELECT

806
00:47:49,140 --> 00:47:51,670
per vedere quante azioni di questo penny stock ha Skroob ha,

807
00:47:51,670 --> 00:47:54,710
e poi solo per caso un altro query di database viene eseguita -

808
00:47:54,710 --> 00:47:57,740
forse il suo Skroob in un'altra finestra del browser cercando di acquistare 10 parti

809
00:47:57,740 --> 00:48:00,700
in un'altra finestra del tutto, proprio come l 'ATM -

810
00:48:00,700 --> 00:48:05,410
e supponiamo che un altro query ottiene tra SELECT e UPDATE.

811
00:48:05,410 --> 00:48:10,210
Potrebbe essere il caso che Skroob perde ora un certo numero di azioni

812
00:48:10,210 --> 00:48:14,340
perché un altro processo sta ispezionando lo stato del suo mondo,

813
00:48:14,340 --> 00:48:17,800
o ottiene più azioni di lui dovrebbe avere.

814
00:48:17,800 --> 00:48:23,250
Non entreremo nei particolari di ciò che esattamente quelle linee storia particolare sarebbe,

815
00:48:23,250 --> 00:48:28,380
ma il punto è se si controlla un valore di variabili e poi prendere una decisione,

816
00:48:28,380 --> 00:48:32,500
se c'è un rischio di qualcun altro a fare qualcosa a metà tra questi 2 affermazioni,

817
00:48:32,500 --> 00:48:36,220
come può accadere nei sistemi multiprocessore, in sistemi multicore,

818
00:48:36,220 --> 00:48:41,220
computer con la capacità di fare più cose in una volta, le cose brutte possono accadere

819
00:48:41,220 --> 00:48:44,530
conti bancari come essere addebitato in modo non corretto, l'acquisto di latte due volte tanto,

820
00:48:44,530 --> 00:48:46,730
o in questo caso il numero errato di parti.

821
00:48:46,730 --> 00:48:48,370
Ma c'è un modo più semplice di pensare a questo.

822
00:48:48,370 --> 00:48:53,290
>> Si scopre che supporta anche SQL, se si configura la tabella correttamente,

823
00:48:53,290 --> 00:48:56,920
qualcosa chiamato operazioni, che a mio avviso è in realtà ancora più facile da capire

824
00:48:56,920 --> 00:49:00,650
di questo, ma non è un 1-liner, quindi è in realtà un po 'più complesso.

825
00:49:00,650 --> 00:49:04,960
Vi è letteralmente una dichiarazione in SQL chiamato START TRANSACTION.

826
00:49:04,960 --> 00:49:08,300
Proprio come se ci fosse SELECT, UPDATE, INSERT, DELETE e JOIN e un sacco di altri,

827
00:49:08,300 --> 00:49:10,970
non ci sono parole chiave come START TRANSACTION.

828
00:49:10,970 --> 00:49:13,560
E quello che poi fare nel contesto di pset 7 -

829
00:49:13,560 --> 00:49:17,270
non c'è bisogno di fare questo per pset 7, è esplicitamente smentito come non è necessario,

830
00:49:17,270 --> 00:49:18,830
ma per i progetti finali può essere utile -

831
00:49:18,830 --> 00:49:22,820
se si chiama una query di START TRANSACTION e poi un'altra query

832
00:49:22,820 --> 00:49:25,620
e poi un'altra domanda e poi un altro, un altro, e un altro,

833
00:49:25,620 --> 00:49:31,860
tali query non verrà effettivamente eseguito finché non viene chiamato l'istruzione SQL COMMIT,

834
00:49:31,860 --> 00:49:37,220
a quel punto, che si tratti di due dichiarazioni o 20 dichiarazioni, saranno tutti eseguiti in una sola volta,

835
00:49:37,220 --> 00:49:42,770
il che significa che nessun altro può comprare accidentalmente troppo latte o di debito troppi soldi

836
00:49:42,770 --> 00:49:46,340
o acquistare azioni troppi perché tutte le vostre domande verrà eseguito

837
00:49:46,340 --> 00:49:48,410
back to back to back to back.

838
00:49:48,410 --> 00:49:51,580
E questo è super importante, soprattutto quando si sta facendo qualcosa di simile.

839
00:49:51,580 --> 00:49:54,900
Questo è un esempio arbitrario che dice andiamo aggiornare il conto in banca

840
00:49:54,900 --> 00:50:00,200
impostando un saldo pari a saldo - $ 1000 in cui il numero di conto è 2.

841
00:50:00,200 --> 00:50:04,260
E poi la seconda istruzione è ora che andiamo a depositare 1.000 dollari

842
00:50:04,260 --> 00:50:07,310
in qualcun altro conto bancario il cui numero di conto corrente è pari a 1.

843
00:50:07,310 --> 00:50:10,400
>> In altre parole, questo è un perfetto esempio di dove si vuole fare in modo

844
00:50:10,400 --> 00:50:13,590
che entrambe queste affermazioni accadere o per niente

845
00:50:13,590 --> 00:50:15,450
perché altrimenti il ​​cliente sta per farsi sfondare

846
00:50:15,450 --> 00:50:17,670
e si sta andando a prendere i loro soldi e non lo depositano altrove,

847
00:50:17,670 --> 00:50:20,470
o la banca sta per farsi sfondare dove si sta andando a depositare il denaro

848
00:50:20,470 --> 00:50:23,140
ma in realtà non è sottrarre dal conto dell'utente.

849
00:50:23,140 --> 00:50:25,810
Così si vuole tutti e due per eseguire insieme.

850
00:50:25,810 --> 00:50:29,140
Entra così nelle transazioni mondiali.

851
00:50:29,140 --> 00:50:31,360
Ecco, questo è qualcosa da tenere nella parte posteriore della vostra mente,

852
00:50:31,360 --> 00:50:34,710
non tanto ai fini di un semplice progetto definitivo,

853
00:50:34,710 --> 00:50:36,700
ma se si vuole prendere il progetto finale da qualche parte,

854
00:50:36,700 --> 00:50:39,040
se si desidera avviare un po 'di compagnia intorno ad esso,

855
00:50:39,040 --> 00:50:41,270
se si vuole risolvere il problema di qualche gruppo degli studenti del campus

856
00:50:41,270 --> 00:50:45,210
e in realtà hanno un live, sito attivo, questi sono il tipo di bug sottili che possono sorgere

857
00:50:45,210 --> 00:50:49,480
se non riesco a riflettere su quello che può succedere se 2 persone

858
00:50:49,480 --> 00:50:54,190
stanno cercando di accedere al tuo sito web letteralmente nello stesso momento nel tempo,

859
00:50:54,190 --> 00:50:56,890
con cui le loro domande altrimenti si intrecciano.

860
00:50:58,840 --> 00:51:01,420
>> Pronti per un po 'di JavaScript, un teaser della stessa?

861
00:51:01,420 --> 00:51:04,320
Questo è il nostro linguaggio ultimo per il semestre. Bene.

862
00:51:04,320 --> 00:51:09,940
Per fortuna, JavaScript sembra molto, molto, molto simile alle 2 lingue, C e PHP,

863
00:51:09,940 --> 00:51:11,140
che abbiamo fatto finora.

864
00:51:11,140 --> 00:51:14,340
Non c'è JavaScript pset 7, ma è uno strumento incredibilmente utile

865
00:51:14,340 --> 00:51:18,840
quando si tratta di fare progetti finali basati sul web o in realtà solo di programmazione web più in generale.

866
00:51:18,840 --> 00:51:20,950
Quindi una rapida panoramica di una cosa chiamata DOM.

867
00:51:20,950 --> 00:51:23,600
Ecco una pagina web super-semplice che in realtà dice solo ciao, mondo

868
00:51:23,600 --> 00:51:25,970
sia nel titolo e nel corpo.

869
00:51:25,970 --> 00:51:29,270
Come il rientro è stato suggerendo da tempo,

870
00:51:29,270 --> 00:51:31,380
vi è infatti una gerarchia di pagine web.

871
00:51:31,380 --> 00:51:34,220
Potrei disegnare questo frammento di codice HTML stesso come un albero,

872
00:51:34,220 --> 00:51:37,470
ripensando alle nostre discussioni di strutture dati in C, come segue.

873
00:51:37,470 --> 00:51:40,710
Ho un nodo speciale chiamato radice il nodo di documento,

874
00:51:40,710 --> 00:51:43,650
e vedremo l'analogo di questo in JavaScript in un attimo.

875
00:51:43,650 --> 00:51:48,330
Il bambino prima e unica figlia di che in questo caso è il tag HTML.

876
00:51:48,330 --> 00:51:49,880
Non c'è alcun mapping diretto del doctype.

877
00:51:49,880 --> 00:51:53,170
Questa è una cosa speciale, quindi dovremmo semplicemente ignorare quando si tratta di questo DOM,

878
00:51:53,170 --> 00:51:55,810
questo Document Object albero modello.

879
00:51:55,810 --> 00:51:59,530
Si noti che il tag HTML, che ho arbitrariamente raffigurato come un rettangolo,

880
00:51:59,530 --> 00:52:02,890
ha 2 figli: la testa e il corpo.

881
00:52:02,890 --> 00:52:04,840
>> Coloro che sono ugualmente rappresentati come rettangoli.

882
00:52:04,840 --> 00:52:08,970
È significativo che pittoricamente testa è a sinistra del corpo.

883
00:52:08,970 --> 00:52:11,960
L'implicazione è che la testa viene prima nella struttura.

884
00:52:11,960 --> 00:52:14,910
Quindi c'è in realtà un ordine di un albero quando si disegna in questo modo,

885
00:52:14,910 --> 00:52:17,460
anche se le forme e quant'altro sono arbitrari.

886
00:52:17,460 --> 00:52:20,360
Testa nel frattempo ha un solo figlio chiamato titolo,

887
00:52:20,360 --> 00:52:25,170
e il titolo è in realtà il suo proprio figlio, che è "ciao, mondo",

888
00:52:25,170 --> 00:52:32,210
che ho volutamente disegnato come un ovale qui per renderlo leggermente diverso dal rettangolo.

889
00:52:32,210 --> 00:52:37,420
Questi rettangoli sono elementi, mentre ciao, mondo è davvero un nodo di testo.

890
00:52:37,420 --> 00:52:39,850
Quindi è un nodo nella struttura, ma è un diverso tipo di nodo

891
00:52:39,850 --> 00:52:41,730
così l'ho disegnato arbitrariamente in modo diverso.

892
00:52:41,730 --> 00:52:45,000
Allo stesso modo ha corpo hanno un figlio di nome ciao, mondo, così,

893
00:52:45,000 --> 00:52:47,910
nodo in modo diverso anche se sono per coincidenza lo stesso testo,

894
00:52:47,910 --> 00:52:52,100
ma l'ho disegnato con la stessa forma. Quindi, chi se ne frega?

895
00:52:52,100 --> 00:52:56,820
Beh, cosa c'è di bello di HTML è che ha questa natura gerarchica.

896
00:52:56,820 --> 00:53:01,010
E che cosa è bella di Javascript e in particolare le librerie che sono liberamente disponibili

897
00:53:01,010 --> 00:53:07,120
e popolare come jQuery, è possibile navigare nella struttura ad albero in modo incredibilmente facile.

898
00:53:07,120 --> 00:53:11,790
Una qualsiasi delle cose che abbiamo fatto in C con puntatori e alberi di movimento e recursing sui nodi

899
00:53:11,790 --> 00:53:15,300
figlio sinistro al figlio destro, tutto ad un tratto si può ordinare di dare per scontato

900
00:53:15,300 --> 00:53:19,450
come incredibilmente illuminante, se non un po 'frustrante

901
00:53:19,450 --> 00:53:22,470
ma non così un modo efficiente per andare sulla programmazione.

902
00:53:22,470 --> 00:53:24,470
E così con questi linguaggi di livello superiore come JavaScript

903
00:53:24,470 --> 00:53:28,340
saremo in grado di navigare questo albero molto più intuitivo.

904
00:53:28,340 --> 00:53:30,430
>> E in effetti la sintassi sarà molto familiare.

905
00:53:30,430 --> 00:53:32,950
Se non hai mai visto prima di JavaScript, questo è un punto di riferimento davvero bella

906
00:53:32,950 --> 00:53:35,910
dalla gente di Mozilla, le persone che fanno di Firefox,

907
00:53:35,910 --> 00:53:38,370
così si sentono liberi di navigare che a vostro piacimento.

908
00:53:38,370 --> 00:53:41,590
Ciò che troverete - e queste slide sono identici a quello che abbiamo usato l'altro giorno -

909
00:53:41,590 --> 00:53:44,030
analogamente, principale è andato.

910
00:53:44,030 --> 00:53:47,010
Così, quando si scrive un programma in JavaScript, non esiste una funzione principale.

911
00:53:47,010 --> 00:53:48,690
Basta iniziare a scrivere codice.

912
00:53:48,690 --> 00:53:51,660
Ma una distinzione fondamentale tra JavaScript e C e PHP

913
00:53:51,660 --> 00:53:55,890
è che, mentre C e PHP finora sono stati eseguiti lato server

914
00:53:55,890 --> 00:53:59,180
dall'apparecchio in questo caso, o più in generale da un server,

915
00:53:59,180 --> 00:54:04,270
JavaScript by design è di solito eseguita da un browser.

916
00:54:04,270 --> 00:54:08,440
In altre parole, è possibile scrivere il codice JavaScript, come stiamo per,

917
00:54:08,440 --> 00:54:13,080
su un server all'interno dell'apparecchio, ma si include nel tuo HTML, tra i vostri CSS,

918
00:54:13,080 --> 00:54:16,100
tra i vostri e le vostre GIF PNG e le vostre JPEG

919
00:54:16,100 --> 00:54:19,170
in modo che quando l'utente visita il tuo sito web, se si sta utilizzando JavaScript,

920
00:54:19,170 --> 00:54:21,770
che il codice JavaScript viene dal server al browser,

921
00:54:21,770 --> 00:54:24,540
ed è il browser che esegue effettivamente.

922
00:54:24,540 --> 00:54:27,960
Quindi questo ha implicazioni significative per la proprietà, anche intellettuale.

923
00:54:27,960 --> 00:54:32,600
È un po 'sciocco da pensare a proteggere il tuo IP quando si tratta di codice JavaScript

924
00:54:32,600 --> 00:54:37,560
perché per natura del linguaggio che viene eseguito di solito lato browser.

925
00:54:37,560 --> 00:54:40,360
>> Si può offuscare, il che significa che è possibile farlo sembrare pazzo e brutto

926
00:54:40,360 --> 00:54:45,400
senza spazi, orribili i nomi delle variabili, per rendere più difficile per le persone a rubare il vostro IP,

927
00:54:45,400 --> 00:54:48,120
ma la chiave è che viene eseguito lato browser.

928
00:54:48,120 --> 00:54:51,790
Anche se come lato server riposo JavaScript può essere utilizzato,

929
00:54:51,790 --> 00:54:54,480
il caso d'uso più comune in questo momento è ancora sul browser.

930
00:54:54,480 --> 00:54:59,800
Ed ecco quello che sembra. Ecco un if-else if-else, proprio come C, proprio come PHP.

931
00:54:59,800 --> 00:55:02,420
Ecco un'espressione booleana quando si "o" 2 cose insieme.

932
00:55:02,420 --> 00:55:04,330
Qui è quando si "e" 2 cose insieme.

933
00:55:04,330 --> 00:55:08,300
Ecco una istruzione switch, che è simile a PHP

934
00:55:08,300 --> 00:55:10,810
in quanto è possibile attivare diversi tipi di valori.

935
00:55:10,810 --> 00:55:15,180
Loops analogamente hanno per cicli qui, che sono strutturati in modo identico a quello che abbiamo visto prima.

936
00:55:15,180 --> 00:55:18,110
I cicli while, dobbiamo fare i cicli while.

937
00:55:18,110 --> 00:55:20,290
Variabili, sempre in modo leggermente diverso.

938
00:55:20,290 --> 00:55:24,560
Ti rendi dichiarare le variabili come si fa in PHP e C,

939
00:55:24,560 --> 00:55:27,860
ma allo stesso modo è JavaScript debolmente tipizzato.

940
00:55:27,860 --> 00:55:32,730
Non si specifica int o float o stringa o qualcosa di simile che di solito.

941
00:55:32,730 --> 00:55:34,240
È possibile specificare var.

942
00:55:34,240 --> 00:55:38,040
Non è necessario specificare var, ma ha implicazioni se non lo fai.

943
00:55:38,040 --> 00:55:42,000
Di solito se si omette var, per errore creare una variabile globale, invece di locale.

944
00:55:42,000 --> 00:55:46,420
Quindi lasciate che proponiamo quasi sempre solo dire var e poi il nome della variabile.

945
00:55:46,420 --> 00:55:48,740
Non è un tipo, è solo per la variabile var.

946
00:55:48,740 --> 00:55:52,930
Questo sarebbe un esempio, che si tratti di 123 o "ciao, mondo".

947
00:55:52,930 --> 00:55:58,910
Gli array sono presenti e sintatticamente simile a PHP.

948
00:55:58,910 --> 00:56:03,690
Dirò numeri var e poi utilizzare le parentesi quadre di nuovo per dichiarare una variabile

949
00:56:03,690 --> 00:56:08,870
il cui tipo è di matrice che ha questi numeri particolari in esso separati da virgole.

950
00:56:08,870 --> 00:56:11,740
E quindi, infine, questa è l'unica che sembra davvero diversa.

951
00:56:11,740 --> 00:56:16,700
Ricordiamo che in PHP avremmo implementato un array associativo per uno studente

952
00:56:16,700 --> 00:56:20,220
come Zamyla che potrebbe apparire come questo, in cui la variabile si chiama studente.

953
00:56:20,220 --> 00:56:23,370
Le parentesi quadre significano ecco che arriva un array.

954
00:56:23,370 --> 00:56:28,500
>> Il fatto che io non sto usando indici numerici, ma stringhe - id, la casa, e il nome -

955
00:56:28,500 --> 00:56:30,990
significa che questo è un array associativo,

956
00:56:30,990 --> 00:56:34,490
e queste frecce con il segno di uguale e la staffa angolare

957
00:56:34,490 --> 00:56:37,310
significa che la chiave è "id", il valore è 1;

958
00:56:37,310 --> 00:56:39,310
la chiave è "casa", il valore è Winthrop House;

959
00:56:39,310 --> 00:56:41,800
la chiave è "nome", il valore è Zamyla Chan.

960
00:56:41,800 --> 00:56:47,110
Quindi ci sono 3 tasti all'interno di questo array associativo, ognuno dei quali ha il proprio valore.

961
00:56:47,110 --> 00:56:52,880
Abbiamo visto che in pset 7, o sarà presto, nell'idea stessa di JavaScript,

962
00:56:52,880 --> 00:56:55,220
ma sta andando a guardare come questo.

963
00:56:55,220 --> 00:57:00,070
Studente Così var - nessun segno del dollaro e non si parla di tipo ancora, ma var -

964
00:57:00,070 --> 00:57:05,860
pari e quindi aprire le parentesi graffe, perché in JavaScript quando si hanno coppie di valori chiave,

965
00:57:05,860 --> 00:57:08,900
si utilizzano effettivamente qualcosa chiamato un oggetto.

966
00:57:08,900 --> 00:57:13,490
E quelli di voi che ha preso APCS o simili potrebbe ricordare gli oggetti da Java

967
00:57:13,490 --> 00:57:15,140
o linguaggi simili.

968
00:57:15,140 --> 00:57:17,880
JavaScript non è Java, prima di tutto.

969
00:57:17,880 --> 00:57:21,600
E 'stato un anno deliberata decisione di progettazione fa per staccare qualcos'altro che era popolare,

970
00:57:21,600 --> 00:57:25,640
il suo nome, anche se non ha alcuna relazione fondamentale di Java stesso.

971
00:57:25,640 --> 00:57:31,490
JavaScript ha oggetti, e che siano stati creati per mezzo della notazione parentesi graffa.

972
00:57:31,490 --> 00:57:36,710
Gli oggetti in JavaScript sono più o meno equivalenti a array associativi in ​​PHP

973
00:57:36,710 --> 00:57:40,030
quando si tratta di memorizzazione di dati in essi contenuti.

974
00:57:40,030 --> 00:57:44,100
>> Ma ancor più potentemente in JavaScript si può associare facilmente le funzioni

975
00:57:44,100 --> 00:57:48,040
all'interno di un oggetto, e anche se è possibile farlo in altre lingue,

976
00:57:48,040 --> 00:57:50,040
è piuttosto un paradigma comune, come vedremo.

977
00:57:50,040 --> 00:57:54,380
In breve, questo oggetto rappresenta uno studente, che è particolarmente Zamyla,

978
00:57:54,380 --> 00:58:00,380
ed è simile concettualmente, solo sintatticamente diverso da questo.

979
00:58:00,380 --> 00:58:03,840
Facciamo effettivamente utilizzare JavaScript in un file.

980
00:58:03,840 --> 00:58:05,570
Sembra che vi sia un tag script.

981
00:58:05,570 --> 00:58:08,180
Abbiamo visto un tag di stile e abbiamo visto altri tag HTML.

982
00:58:08,180 --> 00:58:11,510
Il tag script in realtà conterrà un codice JavaScript.

983
00:58:11,510 --> 00:58:15,500
Lasciami andare all'interno dell'apparecchio in cui abbiamo un po 'di codice sorgente pre-fatto.

984
00:58:15,500 --> 00:58:18,700
Non l'ho ancora pubblicato sul sito web, ma lo farò dopo le lezioni.

985
00:58:18,700 --> 00:58:21,770
Apriamo a questo, blink.html.

986
00:58:21,770 --> 00:58:27,560
Torna nel 1990, ci fu letteralmente un tag HTML chiamato il tag lampeggiano,

987
00:58:27,560 --> 00:58:30,340
e questo era uno dei tag più meravigliosamente abusati su Internet

988
00:58:30,340 --> 00:58:36,140
per cui si sarebbe visitare alcune pagine web in stile anni 1990 e iniziare a vedere testo lampeggiante è piaciuto questo,

989
00:58:36,140 --> 00:58:39,810
i risultati del tag marchese, che era in corso il testo come questo.

990
00:58:39,810 --> 00:58:45,070
Una delle poche volte in cui il mondo ha effettivamente concordato uno standard web,

991
00:58:45,070 --> 00:58:48,250
tutti su tutta la linea ucciso il tag batter alcuni anni fa.

992
00:58:48,250 --> 00:58:52,860
Ma siamo in grado di risorgere con JavaScript come una dimostrazione del potere che hai

993
00:58:52,860 --> 00:58:56,660
quando si può scrivere un programma all'interno di una pagina web.

994
00:58:56,660 --> 00:59:00,240
Prima di tutto saltare la roba nuova e concentrarsi solo sul vecchio.

995
00:59:00,240 --> 00:59:01,780
>> Ecco la roba vecchia in questo esempio.

996
00:59:01,780 --> 00:59:06,350
Ho un tag HTML, il tag head, e un tag titolo.

997
00:59:06,350 --> 00:59:11,210
Poi ho un tag body qui con un div, che ricordo è solo una divisione rettangolare della pagina

998
00:59:11,210 --> 00:59:14,720
che ho dato un numero identificativo arbitrariamente di "saluto" a,

999
00:59:14,720 --> 00:59:18,320
così ho un modo univoco di riferimento ad esso, che ha un testo molto semplice:

1000
00:59:18,320 --> 00:59:20,220
ciao, mondo.

1001
00:59:20,220 --> 00:59:23,940
Ora vorrei scorrere fino alla cima di questo file e vedere cosa c'è di nuovo.

1002
00:59:23,940 --> 00:59:27,710
La prima cosa che è rabboccare nuovo è il tag script,

1003
00:59:27,710 --> 00:59:31,280
e all'interno del bando di tag script che ho dichiarato una funzione.

1004
00:59:31,280 --> 00:59:34,610
Per dichiarare una funzione in JavaScript, piuttosto simile a PHP,

1005
00:59:34,610 --> 00:59:37,930
letteralmente scrivere la funzione quindi il nome della funzione, le parentesi,

1006
00:59:37,930 --> 00:59:40,400
e forse alcuni argomenti se ci vuole qualsiasi.

1007
00:59:40,400 --> 00:59:43,510
Poi ho la mia parentesi graffa come al solito, e ora abbiamo un po 'po' di codice nuovo,

1008
00:59:43,510 --> 00:59:45,230
ma vediamo che cosa questo significa.

1009
00:59:45,230 --> 00:59:48,670
Così div var, questo significa solo darmi un div variabile chiamata.

1010
00:59:48,670 --> 00:59:50,530
Avrei potuto chiamato foo, ma volevo tanto da essere chiamato div

1011
00:59:50,530 --> 00:59:52,620
per ragioni che saranno chiare in un secondo.

1012
00:59:52,620 --> 00:59:57,480
Poi si scopre in JavaScript - e questo è il codice JavaScript incorporato nella mia pagina web -

1013
00:59:57,480 --> 01:00:01,760
vi è una variabile globale speciale di sorta chiamati documento.

1014
01:00:01,760 --> 01:00:04,780
JavaScript è infatti un linguaggio orientato agli oggetti.

1015
01:00:04,780 --> 01:00:07,230
Non entreremo nei dettagli in 50 su ciò che significa,

1016
01:00:07,230 --> 01:00:11,180
ma per ora sappiamo che un oggetto è più o meno come una struct.

1017
01:00:11,180 --> 01:00:14,740
Come abbiamo visto lontano quando in uno dei primi problemi imposta

1018
01:00:14,740 --> 01:00:17,150
dove abbiamo messo un sacco di informazioni in una struttura,

1019
01:00:17,150 --> 01:00:21,330
allo stesso modo è documentare una struttura speciale che viene fornito con il browser,

1020
01:00:21,330 --> 01:00:24,810
viene fornito con qualsiasi pagina web. Non è qualcosa che ho creato.

1021
01:00:24,810 --> 01:00:28,210
All'interno di questa struttura del documento, però, è necessario non solo i dati

1022
01:00:28,210 --> 01:00:30,010
ma si hanno anche funzioni.

1023
01:00:30,010 --> 01:00:34,090
>> E ogni volta che si ha una funzione all'interno di una struttura, all'interno di un oggetto,

1024
01:00:34,090 --> 01:00:36,490
si chiama un metodo. Ma è la stessa cosa.

1025
01:00:36,490 --> 01:00:40,110
Un metodo è una funzione che così succede di essere all'interno di qualcosa d'altro.

1026
01:00:40,110 --> 01:00:42,990
Quindi questo significa che la variabile globale speciale chiamato documento

1027
01:00:42,990 --> 01:00:47,690
ha una funzione chiamata getElementById che fa letteralmente quello.

1028
01:00:47,690 --> 01:00:52,460
E ti porterà un elemento dal DOM, Document Object albero modello,

1029
01:00:52,460 --> 01:00:55,520
il cui ID è in questo caso saluto.

1030
01:00:55,520 --> 01:00:59,200
In altre parole, tutto il tempo che abbiamo trascorso su strutture dati entra in gioco qui.

1031
01:00:59,200 --> 01:01:01,400
Questa foto di un DOM che abbiamo avuto un momento fa,

1032
01:01:01,400 --> 01:01:06,100
anche se la pagina è un po 'diverso, se avessi un div in questo quadro,

1033
01:01:06,100 --> 01:01:11,180
cosa document.getElementById sarebbe tornato da me sarebbe effettivamente un puntatore

1034
01:01:11,180 --> 01:01:15,440
al rettangolo nella struttura, un riferimento al rettangolo nella struttura.

1035
01:01:15,440 --> 01:01:18,410
Ecco, questo è ciò che significa chiamare in realtà una di quelle funzioni.

1036
01:01:18,410 --> 01:01:21,960
Anche in questo caso si tratta di un div. Non è un corpo o di un titolo.

1037
01:01:21,960 --> 01:01:26,480
Quindi cerchiamo di vedere quello che poi fare con questo div, ora che ce l'ho all'interno di questo div variabile chiamata.

1038
01:01:26,480 --> 01:01:32,580
Si scopre con JavaScript si ha la possibilità di modificare il CSS della pagina in modo dinamico.

1039
01:01:32,580 --> 01:01:39,060
Fino ad ora, tutto il CSS che abbiamo fatto, per quanto limitato, è in attributi di stile,

1040
01:01:39,060 --> 01:01:41,730
o in quale altro posto abbiamo messo i CSS?

1041
01:01:42,730 --> 01:01:45,810
I tipi di viziato quello. Nel tag stile all'inizio del file.

1042
01:01:45,810 --> 01:01:49,180
O il terzo posto è stato in?

1043
01:01:50,710 --> 01:01:54,590
>> Un file esterno, qualcosa. Css.

1044
01:01:54,590 --> 01:01:56,730
Quindi questi sono i 3 posti che abbiamo fatto finora CSS,

1045
01:01:56,730 --> 01:01:59,310
ma il problema è che abbiamo hardcoded tutto.

1046
01:01:59,310 --> 01:02:04,060
Avete deciso come si tuffò in pset 7, abbiamo deciso prima lezione che il nostro CSS sarebbe.

1047
01:02:04,060 --> 01:02:07,380
Ma se si desidera modificare il CSS, si può effettivamente fare

1048
01:02:07,380 --> 01:02:09,370
una volta che si dispone di un linguaggio vero e proprio di programmazione.

1049
01:02:09,370 --> 01:02:13,910
CSS, HTML - lingue non di programmazione. JavaScript è.

1050
01:02:13,910 --> 01:02:18,200
Così si scopre che non appena si dispone di uno di quei rettangoli dall'albero

1051
01:02:18,200 --> 01:02:23,050
chiamato il DOM, essa stessa alcuni dati all'interno di esso.

1052
01:02:23,050 --> 01:02:27,820
Così il div che ho appena preso da un albero è ciò che noi chiameremo una proprietà all'interno di esso

1053
01:02:27,820 --> 01:02:34,390
chiamato lo stile, e la proprietà di stile in sé ha una proprietà chiamata visibilità.

1054
01:02:34,390 --> 01:02:37,330
Vorrei che questo solo, cercando manuale di un utente CSS.

1055
01:02:37,330 --> 01:02:41,160
Sembra che vi sia una proprietà di visibilità CSS che fa quello che dice.

1056
01:02:41,160 --> 01:02:44,530
Fa qualcosa di visibile o no, visibile o meno.

1057
01:02:44,530 --> 01:02:46,810
E come hai fatto è questo.

1058
01:02:46,810 --> 01:02:50,510
Mi sto chiedendo se il livello di visibilità di questo div è nascosto,

1059
01:02:50,510 --> 01:02:53,390
che cosa posso cambiare? Visibile.

1060
01:02:53,390 --> 01:02:58,840
Altrimenti se la visibilità di questa pagina non è nascosta, logicamente mi faccio nascosto.

1061
01:02:58,840 --> 01:03:04,070
Non ho idea del perché è visibile e nascosto e non visibile e invisibile.

1062
01:03:04,070 --> 01:03:06,000
Questa è stata una decisione cattiva progettazione lungo la strada.

1063
01:03:06,000 --> 01:03:09,530
Ma quelli sono davvero opposti in CSS: visibili e nascosti.

1064
01:03:09,530 --> 01:03:15,520
Tutto questo non fa altro che vuol dire cambiare il CSS del mio file e fuori, dentro e fuori

1065
01:03:15,520 --> 01:03:16,870
per quel particolare div.

1066
01:03:16,870 --> 01:03:20,630
Ma ancora una volta, si tratta di una funzione chiamata lampeggiano. Quando viene chiamata la funzione di lampeggio?

1067
01:03:20,630 --> 01:03:24,080
Si scopre che c'è un altro globale speciale finestra variabile chiamata,

1068
01:03:24,080 --> 01:03:28,220
simile nello spirito a documentare, ma che il documento si riferisce alla tua pagina web,

1069
01:03:28,220 --> 01:03:31,700
come l'albero DOM, il codice HTML è inviato dal server,

1070
01:03:31,700 --> 01:03:35,250
finestra si riferisce al cromo intorno ad esso, la barra degli indirizzi, la barra del titolo,

1071
01:03:35,250 --> 01:03:37,880
e tutta quella roba intorno alla vostra pagina web.

1072
01:03:37,880 --> 01:03:42,800
>> E si scopre che l'oggetto finestra ha una funzione speciale all'interno di esso chiamata setInterval

1073
01:03:42,800 --> 01:03:44,360
che fa quello che dice.

1074
01:03:44,360 --> 01:03:48,600
Esso stabilisce un intervallo - in questo caso ogni 500 millisecondi -

1075
01:03:48,600 --> 01:03:52,270
e, prendere una supposizione, che cosa sta andando a fare ogni 500 millisecondi?

1076
01:03:52,270 --> 01:03:55,240
E 'intenzione di eseguire la funzione che i blink.

1077
01:03:55,240 --> 01:03:58,560
E ciò che è bello è che avremmo potuto fare questo in C, anche se non abbiamo mai fatto.

1078
01:03:58,560 --> 01:04:01,580
C ha qualcosa chiamato puntatori a funzione in cui è possibile passare le funzioni intorno

1079
01:04:01,580 --> 01:04:03,140
come argomenti.

1080
01:04:03,140 --> 01:04:07,620
Allo stesso modo in JavaScript si può passare il nome di una funzione in un'altra funzione.

1081
01:04:07,620 --> 01:04:10,630
E notate quello che sto facendo. Non sto facendo questo.

1082
01:04:10,630 --> 01:04:14,380
Se metto le parentesi dopo il lampeggio, ciò significherebbe chiamare la funzione di lampeggio.

1083
01:04:14,380 --> 01:04:17,430
Se li omette, significa che qui è la funzione di lampeggio

1084
01:04:17,430 --> 01:04:21,330
in modo che setInterval può chiamare ogni 500 millisecondi.

1085
01:04:21,330 --> 01:04:28,200
Così il risultato finale, anche se è atroce, è che se vado in localhost e andare a blink.html,

1086
01:04:28,200 --> 01:04:32,120
Ora ho questo accada ancora e ancora.

1087
01:04:32,120 --> 01:04:34,950
E se io in realtà Inspect Element, vediamo se siamo in grado di vedere questo.

1088
01:04:34,950 --> 01:04:38,550
Lasciatemi Inspect Element, fammi scorrere verso il basso solo un po ',

1089
01:04:38,550 --> 01:04:44,320
lascia decidere Elementi qui da noi, e notare l'interno DOM dell'ispettore di Chrome.

1090
01:04:44,320 --> 01:04:48,840
E 'letteralmente cambiando avanti e indietro ogni 500 millisecondi.

1091
01:04:48,840 --> 01:04:55,660
Se andiamo al nostro amico Nate,

1092
01:04:55,660 --> 01:05:00,020
se siete mai chiesti come questo funziona, un'idea simile con un intervallo,

1093
01:05:00,020 --> 01:05:04,810
ma Nate è in realtà molto efficace facendo uso del colore in questo caso particolare qui.

1094
01:05:04,810 --> 01:05:07,350
Che cosa di più si può effettivamente fare con questo?

1095
01:05:07,350 --> 01:05:09,990
Apriamo un altro esempio e provare qualcosa di

1096
01:05:09,990 --> 01:05:12,940
che è di programmazione ancora più utile che fare lampeggiare le cose.

1097
01:05:12,940 --> 01:05:17,990
Lasciami andare nella nostra directory forme oggi e andare in form0.

1098
01:05:17,990 --> 01:05:20,820
Questa era la forma più brutto possibile che io possa venire con,

1099
01:05:20,820 --> 01:05:23,290
e vorrei solo mostrare come appare in un browser.

1100
01:05:23,290 --> 01:05:28,960
>> Lasciami andare in localhost / forme, e questo è form0.

1101
01:05:28,960 --> 01:05:33,400
Si tratta di un super forma brutto HTML che dispone di alcuni campi per la posta elettronica, la password,

1102
01:05:33,400 --> 01:05:37,190
la password, e poi un po 'di casella di controllo per accettare alcuni termini e condizioni.

1103
01:05:37,190 --> 01:05:41,350
Il problema è se dovessi visitare questo modulo e non voglio darvi il mio indirizzo di posta elettronica,

1104
01:05:41,350 --> 01:05:44,730
Non voglio accettare i termini e le condizioni, magari, posso fare clic su Registra

1105
01:05:44,730 --> 01:05:46,920
e mi lascia passare comunque.

1106
01:05:46,920 --> 01:05:50,800
Questo accade a presentare in un file PHP chiamato stupido dump.php.

1107
01:05:50,800 --> 01:05:58,420
Tutto ciò non fa altro che stampare il contenuto di $ _GET solo per scopi diagnostici.

1108
01:05:58,420 --> 01:06:01,580
Questo è ciò che è stato presentato da parte dell'utente solo ora.

1109
01:06:01,580 --> 01:06:05,010
Ma se vogliamo davvero per convalidare invio del modulo dell'utente.

1110
01:06:05,010 --> 01:06:06,530
Lasciami andare in versione 1.

1111
01:06:06,530 --> 01:06:11,420
Questo è form1.html. Sembra esteticamente altrettanto male, a meno di notare come sia elegante.

1112
01:06:11,420 --> 01:06:15,450
Se si fa clic su Registra senza cooperare, ho sgridato.

1113
01:06:15,450 --> 01:06:17,320
"È necessario fornire il tuo indirizzo email."

1114
01:06:17,320 --> 01:06:21,670
Bene. Permettetemi quindi di provarlo. Così malan@harvard.edu. Non ho bisogno di una password.

1115
01:06:21,670 --> 01:06:25,100
Registrati. "È necessario fornire una password." Bene.

1116
01:06:25,100 --> 01:06:28,470
Così mi fornirà una password di cremisi. Registrati.

1117
01:06:28,470 --> 01:06:32,300
"Le password non corrispondono." Devo scrivere ora qui cremisi.

1118
01:06:32,300 --> 01:06:35,710
Per sbaglio ho verificato che. Registrati.

1119
01:06:35,710 --> 01:06:39,860
"Devi accettare i termini e le condizioni." Bene. Accetto lì. Registrati.

1120
01:06:39,860 --> 01:06:43,700
Ed ora mi mostra l'uscita di diagnosi laggiù.

1121
01:06:43,700 --> 01:06:45,630
>> Quindi, cosa è successo?

1122
01:06:45,630 --> 01:06:48,330
Abbiamo avuto questa possibilità di convalidare l'invio di moduli.

1123
01:06:48,330 --> 01:06:51,420
Infatti, se avete fatto immersioni in pset 7, c'è una funzione di scusarsi

1124
01:06:51,420 --> 01:06:54,620
che lo rende piuttosto facile a gridare l'utente con un messaggio sullo schermo.

1125
01:06:54,620 --> 01:06:57,580
Sto utilizzando un meccanismo leggermente diverso, la funzione di allarme,

1126
01:06:57,580 --> 01:07:03,690
che non è una funzione che è sorrideva dal momento che rende i messaggi utente molto brutto.

1127
01:07:03,690 --> 01:07:05,710
Ma vediamo quello che sto facendo qui.

1128
01:07:05,710 --> 01:07:09,620
Questo è form1.html, e notare che ho un po 'di sintassi piuttosto familiare:

1129
01:07:09,620 --> 01:07:12,920
tag body, tag form, attributo action, attributo method.

1130
01:07:12,920 --> 01:07:17,050
Ma notato che ho dato la mia forma un ID univoco per convenienza.

1131
01:07:17,050 --> 01:07:19,190
Poi ho un campo di e-mail il cui tipo è il testo,

1132
01:07:19,190 --> 01:07:23,780
un campo di password il cui tipo è la password, campo di conferma il cui tipo è la password,

1133
01:07:23,780 --> 01:07:28,070
e poi una casella di controllo che si chiama accordo qui, tipo è casella di controllo.

1134
01:07:28,070 --> 01:07:30,380
E poi ho un pulsante di invio.

1135
01:07:30,380 --> 01:07:33,050
Ma bando nella parte superiore che altro ho.

1136
01:07:33,050 --> 01:07:35,810
Prima di tutto, c'è un altro uso del tag script.

1137
01:07:35,810 --> 01:07:40,520
Se avete un po 'di codice JavaScript in un altro file, proprio come con i CSS è possibile includerlo.

1138
01:07:40,520 --> 01:07:44,530
E lo si fa con sorgente dello script, e poi notare che sto collegamento apparentemente

1139
01:07:44,530 --> 01:07:50,349
a googleapis.com a un percorso molto lungo, ma il cui nome file termina in jquery.min

1140
01:07:50,349 --> 01:07:52,420
per il minimo. js.

1141
01:07:52,420 --> 01:07:55,969
jQuery è una libreria super-popolare per JavaScript che fa solo JavaScript

1142
01:07:55,969 --> 01:07:58,230
tanto più facile da usare.

1143
01:07:58,230 --> 01:08:00,610
E 'effettivamente diventare uno standard de facto.

1144
01:08:00,610 --> 01:08:04,090
Quindi, anche se quello che state per vedere non è puro JavaScript per sé,

1145
01:08:04,090 --> 01:08:09,340
è una libreria in cima JavaScript tanto come la libreria CS50 è uno strato

1146
01:08:09,340 --> 01:08:13,670
sulla parte superiore del codice a basso livello C, la realtà è che quasi tutti su Internet che utilizza.

1147
01:08:13,670 --> 01:08:18,030
Quindi non si tratta di ruote di formazione. Questo è solo il migliore pratica in questi giorni.

1148
01:08:18,030 --> 01:08:22,830
Ora notate sotto questa è la mia tag script stesso, e notare quello che ho fatto qui.

1149
01:08:22,830 --> 01:08:27,450
Si scopre che jQuery fa qualcosa di un po 'di fantasia.

1150
01:08:27,450 --> 01:08:29,660
JavaScript ha il segno del dollaro, ma sono privi di significato.

1151
01:08:29,660 --> 01:08:32,870
>> Sono come la lettera A o B o C.

1152
01:08:32,870 --> 01:08:36,670
jQuery ha semplicemente adottato la convenzione o tipo di affermazione posato sul fatto

1153
01:08:36,670 --> 01:08:40,280
che $ sarà il loro simbolo speciale.

1154
01:08:40,280 --> 01:08:44,950
Quindi, non appena si carica il file JavaScript globale qui con il tag script,

1155
01:08:44,950 --> 01:08:49,080
si ha accesso a una variabile globale speciale che si chiama $.

1156
01:08:49,080 --> 01:08:53,009
E 'più propriamente chiamata jQuery, ma che non guarda quasi come sexy da $.

1157
01:08:53,009 --> 01:08:56,250
Ma $ non ha un significato particolare. In PHP aveva un significato speciale.

1158
01:08:56,250 --> 01:08:58,440
Si doveva avere di fronte a una variabile.

1159
01:08:58,440 --> 01:09:01,670
Questa è solo una cosa sexy che si sono assunte.

1160
01:09:01,670 --> 01:09:03,389
Che cosa sta succedendo qui?

1161
01:09:03,389 --> 01:09:08,830
Notate che sto passando alla funzione jQuery mio documento variabile globale

1162
01:09:08,830 --> 01:09:10,860
e poi chiamo. pronto.

1163
01:09:10,860 --> 01:09:15,480
Cosa jQuery essenzialmente non è che ti permette di prendere alcune cose JavaScript vaniglia

1164
01:09:15,480 --> 01:09:17,889
come l'oggetto del documento, l'oggetto finestra,

1165
01:09:17,889 --> 01:09:20,790
e se si passa alla funzione jQuery -

1166
01:09:20,790 --> 01:09:24,429
e di nuovo, per essere chiari, si tratta di una funzione chiamata jQuery -

1167
01:09:24,429 --> 01:09:28,240
ciò che fa è che ritorna a voi una versione speciale del documento

1168
01:09:28,240 --> 01:09:30,700
che ha più funzionalità ad esso associati.

1169
01:09:30,700 --> 01:09:34,760
Così in JavaScript prima non esiste una funzione pronta,

1170
01:09:34,760 --> 01:09:37,810
ma se si passa documento alla funzione jQuery in primo luogo,

1171
01:09:37,810 --> 01:09:40,960
ritorna a voi una versione speciale del documento oggetto

1172
01:09:40,960 --> 01:09:43,030
che ha più caratteristiche di fantasia.

1173
01:09:43,030 --> 01:09:48,230
Ed è per questo che la gente piace. Rende solo le cose più facili da fare, come stiamo per vedere.

1174
01:09:48,230 --> 01:09:49,820
Che cosa significa questa riga di codice significa?

1175
01:09:49,820 --> 01:09:52,690
Questa riga di codice indica che qui quando il documento è pronto -

1176
01:09:52,690 --> 01:09:56,830
in altre parole, una volta che il browser viene effettuata la lettura di questo file top bottom -

1177
01:09:56,830 --> 01:09:59,200
andare avanti ed eseguire la seguente funzione.

1178
01:09:59,200 --> 01:10:03,540
Ciò che è veramente interessante in JavaScript - PHP e ha anche questo -

1179
01:10:03,540 --> 01:10:05,450
è funzioni anonime.

1180
01:10:05,450 --> 01:10:10,560
In JavaScript è possibile dichiarare le funzioni che non hanno nome ma hanno un corpo.

1181
01:10:10,560 --> 01:10:12,570
Notate quello che sta succedendo qui.

1182
01:10:12,570 --> 01:10:16,220
>> Si tratta di una funzione chiamata pronto, e significa solo fare le seguenti

1183
01:10:16,220 --> 01:10:20,220
quando la pagina web, tutto è pronto, quando tutto è stato letto dal server.

1184
01:10:20,220 --> 01:10:23,090
Che cosa vuoi fare? Voglio eseguire un pezzo di codice.

1185
01:10:23,090 --> 01:10:27,120
Si noti che non si desidera eseguire questo codice subito.

1186
01:10:27,120 --> 01:10:34,350
Se ho omesso questo, ciò significherebbe iniziare immediatamente l'esecuzione di queste righe di codice.

1187
01:10:34,350 --> 01:10:39,040
Ma il fatto che io sto dicendo no, no, no, avvolgere questo in una funzione anonima come questa

1188
01:10:39,040 --> 01:10:43,000
mezzi non lo esegue ancora, chiamano alla fine.

1189
01:10:43,000 --> 01:10:45,430
Lo abbiamo visto poco fa nel nostro esempio precedente.

1190
01:10:45,430 --> 01:10:49,990
Quale funzione ha che noi chiamiamo fine, a 500 millisecondi più tardi? Blink.

1191
01:10:49,990 --> 01:10:51,480
Quindi, la stessa idea.

1192
01:10:51,480 --> 01:10:53,950
Anche in questo caso, anche se questo sembra un po 'strano, basta prendere per ora sulla fede

1193
01:10:53,950 --> 01:10:57,060
che per dichiarare una funzione anonima che si chiama alla fine,

1194
01:10:57,060 --> 01:11:01,720
è sufficiente scrivere function () {

1195
01:11:01,720 --> 01:11:05,380
Quindi, quale codice stiamo andando ad eseguire alla fine? Il seguente.

1196
01:11:05,380 --> 01:11:10,460
Questo sembra anche un po 'di nuovo, ma questo significa che qui è la funzione jQuery,

1197
01:11:10,460 --> 01:11:13,430
e questo è ora un collegamento.

1198
01:11:13,430 --> 01:11:18,830
Questo frammento di codice HTML nella parte inferiore dello schermo, naturalmente, ha una certa rappresentazione ad albero.

1199
01:11:18,830 --> 01:11:21,730
Non è presente. Questa pagina è più interessante di questo esempio ciao mondo,.

1200
01:11:21,730 --> 01:11:25,210
Ma c'è qualche albero che corrisponde a questo codice HTML.

1201
01:11:25,210 --> 01:11:28,910
Sarebbe un dolore al collo di dover attuare una sorta di funzione ricorsiva

1202
01:11:28,910 --> 01:11:34,380
consecutivi a partire dal nodo radice e poi trovare il nodo il cui ID è la registrazione.

1203
01:11:34,380 --> 01:11:38,340
Così che cosa jQuery rende super facile per noi è letteralmente questo.

1204
01:11:38,340 --> 01:11:43,000
Vai avanti e prendermi qualsiasi forma div o qualsiasi altra cosa, qualunque elemento HTML

1205
01:11:43,000 --> 01:11:45,820
ha un ID di registrazione.

1206
01:11:45,820 --> 01:11:52,440
Ciò equivale a document.getElementById ('registrazione').

1207
01:11:52,440 --> 01:11:54,170
>> Perché gente come jQuery?

1208
01:11:54,170 --> 01:12:00,110
Perché è più breve da scrivere. Ma è tutto qui. E 'la stessa idea.

1209
01:12:00,110 --> 01:12:02,630
Dammi il tag il cui ID è la registrazione.

1210
01:12:02,630 --> 01:12:06,300
E quando quel tag, che risulta essere una forma, viene inviato,

1211
01:12:06,300 --> 01:12:08,300
andare avanti ed eseguire questo codice.

1212
01:12:08,300 --> 01:12:11,320
Allora diamo uno sguardo a come ora stiamo facendo la validazione dei form.

1213
01:12:11,320 --> 01:12:15,950
La sintassi è certamente criptico in un primo momento, ma cosa sta succedendo?

1214
01:12:15,950 --> 01:12:21,050
Se questa riga di codice è vero, ho intenzione di urlare all'utente di fornire il proprio indirizzo e-mail.

1215
01:12:21,050 --> 01:12:22,970
Così che cosa è questa riga di codice?

1216
01:12:22,970 --> 01:12:25,560
$ Significa jQuery. Ora notare questo.

1217
01:12:25,560 --> 01:12:27,920
Questo è un po 'come i CSS.

1218
01:12:27,920 --> 01:12:33,370
Se hai tuffò CSS ancora, saprete che questo significa che l'elemento il cui ID è la registrazione.

1219
01:12:33,370 --> 01:12:39,840
Lo spazio si intende trovare un bambino o di un discendente di registrazione il cui nome è in ingresso.

1220
01:12:39,840 --> 01:12:42,970
E poi questa cosa tra parentesi quadre è un piccolo filtro.

1221
01:12:42,970 --> 01:12:47,010
E anche se questo sembra criptico, questo significa solo andare al modulo di cui ID è la registrazione,

1222
01:12:47,010 --> 01:12:51,230
andare verso l'interno di ingresso elemento di quella il cui nome è la posta elettronica,

1223
01:12:51,230 --> 01:12:55,440
e quindi ottenere il suo valore, qualunque sia il suo valore sembra essere -

1224
01:12:55,440 --> 01:12:59,670
asdf se è tutto quello che ho digitato o malan@harvard.edu se è quello che ho scritto.

1225
01:12:59,670 --> 01:13:05,250
Quindi, se il valore del campo email del form == niente, alzare la voce contro l'operatore.

1226
01:13:05,250 --> 01:13:09,700
Altrimenti se il valore del campo password == nulla, gridare contro l'operatore.

1227
01:13:09,700 --> 01:13:19,520
>> Altrimenti se il valore del campo password non uguale al valore del campo di conferma,

1228
01:13:19,520 --> 01:13:22,850
che è stato l'elemento di altra forma, gridare contro l'operatore.

1229
01:13:22,850 --> 01:13:25,680
E poi, infine - e questo ha anche un po 'di nuova sintassi propria,

1230
01:13:25,680 --> 01:13:29,270
ma una volta che l'ho visto, è almeno un po 'più ragionevole -

1231
01:13:29,270 --> 01:13:34,060
else if il modulo il cui ID è la registrazione ha un elemento di input il cui nome è l'accordo

1232
01:13:34,060 --> 01:13:39,720
ed è selezionata, andare avanti e urlare contro l'operatore.

1233
01:13:39,720 --> 01:13:42,520
Così ho assolutamente ammettere che questo è completamente travolgente a prima vista.

1234
01:13:42,520 --> 01:13:46,530
E 'un sacco di nuova sintassi. Ma tutti jQuery segue questo tipo di modelli.

1235
01:13:46,530 --> 01:13:49,880
E onestamente, io non sapevo nemmeno che esistesse questo fino a pochi minuti fa.

1236
01:13:49,880 --> 01:13:53,640
I Googled: "Come si fa a controllare se una casella è selezionata in jQuery?"

1237
01:13:53,640 --> 01:13:55,680
e questa è la sintassi, perché ci sono diversi modi di farlo

1238
01:13:55,680 --> 01:13:58,010
con l'attuale codice grezzo JavaScript.

1239
01:13:58,010 --> 01:14:01,030
Così come la prima pagina di Set Problema 7 sottolinea,

1240
01:14:01,030 --> 01:14:04,500
pset 7 è molto più che un esercizio di bootstrap te stesso

1241
01:14:04,500 --> 01:14:08,650
dove abbiamo fornito, si spera, un quadro concettuale con cui affrontare il pset.

1242
01:14:08,650 --> 01:14:12,280
>> Ma come spesso accade con il web design, è a voi veramente curiosare,

1243
01:14:12,280 --> 01:14:16,680
incorporare frammenti di codice ed esempi dal web fino a quando li si citano

1244
01:14:16,680 --> 01:14:17,960
secondo i termini di quel primo foglio,

1245
01:14:17,960 --> 01:14:21,460
e rendersi conto che imparare il linguaggio HTML, CSS, JavaScript e anche SQL

1246
01:14:21,460 --> 01:14:26,020
è veramente destinato ad essere questo a casa esercizio, come si comincia a prendere queste ruote di formazione off.

1247
01:14:26,020 --> 01:14:29,150
E rendersi conto troppo ci sono così tante cose che più si può fare con un browser.

1248
01:14:29,150 --> 01:14:33,790
All'interno della maggior parte di questi elementi ci sono altre cose chiamati gestori di eventi.

1249
01:14:33,790 --> 01:14:37,140
E anche se abbiamo appena visto quelli chiamati onsubmit e onReady,

1250
01:14:37,140 --> 01:14:40,310
si possono fare le cose come onkeydown, onkeyup,

1251
01:14:40,310 --> 01:14:43,410
come quando l'utente tocca un tasto, è possibile ascoltare per questo e la chiave.

1252
01:14:43,410 --> 01:14:45,940
Gmail ha scorciatoie da tastiera.

1253
01:14:45,940 --> 01:14:49,490
In che modo Google implementare le scorciatoie da tastiera, come C per comporre?

1254
01:14:49,490 --> 01:14:54,120
Ascoltano per gli eventi, come sono chiamati, come onkeypress o onkeyup e onKeyDown.

1255
01:14:54,120 --> 01:14:56,360
Se hai mai aleggiava il mouse sopra un po 'di voce di menu

1256
01:14:56,360 --> 01:15:00,180
e tutto ad un tratto, voilà, viene visualizzato un menu o il grafico a colori cambia,

1257
01:15:00,180 --> 01:15:01,920
come lo stanno facendo?

1258
01:15:01,920 --> 01:15:06,940
Piuttosto che ascoltare onReady o onsubmit, si ascolta per onmouseover e onmouseout.

1259
01:15:06,940 --> 01:15:10,920
>> Così, in breve, con queste basi molto semplici che abbiamo cominciato a grattare la superficie di oggi

1260
01:15:10,920 --> 01:15:13,940
e ci immergeremo in seguito il Mercoledì, si ha, sempre più,

1261
01:15:13,940 --> 01:15:17,530
potere di attuare il tipo di cose che sei già familiarità.

1262
01:15:17,530 --> 01:15:21,620
Quindi cerchiamo di finisce qui, e continueremo questo il Mercoledì.

1263
01:15:22,690 --> 01:15:24,320
>> [CS50.TV]