DAVID MALAN: Va bene. Questo è CS50, e questo è la fine della settimana nove. E 'stata una tromba d'aria sopra Negli ultimi giorni. E problema impostare sette, se siete ginocchio profondità in esso, si rendono conto c'è un bel bit di nuovo che è in là. Ma vediamo se non possiamo piece tutto insieme qui brevemente prima di allora divagare in ancora un'altra direzione e vedere dove altro possiamo andare. 

Quindi finora, abbiamo parlato HTML. Abbiamo parlato CSS. Abbiamo parlato di PHP. Hai iniziato a sperimentare SQL. Oggi parleremo un po ' su JavaScript. Ma come fanno tutte queste disparate lingue incastrano? 

Così abbiamo parlato la settimana scorsa circa la idea di avere un server. Così facciamo solo disegnare questo rettangolo come un server web qui. E un server web serve sicuramente file. E alcuni di questi file può essere file HTML. Così una delle cose che un server web può sputare fuori potrebbe essere un file ci limiteremo a disegnare come questa contenente del codice HTML. Quindi, in parole povere, cosa Non HTML consentono di fare? 

AUDIENCE: Pagina bel look. 

DAVID MALAN: OK, fare una pagina di aspetto gradevole, anche se penso che ho dimostrato che altrimenti. Così HTML non puoi layout di pagina strutturalmente, e ti permette di sorta di esteticamente segnare una pagina, contrassegnare contenuto statico, in modo che si può quindi visualizzare con un browser web. 

Ma questa è la chiave. E 'contenuto statico. Si scrive, si salva, e poi lo spedite. E il server web allora serve fino ai vostri ospiti. 

Ma noi stilizzare le cose con un diverso linguaggio del tutto. Abbiamo iniziato a utilizzare un attributo di stile su alcuni tag. E l'attributo di stile mettiamoci cose come la dimensione del carattere e il colore. E probabilmente avete iniziato a scoprire, oppure è presto per finale progetti potenzialmente, ancora altri le proprietà che è possibile utilizzare in CSS. E così in termini profani, cosa in realtà poi non CSS fare? Questi sono solo esempi della stessa. Cosa puoi farlo HTML non sembra da ciò abbiamo visto finora? 

AUDIENCE: Definire stili da soli. 

DAVID MALAN: Definire stili da soli. Quindi definire le cose come le classi, come si possono aver incontrato, o di carattere specificamente identificare i nodi in un documento in modo che è possibile stilizzare. Ma più precisamente, direi che i CSS davvero consente di prendere le cose ultimo miglio e consente di specificare più più precisamente l'estetica, considerando HTML per la maggior parte consente di strutturare le pagine. 

E anche se ci sono alcuni valori di default, come abbiamo visto il tag per una voce tag, che grosso modo fatto le cose in grande e in grassetto. Questa è una definizione abbastanza generica del tag - grande e grassetto. Quali sono le dimensioni del font è questo? Di che colore è? Come in grassetto è quello? E CSS permette più precisione tune cose del genere. Nonché la layout, alcuni di che avete visto. 

E, francamente, CSS è un po ' di un linguaggio disordinato. E 'molto potente che si può fare letteralmente qualsiasi sito web che hai visto sul web oggi con esso, ma è una specie di un dolore al collo. E alcuni di voi hanno sbattuto la testa contro le pareti già solo per fare qualcosa di stupido come centro di un menù problema impostare sette se hai ottenuto a quel punto già. 

Ma realizzare, quelle cose diventa più facile nel tempo. Si inizia a notare i modelli. E ancora, Google sarà tuo amico per i vari modi in cui è possibile risolvere questo tipo di problemi. 

E oserei dire con CSS e HTML più in generale, è possibile risolvere i problemi in molti altri modi, ognuno dei quali potrebbe molto anche essere corretta, di quanto si possa in qualcosa di simile a C, anche Ora PHP o JavaScript. Ci sono solo molti diversi Per disporre le cose. 

Ma questo ha iniziato a ottenere disordinato, abbiamo detto. Solo tipo di commistione vostro HTML e il vostro CSS con l'attributo stile era un po 'sciatta. E così abbiamo invece detto, una sorta di astrattamente parlando, che si dovrebbe almeno iniziare a fattore il vostro CSS probabilmente. Attribuisce Non è il mio stile, ma almeno utilizzare il tag di stile all'interno di quello che parte della pagina web? 

AUDIENCE: Head. 

DAVID MALAN: Nella testa. Fino ad ora, abbiamo avuto solo il titolo fino lì, ma è anche possibile aggiungere uno stile tag, e si può mettere il CSS approssimativamente parlando verso la parte superiore della pagina. Ma poi abbiamo fatto un ulteriore passo avanti le cose e di factoring che devi sapere in un file separato. 

E così questi due file sono stati qualche ora collegati. Ed in effetti era la tag che ha fatto. E quello che era uno dei generale motivazioni per factoring il nostro CSS tanto più? 

AUDIENCE: riusabilità. 

DAVID MALAN: riutilizzo. Giusto? Potreste aver visto in p-set sette già che un sacco di pagine, l' Pagina acquisto, la pagina di vendita, il portafoglio di pagina, sono probabilmente strutturato un po 'allo stesso modo. C'è un logo finanza CS50 in alto a meno che non hai deciso di cambiarlo. C'è un piè di pagina al inferiore di pagine. E CSS permette poi di fattore fuori in un file separato in modo che se si vuole cambiare qualcosa a livello globale attraverso l'intero sito, si può veramente basta cambiare in un unico posto. 

Ma c'è un prezzo da pagare potenzialmente avendo fattorizzato l' CSS dal mio file HTML in un separato File che fa riferimento con il tag, che abbiamo visto il Lunedi. Che cosa potrebbe essere il rovescio della medaglia di questo? Ripensando una settimana fa da quando siamo parlando di HTTP e TCP / IP e come funziona Internet. Qualcosa di più di qui? 

AUDIENCE: Ci vuole più tempo. 

DAVID MALAN: Ci vuole più tempo. Perché? 

AUDIENCE: [incomprensibile]. 

DAVID MALAN: Già. Quindi ci vuole forse un po 'più di tempo. Perché uno, il CSS è ovviamente non nello stesso file. Così ora si deve fare non uno, ma due richieste. E ciascuna di tali richieste, come abbiamo visto nel Chrome nel cosiddetto ispettore, e abbiamo guardato la scheda di rete, ciascuna di questi file richiede una HTTP richiesta, che abbiamo visto si certa quantità di tempo. Ora, forse non è molto. Forse è a soli 20 millesimi di secondo. Forse è 200 millisecondi. 

Ma pensare a una pagina come Facebook, o CNN, o Google, che sono molto più grande degli esempi che ho guardato finora. Quelle pagine potrebbero avere decine di file, ciascuno dei quali potrebbe richiedere un scaricare di un file. Quindi le cose possono potenzialmente iniziare a rallentare. 

E soprattutto in questi giorni in cui tutti noi avere i telefoni cellulari nelle nostre tasche e connessione internet lenta, dovendo aspettare ancora qualche millisecondi, alcuni più millisecondi per ulteriore i file possono effettivamente essere lento. La latenza è la parola che descrive il tipo di attesa che si dispone che si sperimentare quando in attesa di qualche pezzo di informazione. 

Ma c'è un lato positivo. Quindi non è tutto una sorta di - in realtà è un po 'un altalena qui. Ribasso ora, ma quello che i browser possono fare se sono intelligenti al fine di evitare dover richiedere lo stesso styles.css file di nuovo può essere per fare cosa? 

Memorizzarlo nella cache. Così cache - C-A-C-H-E - generalmente si intende qui solo per salvare la archiviate avete richiesto la prima volta, e quindi controllare la cache per questo. Controllo siete sorta di contenitore di stoccaggio, e se si dispone già di un copia di styles.css, anche se qualche altro pagina nel p-set, o qualsiasi sito web, richieste di nuovo, giusto per dare l' utente stesso copia cache. Non preoccupatevi di richiedere. 

Unico inconveniente lì, anche se, come alcuni di voi hanno inciampato nella p-set. Se si apporta una modifica sul server e si torna indietro al browser e si ricaricare, a volte il browser fa un favore e non si preoccupa ri-scaricare il file styles.css perché, dai, quali sono le probabilità che questi stili che Facebook usa stanno per cambiare di ora in ora o di giorno per giorno? E 'piuttosto bassa. Essi potrebbero cambiare nel tempo, ma non al minuto o di ora in ora. 

Quindi un trucco, appena cronaca quando si fa web sviluppo, è spesso tenere premuto il spostare il tasto per esempio, e quindi fare clic su ricaricare nel browser, e che sarà tipicamente dire al reload del browser tutto, anche se si dispone già di nella cache. Quindi, di nuovo, pregi e svantaggi, ma tutti in ultima analisi, le decisioni di progettazione. 

Così ora, non ci siamo proprio terminare la storia qui. Se io ora vado avanti e indietro e indietro e indietro, abbiamo iniziato ad introdurre non solo HTML, ma PHP. Quindi, in parole povere, che cosa PHP non facciamolo? 

AUDIENCE: [incomprensibile]. 

DAVID MALAN: Cosa e 'quello? 

AUDIENCE: introdurre la logica nel codice. 

DAVID MALAN: Sì, introdurre logica nel codice. Quindi è un vero linguaggio di programmazione con i loop e variabili, e funzioni, e le condizioni, e tutte di le cose che abbiamo usato via del ritorno quando da zero. E PHP, abbiamo visto, può essere utilizzato sia a linea di comando - è non deve avere a che fare con il web, anche se questo è in realtà le sue origini e che cosa si tende di essere bravo e favorevole - ma è possibile utilizzare PHP semplicemente dalla natura del fatto che esso ha una stampa () funzione, e a) la funzione printf (, o una funzione echo (). Ci sono mazzi di modi può stampare il testo con PHP. 

Pertanto, è possibile utilizzare questa programmazione lingua per emettere esattamente quello che stavamo parlando prima. È possibile generare dinamicamente il vostro codice HTML. Forse non tutto. Forse si dure cose di codice, come il intestazione e il piè di pagina, e il logo, ed i fogli di stile, e tutto questo. Ma per qualcosa come p-set di sette, dove si sta manipolando le scorte e mostrando portafoglio dell'utente, che è intenzione di cambiare dinamicamente, si potrebbe sicuramente utilizzare PHP e la logica dà voi come un linguaggio di programmazione per Uscita sottoinsiemi dinamicamente della pagina. 

Quindi, quando si parla di siti web dinamici, o di programmazione web, questo è cosa si sta realmente parlando. Usando un linguaggio come PHP, o cose chiamato Python o Ruby, o Java, o ancora altre lingue, per interrogare un database spesso, o altro server, e poi sputare dinamicamente HTML. 

Ora il risultato finale, per inciso, è che il codice HTML della maggior parte dei siti web, compreso il vostro p-set di sette, è probabilmente sarà una grande confusione se si guarda il sorgente codice in un browser. Questo non è un grosso problema. A questo punto, quando ci preoccupiamo stile, ci preoccupiamo per la Roba che si scrive. Noi non preoccupano la roba che cosa i vostri uscite di codice. Quindi non preoccuparti di indentazione qui se si tratta di PHP che è effettivamente l'output roba. Dopo tutto, il browser non si cura, e un essere umano non sarà alla ricerca alla fonte comunque. Abbiamo il personale, per esempio, sarebbe essere guardando il tuo PHP. 

Quindi lasciatemi fare un rapido esempio ora del perché altrimenti questo potrebbe essere utile. Quindi, francamente, non riesco a ricordare l'ultima volta che ho usato C per risolvere un problema in il mondo reale. E 'stato probabilmente nella scuola di specializzazione in cui Avevo bisogno di usare un linguaggio che era piuttosto basso livello e mi ha dato la opportunità di fare qualcosa di molto alto eseguire per salvare davvero ben CPU cicli che potevo, in gran parte perché stavo usando grandi insiemi di dati, e ogni ciclo della CPU contato. E, francamente, anche in cose come i telefoni questi giorni e altri dispositivi dove non si dispone di molto più memoria e non si dispone di abbastanza come molto più CPU, utilizzando linguaggi più veloci è ancora attraente. 

Ma nel mondo reale, quando basta vuole buttare qualche programma insieme a analizzare alcuni dati, o che hai raccolto tutta una serie di registrazioni per qualche gruppo di studenti e si desidera molto automatizzare rapidamente l'invio di email uno ad uno per ogni uno di quelli dichiaranti, si sta andando a raggiungere per un linguaggio di livello più elevato di C per così dire. Qualcosa come PHP o Python o Ruby, o una mezza dozzina di altri che esistono in questi giorni. Ma quelle tre sono probabilmente il diritto più alla moda adesso. 

E che cosa questo significa è che si può aprire un editor di testo come gedit o quasi qualsiasi altra cosa e poi basta avviare scrivere codice senza doversi preoccupare sulla compilazione, senza dover davvero preoccuparsi della gestione della memoria, tenendo presente però che una piccola sciatteria finiranno per tornare a mordere se il set di dati viene più grande o il problema diventa grande. Ma cosa significa questo per noi è la seguente. 

Lasciami andare avanti e corro ortografico dal problema posto sei. Quindi questa è la mia implementazione basata su trie che ho usato sul grande bordo dove non eseguito così bene. Torneremo in una settimana di tempo e di rivisitare quelli che ha fatto finire in cima alla grande tavola presso la nostra ultima lezione. Ma per ora, lasciatemi andare avanti e basta eseguire la mia soluzione in testo, e noi faremo Bibbia di Re Giacomo, e ci siamo. 

Quindi questi sono tutti del presunto parole errate su Bibbia di Re Giacomo. E la mia applicazione ha mezzo secondo in totale. Quindi, non troppo male in questo particolare computer. Ma pensare a quanto codice che ho dovuto scrivere. Pensate quanto il codice si doveva scrivere. Pensate a quante ore avete speso nel D-hall o il vostro dormitorio o dovunque effettivamente codificare fino a tale soluzione. 

Beh, se io in realtà sono un livello superiore linguaggio come PHP, tenere presente che cosa posso fare qui. Prima, supponiamo che questo è invece il codice di distribuzione. Questo è un file chiamato correttore ortografico. E 'disponibile come parte di oggi codice di distribuzione. E ho intenzione di sventolare la mia mano a più dei dettagli, ma questo è in realtà un interessante esempio di come si potrebbe trasferire una lingua come C oltre a PHP. Ho letteralmente aperto due finestre di testo, uno con la mia versione C di speller.c, e ho appena iniziato a tradurre nel mio testa a PHP e scrivendo tutto, utilizzando i più vicini funzioni equivalenti. 

Quindi alcune di queste cose sono differenti. Abbiamo visto l'ultima volta che PHP non usa includere in tutto allo stesso modo. Esso utilizza tipicamente richiedono che, sebbene includere esiste. Definire è un po 'diverso da # Define in C, ma che è come facciamo una costante. $ Argc si scopre esiste in PHP, così che abbiamo visto prima. Questi sono solo variabili, tutti che iniziano con il segno del dollaro. Ricordiamo queste sono solo un mucchio di punti galleggianti. 

Quindi, per farla breve, sei il benvenuto a Sfogliando questo caso curioso, questo è quasi una conversione linea-per-linea della Versione C di speller.c in PHP. E si potrebbe farlo di nuovo per una mezza dozzina di altre lingue. 

Ma ciò che è interessante è questo. O quello che è francamente sconfortante è questo. Lasciami andare avanti e digitare about dictionary.php, e sostengono che io sono intenzione di andare avanti e di re-implementare problema definito sei qui. 

Quindi cerchiamo di proporre in primo luogo che in questo file, che sarà attuato in PHP, per cui vorrei apro le tag così. Permettetemi di fare io stesso un globale variabile, $ dimensione diventa zero. E ho intenzione di dare me una tabella hash. Io uso una tabella hash per questa cosa. Come dichiaro una tabella hash in PHP? Fatto. OK. 

Staffa di chiudere la parentesi in modo aperto rappresenta quello che in PHP, come abbiamo visto? Un array, ma un array che potrebbe essere un array associativo. Un array associativo è una struttura dati che tasti associati con i valori. 

Ora, nel più semplice indicizzato numericamente array, quelle chiavi che cosa sono? Zero, uno, due, tre, giusto? Vecchia scuola roba da C. Ma può anche essere stringhe simili a foo e bar, o maxwell, o qualsiasi stringa. Così mi può far leva che in un attimo. 

Lasciami andare avanti e dichiaro una funzione come - facciamo carico () prima. Così carico di funzione (). E PHP è un po 'diverso in quanto è letteralmente tipo di funzione, ma si non digitare un tipo di ritorno. Ho intenzione di andare avanti e dire che la funzione load () dovrebbe prendere in argomento $ dizionario, basta come la versione C ha fatto. Sto facendo che dalla memoria. 

E propongo che io sono intenzione di fare questo. Sto semplicemente andando a fare foreach. Io vado a chiamare una funzione chiamata file (), passando il nome di quel file, che è la variabile $ Dizionario da $ parola. E poi all'interno del mio ciclo for qui, sono intenzione di andare avanti e conservare nel mio $ Tabella $ parola diventa vera. Fatto. Oh, aspetta. Fatto. OK. 

Questa è la funzione load () dire in PHP. Ora, perché funziona? E sto tipo di barare qui. 

Così, uno, foreach abbiamo visto brevemente l'ultima volta. Significa solo che è possibile iterare un array senza preoccuparsi con i e n piú plus, e tutto questo. Dictionary è, naturalmente, il nome del file, qualcosa come grande o piccolo, i due dizionari abbiamo usato l'ultima volta. File è una funzione che apre il testo il file, lo legge in riga per riga, e mani indietro una matrice enorme, ciascuno degli elementi di cui è un linea da quel file. Ecco, questo è la combinazione di fopen, e fread, e mentre loop, e fclose, e tutto questo. Infine, come parola significa proprio questo è il variabile ho intenzione di avere accesso a ad ogni iterazione in questo ciclo. 

Così, in breve, questa fodera qui significa aprire il file il cui nome è in dizionario, la variabile, iterare riga per riga, e ogni volta che si ottiene una linea, negozio in una parola variabile chiamata, e poi fare qualcosa con la parola. Cosa voglio fare? Voglio mettere la parola nella mia tabella hash. 

Beh, posso mettere qualcosa nel mio Hash Table proprio come in C utilizzando le parentesi quadre. Questo è il nome della mia tabella hash. Ho intenzione di indice in quella hash Tavolo in questa posizione. Quindi non inquadrare lo zero, non inquadrare uno. Citazione Staffa qualcosa unquote, qualunque cosa quella parola è. E proprio come si potrebbe avere nel vostro lavoro tabella hash trie, basta negozio effettivamente un valore booleano, implicitamente o esplicitamente. Fatto. Sto memorizzare il valore true. 

Ora ci sono un paio di cose Sto scorciatoie qui. Tecnicamente, ci sara 'un fastidioso nuova linea, / n, a fine ciascuna di tali parole. Quindi forse dovrei chiamare una funzione PHP chiamato chop (), che sarà letteralmente tagliare che fuori. E ho davvero bisogno di fare un'altra cosa. Probabilmente dovrei incrementare taglia su ogni iterazione, quindi sto tenendo traccia a livello globale di quello che è. E, francamente, e questo è uno dei aspetti più stupidi di PHP, se siete utilizzando una variabile globale, è necessario dire esplicitamente che siete. Quindi ho intenzione di scrivere effettivamente a livello mondiale $ Size, $ tabella globale, e ora la mia funzione è completa. 

Quindi non è così semplice come prima, ma probabilmente ha meno tempo rispetto alla C versione, forse? OK. 

Così ora facciamo la funzione () di controllo. Vediamo se almeno questo ha preso l' ore e ore che ci ha preso in C. So lasciatemi andare avanti e dichiaro controllare in funzione. Prende la parola in argomento, che è andando a venire da correttore ortografico. E sto solo andando a verificare se la a seguito isset variabile, tavolo Staffa strtolower di parola - cerchiamo di equilibrio tutte le mie parentesi - poi restituire true. Else - che era davvero il disco parte di questo programma. Altrimenti, restituire false. Fatto. Ecco spunta (). 

Ora, perché questo funziona? Beh, quello che ho passato in una parola, che è una stringa. Due, sto controllando all'interno del hash tavolo, che si chiama $ tabella. Sto costringendolo a caratteri minuscoli chiamando una funzione molto simile tolower () in C, ma questo non fa l'intera parola, Non un singolo carattere. E se è impostata, in altre parole non è un valore impostato, in altre parole, se è vero, allora sì, questa è una parola. Perché ho messo lì con load (). E se no, io vado a restituire false. 

Ora gli altri sono facili. Dimensioni funzione (), come posso fare questo? Io essenzialmente faccio ritorno $ size. Ma ho tecnicamente bisogno di fare questa cosa fastidiosa. E in realtà up sentire, stavo tagliando un angolo di troppo. Ho davvero bisogno di fare $ tabella globale. 

Ma detto questo, scarico). Scaricare () è incredibile. Funzione di scarico (). Come voglio implementare scarico ()? Fatto. OK. 

Così scarico (), la gestione della memoria è completamente preso cura di voi in qualcosa come PHP e un sacco dei linguaggi di alto livello. Quindi questo è incredibile. Come perché diavolo abbiamo trascorso il passato otto più settimane C scrittura a quanto pare molto lento, molto tempo consumano problemi con decine di ore di lavorare sotto le nostre cinture? 

Beh, per prima cosa, questo può funzionare bene per piccoli programmi. Certamente accelerato la mia i tempi di sviluppo. Ma vediamo cosa succede nel mondo reale. 

Lasciami andare in questa directory in una finestra di terminale. C'è correttore ortografico. E notare per inciso, e si potrebbe hanno incontrato questo problema impostare sei o problema impostare sette. Non è strettamente necessario terminare file PHP con. php. Se mettete una riga come quella prima a la cima, che è una linea speciale di sintassi che significa essenzialmente trovare il programma chiamato PHP e usarlo per interpretare questo file. Così ora nessuno sa veramente che Sono in esecuzione di un programma PHP. Posso farlo funzionare proprio come se sono stati qualcosa compilato in C. 

Ma ecco la cosa. In realtà, facciamolo di nuovo. Dropbox/pset6 /. C'è correttore ortografico. OK, 0,44 secondi. Ha ottenuto più veloce questa volta. 

Ora andiamo nella versione di PHP. Bel tocco. Ma basta pensare quanto tempo Ho salvato in orario di ufficio. OK. 

Così 3,59 secondi, che in realtà non suona accurata sia. Ma è perché lunga storia breve, quando si sta stampando una quantità enorme di roba sullo schermo, che si rallenta le cose. Quello che veramente preso la CPU in apparecchio era 3,59 secondi, in Contrariamente a C, che ha avuto 0,44 secondi più di recente. Questo è veramente un ordine di grandezza diversa. 

Allora, dove sta quel prezzo provenienti da? Perché è così molto più lento? Perché PHP esegue così male? Danielle? 

AUDIENCE: Non l'hai fatto davvero utilizzare una tabella hash. 

DAVID MALAN: non ho davvero utilizzare una tabella hash. Così ho sorta di fatto. Quindi è un array associativo. Molto probabilmente se la gente in PHP sono davvero intelligente, hanno usato sotto la cofano di una tabella hash concretamente attuato in qualcosa come C o C + +. Ma. Già. 

AUDIENCE: [incomprensibile]. 

DAVID MALAN: Già. Così ciascuna delle funzioni che ho scritto ora - in realtà, si può dire che una volta di più di un po 'più forte? 

PUBBLICO: Le funzioni che hai incluso ha molto più completo capacità di - 

DAVID MALAN: Ecco, questo è molto vero. C'è molto di più in testa che siamo non proprio visto e concentrarsi solo su dictionary.php, che ho appena scritto. Al contrario, c'è un intero interprete andare in background. In effetti, quando ho eseguito questo programma, non era in esecuzione zeri compilati e quelli progettato per la mia CPU Intel. Piuttosto, era in esecuzione riga per riga Codice PHP che appare esattamente Come abbiamo digitato. E così ogni volta che si utilizza un linguaggio interpretato, è effettivamente fare pagare questo prezzo. Sta andando a prendere un po 'di tempo per leggere il tuo superiore del file in basso, da sinistra a a destra, e poi eseguire ogni line di nuovo e di nuovo. 

Ora, in realtà, soprattutto sul web, si può effettivamente accelerare questo processo mettendo in cache i risultati del Il codice PHP viene interpretata. E questo ha un senso sul web, perché se non hai un utente come me qui, ma 1.000 o 10.000 utenti, quindi forse la prima volta che il file è accesso è lento, ma da allora in poi è molto più veloce. 

Ma anche questo, di nuovo, è un compromesso. E per qualcosa come un dato di ricerca impostare, o anche qualcosa di grande come questo, gli utenti alla fine iniziare a sentire che rallentamento. 

Lingue Così, in breve, sono interpretati molto in voga, molto popolare, e francamente sono probabilmente le lingue dovrebbe raggiungere per quando la risoluzione dei problemi successivamente alla CS50. Ma rendi conto di quanto sei veramente dando per scontato sotto la cappa proprio quelle ultime settimane di hash tavoli, e alberi, e cerca, che vengono utilizzati in definitiva effettivamente implementare cose come parentesi aperta, parentesi quadra, che possiamo ora gratitudine per scontato. 

Quindi, diamo uno sguardo ora in questo contesto web. E ho detto l'ultima volta che non c'è un mazzo di superglobals in PHP che non sono davvero rilevanti nella riga di comando. Sono più rilevante nel contesto di usare PHP in un contesto web. Quindi, in esecuzione di PHP su un server web in modo per generare cose come HTML. 

E ci lanciò un'occhiata a $ _GET e $ _POST, e è lì che gli utenti automaticamente ' Ingresso finisce semplicemente se si invia un formare in un file con estensione. php su un web server, come l'apparecchio. Ma vediamo brevemente _COOKIE $ E $ _SESSION. 

In parole povere, che cosa è un cookie come lo si capisce nel contesto di utilizzando il web? 

AUDIENCE: file sul computer. 

DAVID MALAN: Già. Si tratta di un file sul computer dell'utente piantato da qualunque sito vi capita di visitare. Quindi, quando si va a Facebook, quando si va a bankofamerica.com, quando si va a google.com, quando si va a quasi tutta la sito web nel mondo in questi giorni, compreso cs50.net, un cookie è piantato sul vostro computer, che è sia un valore memorizzato nella RAM del vostro computer nella memoria del browser, o talvolta effettivamente un file memorizzato sul disco rigido. 

E ciò che è di solito memorizzato in quel file non è il tuo nome utente, non il tuo la password, in genere non è qualcosa sensibili a meno che il sito non è così buona con la loro sicurezza, ma piuttosto è un grande identificatore unico tra altre cose. E 'un grande numero casuale piantato sul vostro computer, ma si può pensare come una sorta di mano virtuale bollo come da un club o qualche parco divertimenti che consente al personale, i proprietari di quella servizio, per ricordare chi sei. Quindi se il numero casuale è grande come 12345678, anche se questo è ovviamente non troppo casuale, pensare a questo come il timbro mano che quando si visita facebook.com per la prima volta, timbro che il numero sulla vostra mano. E allora perché si parla HTTP, è essendo un browser, e perché Facebook ovviamente parla lo stesso di un sito server, il protocollo HTTP dice che in qualsiasi momento successivamente visita facebook.com, che si tratti di un secondo più tardi, un'ora più tardi, anche il giorno dopo, fino a quando si dispone di non esplicitamente disconnesso, che di fatto è come lavare le mani. HTTP dice che si dovrebbe presentare il timbro a mano ogni volta che si tornare a quel sito. 

Cosa Facebook poi non è che guardare quel timbro mano e dicono, oh, 123456789. Non so a prima vista che questa è David Malan a Cambridge, Massachusetts, ma possono controllare la loro banca dati e dire, oh, la persona sul cui computer abbiamo piantato 123456789 è David Malan da Cambridge, Massachusetts. Facciamo vedere che l'utente poi il suo profilo pagina o il suo News Feed. 

Ma c'è un problema qui se questo Ecco come il web funziona davvero. Diamo un'occhiata a un esempio veloce. Andiamo in realtà andare a dire facebook.com. Ma prima che potessimo andarci, lasciare andare avanti e di aprire Chrome Ispettore qui. Fammi vedere la scheda di rete. E ora andiamo avanti e digitare in https://facebook.com. E io sto facendo in modo che non vediamo tutti questi reindirizzamenti e rifiuti tempo guardando attraverso quelli. Lasciami entrare colpito. 

Bene. Vediamo un sacco di richieste. Arriva Facebook. C'è un intero gruppo di file. E qui, per la mia menzione di la latenza ultima volta, che è un sacco di richieste HTTP. Ma il primo è probabilmente il più interessante. 

Quindi cerchiamo di scorrere verso il basso qui, e Io lo zoom in un secondo. Questo sta per essere una sorta di un pasticcio, ma vediamo. Facebook ci sta inviando un sacco di roba. 

Ma ehi, interessante. Stanno piantando non uno, ma quattro Stamp mano sul mia mano qui. Set-Cookie, Set-Cookie, set-biscotto, Set-Cookie. E ci sono alcune caratteristiche qui. Tutti loro citare alcuni tipo di scadenza. E sembra che Facebook si spera per ricordare me fino al 2015. Ecco, questo è probabilmente il momento in cui Devo uscire o faranno solo Presumo automaticamente Sono non tornare. Ecco, questo è in realtà un dignitoso quantità di tempo. 

E ci sono alcuni altri cosa sta succedendo qui. Questo cookie sembra essere forzatamente cancellato dallo dicendo che è scaduto nel 1970 prima esistevano i cookie. Così il browser è solo andare assumere OK, è come lavaggio del timbro mani. 

Ma ora, quando il browser fa una successiva richiesta - mi permetta di andare avanti e fare questo ancora e reload. Ora vorrei scorrere alla top richiesta e scendere qui, intestazioni di richiesta. Notare questo. Così ora sono sotto non intestazioni di risposta, ma notate che dice intestazioni di richiesta. E notare che il mio browser come parte di la sua richiesta dopo aver colpito reload ha inviato almeno le seguenti informazioni. Non impostato-biscotto, ma biscotto. Quindi questa è la linea, l'intestazione HTTP così a parlare, dove il mio browser è una sorta della mia insaputa presentazione la mia mano per l'ispezione di Facebook. 

Così questi cookie possono essere utilizzato poi per cosa? Per ricordare chi sei, o ricordare come molte volte ci sei stato, o davvero nulla. 

Così qui è counter.php. E mi permetta di ingrandire il font. E ogni volta che mi ricarica questa pagina, avviso sta ricordando quante volte Io ci sono stato. Beh, non è tutto così impressionante. Diciamo solo chiudere quella scheda, e ora torniamo a http://localhost/counter.php. 

Oh, questo è interessante. Si ricordava ancora, anche anche se ho chiuso la scheda. E francamente, se chiudo il browser, se attuata nel modo giusto, io potrebbe ancora ricordare che questo utente sia che lui o lei era la prima volta, e solo una volta che vado nel menu di Chrome, che qui è qui, e andare a Storia, e fare clic su Cancella dati di navigazione, come alcuni di voi potrebbero avere in passato, solo allora i cookie in realtà l'eliminazione nel corso web sviluppo. 

Quindi, se andiamo - cerchiamo di close up gedit qui. E se andiamo ora a questo file. Lasciami andare nel nostro vhosts / localhost / pubblico, e lasciami fare counter.php. Si noti che questo è un bel semplice programma. E 'un sito molto semplice. 

Così all'inizio del file è solo commenti. Ma ecco una nuova linea che si può hanno visto già in p-set di sette, session_start (). Questa è una riga di codice PHP che dice in sostanza il server web, rendono Assicurati di timbrare le mani e fare Assicuratevi di controllare francobolli mano. Questo è tutto ciò che la linea fa, e fa tutto questo processo per noi. Poi accorgo che ho appena ricevuto due rami qui. Se la chiave del contatore interno di questo speciale variabile globale chiamata $ _SESSION È impostato - in altre parole, se c'è qualche valore lì - andiamo e conservarla in un locale variabile denominata $ contatore. Altrimenti, si assegni $ contatore il valore predefinito di 0. 

Ora qui è un aspetto di PHP che è sia una benedizione e una maledizione. PHP è un po 'sciatta. Così, mentre in C, quale sarebbe la campo di applicazione del contatore sono stati o qui o qui? 

Sarebbe stato confinato a quelle parentesi graffe. Indovinate un po? In PHP, esiste anche al di fuori di quelle parentesi graffe, qui, e qui, e qui, e qui, e anche in basso. Allora io dico questo è una benedizione, nel senso che non si deve pensare come duro come abbiamo fatto settimane fa. Ma è anche un po 'una maledizione che non importa dove si utilizza una variabile in PHP, almeno in un programma come questo, è accessibile a livello globale per meglio o in peggio. Quindi bisogna tenere a mente ora che le variabili non possono essere undefined. Potreste averli definiti altrove. 

Ma cosa sto andando a fare in definitiva? Ho intenzione di memorizzare all'interno di quella globale variabile come valore del contatore a chiave il risultato di facendo contatore più 1. Quindi questo è solo l'aritmetica che fa il Incremento di quel contatore. E il fatto che sto memorizzazione che Valore tornare qui significa per aggiornare il database essenzialmente a ricordate che 123456789 utente è stato qui due volte. E quando lo faccio di nuovo la prossima volta che ricaricare la pagina, è andare a controllare il mio timbro di mano e dire, oh, 123456789 utente ora stati qui tre volte. 

E così quello che PHP e linguaggi simili stanno facendo per noi è che stanno capire come e dove e per quanto tempo memorizzare i valori in questo speciale superglobale. E questo superglobale la prossima volta che visitare la pagina è una specie di magia pre-popolato, pieno di valori che c'erano l'ultima volta che hai visitato, se era un secondo fa, una settimana fa, o nel 2013 e ora stiamo parlando circa 2015. PHP e il prendersi cura server web di tutto questo per voi. 

AUDIENCE: [incomprensibile]. 

DAVID MALAN: Le variabili in PHP sono in sostanza, sempre a livello mondiale a meno che non dichiararle all'interno di una funzione, e poi sono locali rispetto a solo la funzione. Ma perché io non ho scritto alcun funzioni, sono ora effettivamente globale in tutto il mio file qui. 

AUDIENCE: C'è un modo per renderli locale? 

DAVID MALAN: C'è qualche modo per farli locale? Solo avvolgendoli in funzioni. Che nella sua ultima versione di PHP, si può fare questo con una funzione anonima. Ma più che nella contesto di JavaScript. Ma la risposta breve è no. Una risposta è più sì. Nizza. Buona domanda quiz. Bene. 

Così, infine, la pagina stessa è in realtà piuttosto semplice. Si noti che una volta che esco modalità PHP, richiamo che tutto questo roba giù di seguito è solo andando a farsi sputare Crudo al browser. Il che va bene, perché io voglio inviare all'utente un codice HTML, ma voglio per aggiornare dinamicamente che l'HTML. E un modo per farlo è quello di ordinare di diminuire molto rapidamente indietro in PHP modalità, l'uso staffa aperto il punto interrogativo segno di uguale, e poi l'uscita il valore di contro. 

Oppure, se questo sembra un po 'criptico, questo segno di uguale è in realtà solo alcuni zucchero sintattico per questo printf ($ contatore). Ma francamente, questo è solo un po 'brutto e un po 'fastidioso per digitare. Così PHP offre molto bene questa caratteristica dove si può solo dire più succintamente nello stesso modo. 

Allora, cosa sta succedendo sotto il cofano? Diamo un'occhiata rapida alla rete scheda qui per counter.php. E lasciatemi andare avanti e prima cerchiamo di chiarire i cookie. Facciamo Cancella dati di navigazione da l'inizio del tempo. Ora torniamo qui. Ora cerchiamo di ricaricare la pagina. E sono di nuovo a zero. Perché il mio timbro di mano è stato lavato, Io ora ottenere un nuovo cookie. 

Infatti, se guardo la scheda di rete e guardare intestazioni di risposta, l'avviso che l'apparecchio mi manda un cookie il cui nome è un po ' arbitrariamente, ma tipo di ragionevolmente, PHPSESSID. E mi sta mandando davvero grande numero casuale. Non è un bel numero. Non è esadecimale abbastanza. E 'una sorta di stringa alfanumerica, ma presumibilmente è casuale. E questo è il timbro mano in modo da Parlo che mi riferisco a. 

Nel frattempo, se clicco reload e poi guardare a questa seconda linea per il mio secondo richiesta, avviso, ora che la mia richiesta intestazioni includono PHPSESSID uguale a questo, Non set-biscotto, ma solo biscotto. E questa è la presentazione del mio browser del mio timbro mano. 

Quindi, ora come un teaser, e parleremo più su questo in una settimana o giù di lì, ma in che modo questo si fa vulnerabile, il tuo account Facebook vulnerabile, e di altri come conti vulnerabile? 

AUDIENCE: Se qualcuno ha il cookie. 

DAVID MALAN: Sì, se qualcuno ha il cookie. Voglio dire veramente, proprio come alcuni di voi potrebbe aver provato a come un club o di un parco divertimenti, se si cerca qualcosa come questo per copiare il timbro, anche se indietro sulla mano di un'altra persona, e poi lui o lei presenta come loro, se effettivamente ha un aspetto identico, 123456789, allora il web server è apparentemente solo andare a fiducia che l'utente è si. 

E questo è davvero un fondamentale minaccia ogni volta che si utilizza cookie perché se qualcuno falsifica così da parla il cookie, figure di cosa si è, sia veramente copiandolo cercando al computer ed essendo simili, OK. Biscotto di David è JJ3JIK e così via, e poi sono abbastanza intelligente da sapere come una sorta di inviare manualmente che cookie di un browser o da un programma scrivono, che potevano totalmente accedere a un sito web come te. Non è così difficile far finta di essere qualcun altro a meno che non rivisitare p-set due, che ha introdotto quello che? 

AUDIENCE: Crittografia. 

DAVID MALAN: Un po ' bit di crittografia. Semplice crittografia, almeno nella edizione standard, ma crypto comunque. meno. Così si scopre se si crittografa tutti queste intestazioni con qualcosa che si potrebbe ora conoscere più familiarmente come SSL, secure socket layer, o https:// URL, allora tutte queste cose che abbiamo guardando sono in realtà crittografata, il che significa che è come te non può leggere il timbro mano. Solo facebook.com può, o google.com, o in questo caso, l'apparecchio può leggere quel timbro di mano. 

Tragicamente, però, e di nuovo, questo è troppo appropriata con la roba NSA negli ultimi tempi, anche SSL è fragile. E in realtà non è così difficile per rompere anche quello di crittografia. Non tanto per rompere la cifratura, ma ingannando il il browser in decrittografia i dati prematuramente. Ma ancora una volta, ci prendono in giro voi con che tra non molto. Per ora, basta avere paura. E 'tragicamente sorta di vero. 

Bene. Allora, da dove viene questo ora ci lascia? Bene, facciamolo. Andiamo avanti e dare un rapido occhiolino prima di prendere una pausa. E penso che ci soffermiamo un po 'di più oggi, ma stiamo andando a tuffarsi qualcosa di nuovo e sexy, che sarà stuzzicare il vostro appetito per ancora di più. Ecco, questo è il teaser. 

Così SQL, abbiamo iniziato a parlare mai così brevemente l'ultima volta. Si può davvero mettere le mani sporche con alcuni di essi in p-set sette. E in termini profani, che cosa SQL - S-Q-L - fare per voi? Che cos'è? Già. 

AUDIENCE: Diamo i tuoi dati di accesso. 

DAVID MALAN: Già. E ti permette di dati di accesso in un database. Structured Query Language. E questo è essenzialmente un linguaggio di programmazione. Ci sono caratteristiche di esso che non useremo anche in classe. Ma si può efficacemente definire le funzioni. Si chiamano stored procedure in SQL. Ma noi terremo abbastanza semplice e basta usare per alcune operazioni di base come la selezione dei dati, inserimento dati, aggiornamento dei dati, e l'eliminazione di dati. 

E si può davvero pensare di un database, come un database SQL, come appena essendo Microsoft Excel. Poiché SQL si riferisce ad una relazionale database, in cui relazione significa solo tabelle. Righe e colonne. Quindi tutto si può mettere in un foglio di calcolo come questo o Google Docs, si potrebbe mettere in un database SQL dichiarando un tavolo. 

Ora, come si fa effettivamente accedere queste informazioni? Beh, con i comandi o domande come questa. SELECT, INSERT, UPDATE e DELETE. E per la maggior parte, questi sono l' quattro solo ingredienti avrete bisogno di fare qualcosa di molto potente in problema di set sette. 

Ora torna in giornata, si sarebbe in realtà interagire con un database in un finestra di terminale in bianco e nero a un prompt lampeggiante come questo. E il database che stiamo in esecuzione sulla apparecchio è chiamato MySQL, che è motore libero e open database di origine. Se Google e leggere la Wikipedia articolo, saprete che il nome è un bit di transizione per alcuni versioni di Linux. Database di Maria è in realtà un forchetta per così dire di MySQL. 

Lunga storia breve, Oracle ha acquistato MySQL. Oracle è una grande azienda. Persone sono state preoccupato che sarebbe più rimanere piuttosto come open source, quindi questa è solo una copia di MySQL che è ancora libero, ancora open source, e installato in Fedora Linux di default. 

Ma questa è una specie di dolore in collo per fare la conoscenza con un database in questo modo. Quindi includiamo nel dell'apparecchio CS50 uno strumento open source gratuito chiamato phpMyAdmin. Solo una coincidenza che è scritto in PHP. Non c'è fondamentali necessità di PHP qui. Ma questo è solo uno strumento web-based che abbiamo scaricato gratuitamente, installato in l'apparecchio, che ci permette di avere un interfaccia grafica utente con cui per esplorare il database di sette p-set con cui creare nuovi database, dire per il proprio progetto finale se vuoi come, e, infine, creare siti web dinamici come CS50 Finanza che consentono di interrogare i dati e aggiornare i dati in modo dinamico. 

Tu non stai andando ad avere per utilizzare solo un semplice file di testo o CSV. Si può effettivamente utilizzare un database intelligente programma in modo che è possibile eseguire più query sofisticati che solo la lettura attraverso tutto lineare. 

Così, per esempio, questo è ciò che diamo fuori dalla scatola per p-set sette. Questa è una tabella con almeno apparentemente tre colonne, una delle quali è username, uno dei quali è hash, e l'altro dei quali è ID. 

Ma la cosa interessante, e solo per prendere in giro un pensiero qui, il nome utente è presumibilmente già unico, giusto? Voglio dire, la maggior parte qualsiasi sito web, se si dispone di un nome utente, vi non può essere di due Cesari. Non ci possono essere due malans. Non ci possono essere due jharvards. Il suo unico. In caso contrario, non sanno che jharvard che effettivamente è. Quindi, quale potrebbe essere la motivazione per anche avente una terza colonna di sinistra ci chiama ID, che sembra un numero che è parimenti unico? Ci si sente un po 'ridondante a me a prima vista. Perché potrebbe essere interessante avere non solo nomi utente unici, ma anche i numeri unici? 

AUDIENCE: Avrebbero potuto la stessa password. 

DAVID MALAN: La gente potrebbe avere la stessa password, certo. Che potrebbe assolutamente succedere. Ma se hanno questo nome utente unica, mi sosterrebbero che che in realtà non importa, perché se si digita nella loro username, ho solo bisogno di controllare la loro la password, il loro hash della stessa. Per quale altro motivo? 

AUDIENCE: Più veloce la ricerca. 

DAVID MALAN: più veloce la ricerca. Perché? 

PUBBLICO: ID è solo uno. 

DAVID MALAN: ID è solo un personaggio, o per essere più precisi, si tratta di un numero, quindi è probabilmente 32 bit o qualcosa di simile. Considerando che il nome, a quanto pare Jason Up di Hirschhorn c'è una sorta di assurdamente lunghi, e sta andando a mi vorrà molto più tempo per stringa confronta H-I-R-S-C-H-H-O-R-N, e forse un qualcosa / 0 o simile, al fine di per cercare Jason, piuttosto che semplicemente dicendo: dammi il numero due utenti. Questo è 32 bit. Si tratta di un unico INT che si deve confrontare. E in effetti, questo è esattamente il motivo per cui i database tendono ad assegnare gli ID univoci per righe in loro. 

Ora, ciò che altri tipi di dati ci sono oltre INT e apparentemente stringhe come questo? Ebbene, per essere più corretto, Database SQL, come MySQL, hanno campi CHAR. E salmerini un po 'fuorviante non è un singolo carattere. Un campo CHAR in un database MySQL è uno o più caratteri, ma è un numero fisso di caratteri. 

Così, per esempio, se vado verso phpMyAdmin come si può avere già, o presto sarà un problema di set di sette, e vado a mio database, e solo per divertimento, creiamo una nuova tabella denominata prova con solo due colonne. Io quindi fare clic su Go. E questo diventerà abbastanza familiarità, soprattutto come si armeggiare in giro da soli. Qui potrei digitare ID per creare una nuova tabella di tipo INT. Ma qui potrei digitare nome utente ricreare quel tavolo precedenza. E notare ho un sacco di tipi tra cui scegliere. 

E anche questo è il motivo per cui phpMyAdmin è una specie di piacevole. È una specie di auto-apprendimento in che può solo tipo di punto e scegliere, e guardare i menu a discesa, e dedurre da che ciò che i poteri SQL ti dà. 

E in effetti, se scelgo CAR, ho poi necessario specificare la lunghezza, o come tanti valori, quanti caratteri. Valori in modo molto comuni sono cose come 255, ma questo è un po 'lungo. Comunemente è otto per un nome utente. Ma questo è un po 'piccola in questi giorni. Quindi questa è una decisione di progettazione. E 'di 8 caratteri max, 32, 255, 1000? E 'davvero a te. Ma un campo CHAR è un numero fisso. In modo da scegliere troppo pochi e sei specie di avvitato se volete un nome utente più lungo. Scegli troppi e ciò che è il rovescio della medaglia? 

AUDIENCE: [incomprensibile]. 

DAVID MALAN: E 'uno spreco. Proprio come in C, se si dispone di un grande pezzo di memoria di cui avete bisogno, sei basta perdere tempo e spreco di spazio. Così come alternativa, esiste VARCHAR, che risolve questo problema trattare lunghezza non come una lunghezza fissa, bensì come una lunghezza massima e utilizzando un numero variabile di caratteri, che poi tende ad utilizzare solo come molti CHARs come si effettivamente bisogno. Che suona perfetto. 

Perché non ci liberiamo del Tipo allora i dati CHAR? Quale potrebbe essere il rovescio della medaglia utilizzando VARCHAR, che suona come se fosse una bella vittoria? Sì? 

AUDIENCE: [incomprensibile]. 

DAVID MALAN: OK, bene. Quindi, se tutti i dati è la stessa lunghezza, qual è la preoccupazione? 

AUDIENCE: Perché stai sprecando dati da parte di tutti dicendo. 

DAVID MALAN: Quindi, se tutti i dati sono la stessa lunghezza, però, mi sosterrebbe che specifica una lunghezza massima su VARCHAR non è diverso da specificando una lunghezza fissa su se CHAR si sa che il numero in anticipo. Ma c'è davvero, e io sorta di estrarre da quella risposta realtà che c'è ancora un max, che potrebbe essere fastidioso, soprattutto se si incontrare il nome di una persona che è insolitamente lungo che non hai fatto anticipare. Ed è anche un po 'meno efficiente per cercare in realtà su VARCHAR come al contrario di CHARs ricerca, in particolare per lunghi tavoli che hanno un sacco e grandi quantità di dati. Quindi anche qui, tematica è di nuovo scelta ovvia. 

Quindi, solo per dare un senso di altri tipi di dati che potrebbero essere di interesse sia per p-set sette o in il futuro, c'è INT. C'è BIGINT, che è come long long. Essa tende ad essere di 64 bit. C'è DECIMAL, che vedrete in il set problema, che è una molto risposta più pulito per i problemi che abbiamo incontrato con galleggiante e galleggianti punto imprecisione. E poi c'è DATETIME. C'è letteralmente un tipo di dati che ha a guardare come un anno, un mese, un giorno, e ora, minuto e secondo. 

Ma database SQL hanno anche cose che chiameremo indici. E un indice è qualcosa che si specificare al momento della creazione della tabella di effettuare ricerche e altre operazioni più efficiente. In particolare, c'è qualcosa che si chiama l'indice PRIMARY che si potrebbe dichiarare quanto segue. 

Abbiamo fatto questo per voi con l' Tavolo utenti vi diamo. Ma notare se fossi ricreare manualmente la tabella utenti qui dando un nome di utenti. Ho già specificato ID. Ho specificato INT. Ho specificato il nome utente con massimo 32 caratteri. Ma se continuare a scorrere in questo abbastanza ampia finestra, avviso c'è un mucchio di altre cose che posso specificare. 

Uno, posso specificare attributi come, sai cosa, questa INT dovrebbe essere UNSIGNED. Non voglio che i numeri negativi, quindi cerchiamo di renderlo UNSIGNED. Null non è pertinente perché Io voglio che ogni utente avere un numero univoco. Io non voglio che sia nullo. 

Ma questo è interessante. Posso specificare che ID è o il chiave primaria di questo database, o è unico, o è indicizzato, o il testo integrale. Così, per scopi di oggi, lunga storia Insomma, PRIMARY significa che questo deve essere sia concettualmente e tecnicamente il campo che usiamo per univocamente identificare gli utenti. 

Così, quando guardiamo gli utenti, questa è una sorta di una promessa di guardare in su per lo più da tale identificatore univoco. E il database in modo che se si disporre di un numero utente 3, non è possibile inserire fisicamente un altro utente con lo stesso numero 3. Il database sarà solo rifiuta per salvare le modifiche. Che è una buona cosa, perché si può proteggersi da te stesso. se stesso 

In alternativa, per il nome utente. Quindi la seconda fila, richiamo, è il campo nome utente. Quindi la seconda fila: ecco il nome utente, come abbiamo fatto in fondo lasciato lì. 

Quindi, che cosa potrei voler specificare? Non mi è permesso, secondo SQL, per specificare due chiavi primarie. è possibile specificare una chiave comune in cui si guardare entrambi i campi, ma non possono singolarmente chiavi primarie. Ecco, questo è fuori discussione. Così che potrei desiderare di scegliere? 

Beh, UNIQUE è simile nello spirito a una chiave primaria dove si specifica questo campo deve essere unico, ma è non andare a essere quello Io uso per tutto il tempo. E noi non stiamo andando a utilizzare questo tutti il tempo per quale motivo ancora? E 'più lento potenzialmente se è un lungo nome utente. E 'solo una perdita di tempo. 

INDEX, intanto, precisa che si tratta di non intenzione di essere unico, ma mi piacerebbe di lavorare la tua magia sotto la Cappa per renderlo più veloce per me ricerca su questo campo. Quindi, questo probabilmente non è pertinente. Per il nome utente, direi che UNIQUE è una buona risposta. Ma supponiamo che abbiamo fatto gli utenti più interessante non solo nomi utente, hash e numeri di identificazione. Che cosa succede se abbiamo dato i nomi di persone? Che cosa succede se abbiamo dato loro indirizzi e altri dati su di loro? 

Beh, se si specifica che una colonna in un database è indicizzato, il che significa che MySQL o Oracle, o qualsiasi altra cosa di database si sta utilizzando, dovrebbe funzionare la sua magia e utilizzare un qualche tipo di dati di fantasia struttura come un albero, o un trie, o un hash table, o qualcosa di garantire che quando si cerca di dati utilizzando selezionate da quel particolare settore - come me dimostrare a tutti che vive a Oxford Street. Una query del genere. Se è stato specificato in anticipo che volete un indice su quel campo, la le ricerche saranno molto, molto più veloce. 

Se non si specifica un indice, il migliore si può fare è una ricerca lineare, se non è risolto. Ma se viene specificato INDEX, la smart gente che ha fatto il database - persone come voi che ora conoscono alberi e paesi e tabelle hash - costruirà automaticamente tali dati struttura in RAM per assicurarsi che queste ricerche sono molto più veloci. 

FULLTEXT nel frattempo è simile nello spirito, ma ti permette di fare jolly ricerche, come me, mostrano a tutti che vive a strade che iniziano con la lettera O per qualunque motivo. È possibile effettuare ricerche con caratteri jolly così. Oppure, le cose più interessanti, come mostra me tutti coloro che hanno la parola - Mi mostrare a tutti il ​​cui nome inizia con una particolare lettera. È possibile cercare per parole chiave in questo modo. Bene. 

Così, opportunità di design Ci potenzialmente. Ci sono altri che io onda mie mani. Si scopre che si può avere diversi motori di archiviazione. E questo è più arcano di cui abbiamo bisogno certamente per un problema impostato sette. Per impostazione predefinita, voi ragazzi state usando qualcosa chiamato InnoDB. Vedrete menzione di questo da qualche parte in L'interfaccia di phpMyAdmin più probabile. Ma sapere che ci sono altri design decisioni che sono di potenziale interesse vieni progetti finali se fai qualcosa di web-based. 

Ma facciamolo. Andiamo avanti e mettere questo sul schermo come un teaser per una storia coinvolgendo voi, un compagno di stanza, e un bicchiere di latte. Facciamo un due minuti o così rompere qui. E se si può attaccare in giro, veniamo indietro, guardare un po 'più a SQL, e poi un po 'di JavaScript con p-set di otto in mente. 

Bene. Quindi, cerchiamo di farti pensare a una caso d'angolo che può facilmente verificarsi nel contesto di utilizzo di un database, o francamente, anche con le cose del mondo reale come bancomat per ottenere denaro. Quindi, ecco un frigorifero. Supponiamo hai uno anche in dormitorio o la vostra casa. E hai un compagno di stanza, ed entrambi vi piace il latte, per esempio. 

Così si arriva a casa dalla classe un giorno. Lui o lei non è ancora indietro. Si apre il frigorifero. Si vuole veramente un grande bicchiere di latte. Non c'è latte. Allora cosa fai? Si chiude il frigorifero. Si afferra le chiavi. Si va verso la piazza. E si ottiene in fila al CVS a quelli cose di self-checkout, che sempre richiedere più tempo effettivamente avendo cassieri. Comunque. 

Allora, nel frattempo, punto punto punto, il vostro compagno di stanza torna a casa e lui o lei ha parimenti un desiderio per il latte. Così lui o lei apre il frigo, guarda dentro, e oh, accidenti. Nessuna latte. Così lui o lei dirige, capita di andare all'altra CVS, che era solo un bloccare la via per qualche ragione, e lui o lei si mette in fila per comprare il latte. 

Nel frattempo, torni a casa, lui o lei torna a casa, e cosa fare che in ultima analisi ha? Il latte due volte tanto. Ma non ti piace davvero latte tanto. Così ora avete così tanto latte che ormai uno di loro è solo per andare acida alla fine. Quindi questo è un problema davvero male. Giusto? 

Allora cosa è successo? Quindi, fondamentalmente, questo è una specie di un esempio ridicolo. Ma sotto il cofano, quello che abbiamo avuto accadere ecco entrambi controllati lo stato di qualche pezzo di memoria, il frigorifero. Entrambi si verificato lo stato di alcune variabili. Entrambi disegnato una conclusione che poi agito su. Ma, purtroppo, il tuo compagno di stanza era al negozio, lo stato di quel variabile cambiato, lui o lei è tornato e ora vuole cambiare lo stato, ma è già stato cambiato su di lui o di lei. E, naturalmente, lui o lei non avrebbe andato al negozio se sapessero che tu eri già in rotta. 

Così, nel mondo reale, come hai potuto evitare questo problema, a patto di avere un frigorifero, hai un compagno di stanza, e in realtà piace il latte? 

AUDIENCE: Comunicare. 

DAVID MALAN: Comunicare. OK. Ma come si potrebbe comunicare? 

AUDIENCE: lasciare una nota. 

DAVID MALAN: lasciare una nota, giusto? Lasciare sempre una nota, per fan dello show. Va bene, quindi lasciare sempre una nota, o mettere veramente come un lucchetto o qualcosa sul frigorifero che mantiene il vostro compagno di stanza di ispezionare lo stato di quella variabile. 

Ora, perché questo potrebbe essere pertinente problema insieme sette, o di sportelli automatici. Bene, immaginate un mondo in un bancomat dove si potrebbe essere in grado di andare fino a un bancomat macchina qui, e un altro bancomat qui. E questo accade abbastanza spesso. E supponi di avere due carte bancomat, che è possibile ottenere. E si accede a entrambe le macchine efficacemente contemporaneamente, si spera mentre nessuno sta guardando. E poi si digita il PIN approssimativamente simultaneamente. E allora che fai una query equilibrio per vedere quanti soldi hai. E diciamo che hai 100 $ lasciato nel tuo account. Quindi, in sostanza allo stesso tempo, è dire uno, zero, zero, immettere. E si spera torni un po 'di soldi. 

Ma quanti soldi potreste tornare indietro? Ora i computer alla fine della giornata, soprattutto se si sta parlando di server, non necessariamente fanno cose secondo l'ordine che è previsto. 

Così supporre che succede, a causa di qualunque problemi di velocità della rete non sono, o problemi di CPU ci sono, o qualcosa di simile, si supponga che il primo ATM controlla il vostro equilibrio e vede, oh, questa persona ha $ 100. Ma poi si distrae perché forse un backup sta accadendo e quindi è rallentamento. O forse durante il controllo, la rete connessione ha un po 'più lento, perché questo accade solo. Sono dispositivi fisici. Così nel frattempo, il secondo è ATM la stessa domanda. Quanto guadagna David ha? $ 100 è la risposta. Ma perché il primo ATM non è ancora inviato il messaggio sottrarre $ 100, sia ATM hanno ispezionato caveau della banca, vedendo c'è $ 100 lì, e ora entrambe le macchine potenzialmente sono andando a sputare una risposta. 

Ora, questo è grande per voi in un certo senso se ciò che la banca non definitiva è modificare la quantità di meno 100 da impostare la variabile pari al conto corrente uguale a 0, in contrapposizione a fare meno 100. Ora, nel caso peggiore per la banca - o nella migliore per la banca, nel frattempo, ti danno $ 200, e il vostro conto in banca ora mostra negativo $ 100, che in realtà non ti beneficio a tutti. Ma il punto è che questa gara condizione per ottenere due compagni di stanza latte, o per due bancomat cercando di ottenere denaro contante e cambiare lo stato di un classificatore Allo stesso tempo esiste alcuna volta che si dispone di un database. 

Ora nel problema impostare sette, questo problema si pone, nel senso che se si acquista un Condividi su Facebook magazzino, e poi per esempio si acquista una seconda quota di Facebook magazzino, è necessario fare una decisione come programmatore. Per decidere come aggiornare il banca dati, le vincite sono state andando avere una riga per quello stock, e questo è un modo per attuarla. E si sta andando ad avere una azione della FB, che è il loro simbolo ticker per questo nome utente, o di questo utente ID, l'identificativo unico. 

Ma la stessa storia può succedere qui. Se un prescelto in SQL, come si vedrà nel problema di impostare sette quando si vede, oh, David ha una sola di Facebook magazzino. Permettetemi ora di cambiare questo di essere due parti, perché vuole comprare un seconda quota. Ma supponiamo che David in realtà aveva due finestre del browser aperte, o supporre che si tratta di un conto cointestato con due coniugi, ed entrambi stanno cercando di eseguire la stessa operazione, anche lì, la potenziale esiste per una decisione di essere fatta sulla base della precedente stato del mondo - l'account dispone di una azione - ed entrambe le persone, o entrambi i server, ora provare a dire incrementarlo a due parti. Ma in questo caso, potrebbe essere addebitato me i soldi per entrambe le parti, ma incrementato solo quella volta. 

Così, in breve, il problema fondamentale qui, come con la battuta di lasciare un nota, o di mettere un lucchetto su di esso, è se due persone, o due threads - ripensare a graffiare - può ispezionare lo stato di alcune variabili e poi cercare di cambiare questa variabile, ma queste due cose non accadono in stesso tempo, ma possono ottenere interrotto da altre cose accadendo, i dati possono entrare in uno stato molto strano. E si può beneficiare o si può soffrire nel senso dell'esempio denaro. 

Così nel problema insieme sette, vi diamo questa riga di codice, che lungo storia breve, risolve questo problema in MySQL. Questo molto lunga istruzione che non anche inserirle in un unico linea sulla schermata qui assicura che il funzionamento è ciò che è chiamato atomica. Succede tutto in una volta, o non succede a tutti. Questa frase molto lunga non può ottenere interrotto parzialmente. 

E ciò che fa è letteralmente quello che dice. Inserire in qualche tabella seguente tre campi di quei valori specifici, ma sulla chiave duplicata, non fare un inserto. Fare un aggiornamento. Quindi questo è come fare una SELECT e un INSERISCI così dire, allo stesso tempo. E qual è la chiave che probabilmente è stata sottoposta a qui? 

Si scopre, e vedrete questo problema set spec sette di, perché abbiamo dichiarato che ci sia una chiave univoca su questa particolare tabella tale che Non è possibile avere più righe per lo stesso utente con l' penny stesso simbolo azionario - in questo esempio qui, è DVN.V una penny stock stupido che abbiamo fare riferimento nelle specifiche. Perché abbiamo dichiarato di essere unico, ciò significa che se si tenta di inserire una riga duplicata, sei invece di andare ad aggiornare senza chiunque altro avere la possibilità di cambiare lo stato del mondo sia. Così, in breve, questo assicura le cose sono atomiche. 

Più in generale, però, i database come MySQL - e non hai bisogno di questa caratteristica per p-set di sette, ma tenerlo in mente per il futuro - sostenere quelli che vengono chiamati transazioni, dove si può dire Avviare la transazione letteralmente. È quindi possibile eseguire due istruzioni SQL. E un'istruzione SQL, come si vedrà in p-set di sette, sembra un po ' qualcosa di simile. Aggiornare una tabella denominata account. Impostare la colonna saldo pari a qualsiasi la colonna saldo attualmente è meno 1.000 dove il numero, la numero di conto, come l'ID utente, uguale a 2, e quindi aggiornare conto dot dot dot. 

Quindi, in parole povere, che cosa fanno questi due query sembrano fare in vero senso del mondo bancario? 

PUBBLICO: Trasferimento al risparmio. 

DAVID MALAN: Esattamente. Trasferimento di fondi da un conto all'altro. E questo è un altro esempio in cui si vuole veramente queste due cose accadano o non accadere. Se non si desidera qualcosa per ottenere in mezzo a loro e potenzialmente rovinare la matematica, o rovinare quanto soldi che hai, o quanto soldi la banca ha. Così che cosa è veramente bello sulle transazioni in MySQL è che, e database più in generale, è che e le persone intelligenti che hanno implementato queste caratteristiche capire come fare Assicurarsi che entrambe queste cose accadono o per niente. 

E se siete veramente aspirano a fare un sito web che viene usato da persone su campus, le persone nel mondo reale, facendo qualcosa nel senso di avvio, questi sono i tipi di decisioni di progettazione che diventare sempre così importante. In caso contrario, si inizia a perdere i dati, perdere utenti, o nel caso peggiore come abbiamo visto qui, potenzialmente perdere denaro. Quindi, di nuovo, più che nel set problema sette, e forse per alcuni si in progetti finali. 

Quindi cerchiamo di cambiare quella foto che abbiamo avuto un momento fa solo in un altro modo. Così mi permetta effettivamente vedere se posso - no, quello è andato. Eccolo. 

Quindi questo è dove abbiamo lasciato l'ultima volta. E si scopre che andremo a lanciare una cosa nel mix qui - un linguaggio chiamato JavaScript. Così JavaScript realtà si adatta in questo pezzo - e non ho abbastanza lasciare spazio sufficiente, quindi questo non è ora in scala. OK, questo è davvero patetico. OK, così che è JavaScript. Bene. Sto davvero facendo un cattivo servizio. Bene. 

Così JavaScript è un'altra programmazione lingua, e la nostra ultima, se questo aiuta rassicurare che non c'è molto di più degli idranti qui. Così JavaScript è anche interpretato linguaggio, il che significa che non lo fanno compilarlo in zeri e uno. Basta eseguirlo. Ma cosa c'è di fondamentalmente diverso con JavaScript solito è che si non eseguirlo sul vostro server web. Esso non viene eseguito nella apparecchio per sé. Piuttosto, esso viene scaricato da un utente via HTTP nel browser - Chrome, Safari, Internet Explorer, Firefox, qualunque sia - ed è il browser che esegue questo particolare linguaggio di programmazione. 

Quindi, per essere chiari, PHP finora è stato eseguito sia a riga di comando in la nostra finestra in bianco e nero, su un server come l'apparecchio, un computer come l'apparecchio, o è stato eseguito da un server web esecuzione su un computer. Ma il tema qui è che PHP finora è stato eseguito sul lato server, così l'utente e browser dell'utente non vede mai una riga di codice PHP. 

Infatti, se avete mai aperto un browser per il tuo sito web o in un altro e effettivamente vedere il codice PHP nella finestra, qualcuno ha avvitato. Perché non è destinata ad essere inviato direttamente a un browser. Si suppone che deve essere eseguito e si voltò in qualcosa come HTML. 

Ma JavaScript è essenzialmente il contrario. E 'pensato per essere eseguito in genere all'interno della finestra del browser di un utente. E che tipo di siti web uso JavaScript poi in questi giorni? 

Come letteralmente ogni popolare sito web. Ogni sito web che voi ragazzi probabilmente utilizzare l'uso quotidiano JavaScript per il semplice e anche la caratteristiche più sexy. 

Quindi, qualcosa come Facebook Chat se si utilizza tale. Come si fa che funzionano davvero? Bene finora, tutte le cose che abbiamo fatto con HTML e PHP presume che si tira su un URL, e si preme Invio, e si vede alcuni contenuti HTML. E si fa clic sul collegamento, che cambia il URL, cambia la pagina e ricariche alcuni nuovi contenuti. Fare clic su un URL o inviare un modulo, è ottenere sbattuto a un'altra pagina e si vede qualche nuovo contenuto. 

Ma usando qualcosa come Facebook Chat, o Gchat, o Google Maps, raramente fa tutto il refresh della pagina in modo tale che si vede uno schermo bianco momentaneamente e poi nuovi contenuti. Piuttosto, pagine web oggi sono dinamicamente sempre aggiornato di nuovo e ancora e ancora ogni sorta del dietro le quinte. E si scopre che quando si va a qualcosa di simile a Facebook, o Gchat, o Gmail, e gli aggiornamenti della pagina automaticamente senza ricaricare la schermo intero, quello che è successo è che il tuo browser ha fatto una sorta di segreto richieste HTTP aggiuntivi - non per le pagine web intere, ma solo per piccoli blocchi di dati, come il messaggio istantaneo che il tuo amico appena trasmesso voi, o l'aggiornamento di stato che qualcuno solo voi, o il tweet inviato che qualcuno appena inviato. E 'solo facendo piccoli richieste di dati, e quindi utilizzando JavaScript, questo linguaggio di programmazione, di cambiare ciò che Nella pagina web si presenta come senza server di aiutare, senza il server generazione che l'HTML. 

Così, in breve, JavaScript può essere utilizzato poi per recuperare non solo nuovi dati dal il server senza ricaricare tutta una La pagina o l'invio di un modulo. Può essere utilizzato anche per il cambiamento il cosiddetto DOM - Documento modello di oggetti - che è solo il modo di fantasia per dicendo che l'albero di HTML che abbiamo visto l'ultima volta. 

Quindi, per rassicurare, JavaScript è sintatticamente in modo simile a C pure. Non c'è alcuna funzione principale. Basta iniziare a scrivere il codice e si otterrà eseguito, o interpretato più correttamente. Condizioni sarà simile a questa. Non è diverso da C o PHP per quella materia. Espressioni booleane o-ed insieme sarà simile a questa. AND insieme simile a questa. 

Interruttori sarà simile a questa. Per i cicli sarà simile a questa. Mentre i passanti potranno simile a questa. Effettuare cicli while sarà simile a questa. 

Questo è nuovo. Così JavaScript non ha un foreach costruire per sé, ma questo costrutto per la variabile i in array, e io in questo caso diventa un valore di indice. Quindi è un po 'diverso da quello foreach, anche se le nuove versioni di JavaScript stanno venendo fuori tutto il tempo, così anche queste caratteristiche del linguaggio si stanno evolvendo. 

E per inciso, JavaScript questi giorni può essere utilizzato anche su un server come PHP utilizzando un framework chiamato Node.js. Uno di CS50 TF, Kevin, ha portato un seminario su Node.js che è disponibile presso cs50.net/seminars. Quindi, se siete curiosi, sapere che si può utilizzare questo sul lato server come bene, ma questa è una tendenza abbastanza recente, ma un potente a questo. 

Questo è un po 'diverso. Si tratta di un array in JavaScript. E quello che colpisce come diverso rispetto a C o PHP? Ci sono alcune storie veloci possiamo dire qui. Cosa manca rispetto a PHP? 

AUDIENCE: [incomprensibile]. 

DAVID MALAN: Sì? Ci dispiace dirlo di nuovo? 

AUDIENCE: Non dichiara il tipo di variabile. 

DAVID MALAN: Non stiamo dichiarando il tipo di variabile. Quindi in realtà abbastanza come PHP, non siamo specificando i tipi di questa variabile. Piuttosto, siamo più genericamente dicendo var per la variabile. Non abbiamo fastidio di PHP del simbolo del dollaro, che pur noioso tipo, fa di più chiaro che qualcosa è una variabile. Mentre qui, siamo una sorta di tornare a L'approccio di C semplicemente chiamando un variabile dal nome vogliamo per dare, come i numeri. E anche come PHP, abbiamo parentesi quadre per l' valori all'interno di tale matrice. 

Così variabili in JavaScript anche potrebbe assomigliare a questo. Si noti qui si tratta di una stringa denominata s, ma allo stesso modo abbiamo non specificato che si tratta di una stringa. Ecco però una caratteristica che non esistere esattamente nello stesso modo in PHP, ma un po 'simile. Questo è un oggetto in JavaScript. E gli oggetti sono una sorta di esercito svizzero Coltello di una struttura dati in cui si li possono utilizzare per qualsiasi numero di cose. 

Qui, per esempio, stiamo dichiarando una variabile denominata preventivo. Il tipo di quella variabile è un oggetto. Si può pensare a questo come una struct C che ha le chiavi e valori. Simbolo è una chiave. FB è un valore, apparentemente un simbolo azionario. Comma. Il prezzo è un altro tasto, e il suo valore è apparentemente una virgola mobile, o un il numero più in generale in JavaScript, di 49,26 dollari. 

Quindi PHP non ha - non abbiamo visto negli oggetti PHP abbastanza come questo, ma abbiamo fatto vedere un analogo, che era quello? 

AUDIENCE: [incomprensibile]. 

DAVID MALAN: array associativi. Quindi, considerando che PHP ha array associativi la cui sintassi è sempre leggermente in modo diversa - abbiamo visto le parentesi quadre. Abbiamo visto le frecce simboli strani. JavaScript ha oggetti, ma questo è prevalentemente una differenza semantica e una tradurre diverso per ora. Tuttavia, come una digressione, PHP ha anche oggetti in un modo che Java e altri lingue hanno oggetti programmazione orientata agli oggetti. Ma useremo questi solo per i tipi di dati per ora. Oggetti e array associativi. 

Questo potrebbe rendere un po 'più chiaro. Ecco perché un oggetto è utile. Quando si desidera dichiarare uno studente, come Zamyla, possiamo effettivamente incapsulare così dire all'interno di tale oggetto utilizzando le parentesi graffe come prima di un intero mazzo di chiavi e valori in qui. Abbiamo un ID, una casa e un nome Zamyla, seguito da una virgola come solito alla fine. 

Giù anche qui, questa è leggermente diverso, ma anche molto potente in questi giorni. Ecco un array, e so che a causa c'è una parentesi quadra up superiore e una parentesi quadra nella parte inferiore. E questo è un array di quali dati digitare apparentemente in JavaScript? Questo è un array di sembra come tre oggetti. E so che è solo un oggetto a causa delle parentesi graffe. E notate c'è aperta parentesi graffa, alcune cose, chiudere parentesi graffa, virgola, poi alcuni di più, virgola, e poi ancora un po '. Ecco, questo è tre argomenti separati da due virgole. 

Quindi questo è un array di tre oggetti. E ciascuno di questi oggetti sembra essere membro studente o del personale di alcune ordinamento, ciascuno con un ID, casa, e il nome. Ma ho chiamato questo qualcosa chiamato JSON - JavaScript Object Notation. E questo è un formato di dati che effettivamente è così molto popolare e in voga in questi giorni che se si scrive un applicazione che utilizza il Facebook API, l'API di Twitter, davvero quasi qualsiasi API là fuori in questi giorni, tra cui alcuni dei propri del CS50, l' i dati si torna non è in vecchio formato CSV scuola. 

Perché ricordiamo che CSV è super semplice. Si trova a soli colonne separate da virgole. Dati JSON ti dà più metadati. Si associa una chiave con ogni valore in modo essi non devono assumere solo che colonna zeroth è un valore, colonna uno è un altro, colonna due è un altro. Tutto in un oggetto JSON qui è una sorta di auto-descrizione, perché ogni uno dei nomi in questo file ha letteralmente nome di fronte come stringa tra virgolette. 

Quindi diamo un'occhiata a un paio di esempi qui. Lasciami andare all'interno dell'apparecchio. E lasciatemi andare nella nostra vhost directory in pubblico. E mi permetta di andare in JavaScript directory. E andiamo avanti e aprono dom-0.html, dove DOM significa solo document object model. E 'la roba albero a cui Ho fatto riferimento in precedenza. 

E mi permetta di proporre le seguenti. Ecco una pagina web il cui corpo è abbastanza semplice. Quindi, qui in basso, notare Ho una forma. Abbiamo visto quelli prima. Ha due ingressi, uno dei quali ha un ID di nome, uno dei quali ha un tipo di presentare, e il primo il suo tipo è il testo. Quindi, questo in realtà sembra piuttosto semplice. 

Andiamo qui. Torniamo a questa pagina qui. Andiamo in localhost, e andare in la nostra directory JavaScript e andare a dom-0, e qui abbiamo questo modulo. Ecco, questo è apparentemente tutto questa pagina fa. Ha un campo di nome con un pulsante Invia. Ma io non ho intenzione di utilizzare PHP qui. Io vado a fare lato client tutto così dire in JavaScript come segue. 

Notate che ho davvero dato il nome campo di questo ingresso un unico identificativo, che sarà effettivamente Mi risparmiare un po 'di tempo in un attimo. E accorgo che ho presentato un altro tag nella testa della mia pagina web, l'  tag. 

Quindi è in questo senso che JavaScript sia un linguaggio di programmazione lato client. In questo caso, come CSS, ho messo dritto dentro la mia HTML. Ma notate ho dichiarato una funzione che sembra un po 'come PHP sintatticamente, ma questo è in realtà JavaScript, perché ancora una volta, è lato client nel browser. E prendere una congettura che cosa questo sta andando a fare, anche se alcuni di sintassi qui è nuovo. 

AUDIENCE: Dite ciao a chiunque. 

DAVID MALAN: Sta per dire ciao a chi visita questa pagina. Quindi, in che modo? 

Quindi notare, si scopre in JavaScript c'è una funzione di () di allarme. Questa è una funzione molto sorta di triste che in realtà tende solo per infastidire gli utenti. Non è quello che si dovrebbe davvero usare in genere, ma è un rapido e sporco modo di una sorta di stampare qualcosa ad un utente grafica interfaccia, come un browser. Si noti qui che ho un stringa tra virgolette singole. Si scopre che a differenza di C, JavaScript può effettivamente essere utilizzate solo cita, e francamente è solo un po ' della convenzione stilistica tra JavaScript programmatori di utilizzare le virgolette singole. PHP, in realtà hanno un po ' significato differente. Ma per ora, è sufficiente sapere che questa è l'unica ragione. La convenzione in JavaScript è spesso utilizzare le virgolette singole, ma potremmo usare doppie virgolette in entrambi i posti. 

Quindi questo è interessante. Ricordiamo l'ultima volta che abbiamo avuto che immagine sullo schermo che ha attirato un albero dove si aveva il nodo HTML, e la testa nodo e il nodo di body, e poi alcuni testi. Ma c'era un nodo speciale al molto alto che ho chiamato il documento. Beh, si scopre in JavaScript, qualsiasi volta che si scrive un programma in JavaScript in un browser, si ha accesso a una speciale variabile globale. Simile nello spirito a superglobals di PHP, questo viene chiamato in tutti i documenti in minuscolo. 

E 'come una struct, ma questa struct ha anche funzioni all'interno di esso. Quindi una struct C ha appena dati in genere. Ma un oggetto JavaScript come questo tecnicamente è anche dotato di funzioni, altrimenti noto come metodi, all'interno di esso. E si può chiamare una funzione all'interno di questo oggetto letteralmente facendo il suo nome, puntino, e poi il nome di la funzione, o ancora metodo. E 'solo un sinonimo, davvero. 

E cosa fa questa funzione? È possibile tipo di intuire dal suo nome. Prendi elemento da ID. Quindi questo sta andando a cercare la pagina web, verificare che l'albero, cercando qualunque nodo, elemento AKA, ha una ID univoco del preventivo nome unquote. E allora che cosa sto andando a fare? Ho intenzione di ottenere il valore all'interno di quel nodo nell'albero, e sto andando per dire in qualche modo ciao a quel nome. 

Quindi prendere una supposizione, anche se non abbiamo visto ancora, cosa fare il più significano qui e qui, probabilmente? 

AUDIENCE: Concatenare. 

DAVID MALAN: Concatenare. A destra, e questi sono solo tipo di decisioni di progettazione persone hanno fatto anni fa. In PHP, si concatena cose con puntini. In C, si passa attraverso una serie di cerchi e funzioni come StrCopy (call) o strcat () o altre funzioni. Ma in JavaScript, è possibile utilizzare plus. Quindi questo è solo concatenazione tre corde - ciao, un nome, e quindi un punto esclamativo. 

Così, quando e perché è questa funzione chiamato però? Bene, prendete una congettura dalla HTML nella parte inferiore. Perché è salutare () chiamata, o quando? 

A quanto pare, come meglio posso dire, su presentare, al momento della presentazione di questo modulo, Ho intenzione di fare tutto ciò che è all'interno di queste citazioni. E in particolare, ho intenzione di chiamare salutare () e poi tornare false. 

Bene, vediamo cosa la rete effetto è di prima qualità. Allora lasciami andare avanti e digito , per esempio, Loren, Submit. Ciao Loren. Vediamo se forse questo era solo un'implementazione fortunato. Nope. Quindi è digitando qualunque nomino Io in realtà messo lì. 

Ma notare ciò che non sta cambiando. L'URL è ancora dom-0.html. Non c'è register.php. Non c'è nessun secondo file. Non c'è nessun attributo action. Così che cosa è questo ritorno falso presumibilmente facendo? Perché sto chiamando salutare () e poi tornando falso probabilmente? Quello che normalmente succede quando si fa clic su Invia una forma che anche noi abbiamo visto la scorsa settimana? 

AUDIENCE: [incomprensibile]. 

DAVID MALAN: Si va da qualche parte, giusto? Si va ad alcuni URL di destinazione. Ma io non voglio che ciò accada qui. Voglio che la mia pagina web, per essere completamente dinamico come Gmail, dove una volta che sei lì, rimani lì. L'URL non cambia in modo che indica l'intera pagina sta caricando. Piuttosto, voglio solo cambiare qualcosa come stampare qualcosa qui sullo schermo. 

Ebbene vorrei pulire questo un po '. Lasciatemi apro non dom-0, ma fammi apro dom-2. Solo così hai visto una sintassi qui. 

Si scopre che quello che abbiamo appena ha sta usando JavaScript crudo. Quindi questo è veramente il linguaggio JavaScript. Alcuni di voi potrebbe sapere di una libreria chiamata jQuery. 

Quindi jQuery non è la stessa cosa come JavaScript. E 'solo una libreria che davvero intelligente ragazzo ha scritto e diffuso tale che quasi tutti nel mondo ora utilizza jQuery quando si utilizza JavaScript. E a prima vista, onestamente, sembra un po 'più criptico. Ma troverete, soprattutto se si va lì per il progetto finale con il web sviluppo, vi accorgerete che questo pulisce le cose e consente di risparmiare un bel poche righe di codice. 

Così facciamo solo colpo d'occhio a come questa forma sta funzionando. Notate cosa ho rimuovo apparentemente dal mio HTML? Non c'è il submit handler per così dire. Non c'è nessun attributo. Perché si sa, cosa Non mi piace molto? Mi sentivo come se fossimo cadendo nelle vecchie abitudini lì. Proprio come stava cominciando a sentire sciatta a mescolarsi sia i CSS con HTML, perché sei specie di buttare diverse lingue in tutto il posto, allo stesso modo ha fatto questo inizia a sentire come una cattiva strada per andare giù dove Sto mettendo codice JavaScript all'interno del mio HTML invece di factoring fuori. 

Ecco, questo è la lezione qui. In dom-2.html, sto factoring fuori. E sto facendo le cose un po ' diversamente. Per ora, ho intenzione di sventolare le mie mani a ciò che questo fa davvero sotto la cappa. Ma solo per ora supporre che quel primo riga di codice in questa biblioteca chiamato jQuery significa solo quando la documento è pronto, fare quanto segue. 

Perché le pagine web possono prendere po 'di tempo a caricare. Potreste essere in un internet lenta connessione, e potrebbe essere la filatura e la filatura, e, infine, è caricato. Quella riga di codice dice solo attendere l'intera pagina è pronta, il documento è pronto, prima di eseguire questo codice. 

E ora notate, questo è probabilmente la più utile prima togliere da jQuery. Questa linea qui è molto simile nello spirito a questa linea molto più a lungo qui. Considerando che nel codice JavaScript crudo, ci esiste un oggetto globale documento che ha una funzione chiamata getElementById (), le persone che hanno scritto jQuery semplificato che al solo dire simbolo del dollaro, e poi all'interno di tra parentesi messo due citazioni, e poi mettere un cancelletto seguito dal ID univoco si vuole afferrare. Quindi questo è equivalente a document.getElementById. 

Nel frattempo,. Inviare significa semplicemente su presentazione di qualsiasi forma sei riferendosi a sinistra, andare avanti ed eseguire questa. Ma questa è ormai la curiosità anche. Cosa c'è di strano in ciò che Ho evidenziato qui? Non solo è sorta di sintatticamente nuovo, c'è anche qualcosa che manca. 

PUBBLICO: È appena chiamato funzione? Non è chiamato avviso? 

DAVID MALAN: Già. Bene, così alert () è giù qui, ad essere sinceri. Ma non vi è alcuna menzione di un nome, come si sa, foo o qualcosa qui. Ed in effetti, questa è una delle caratteristiche di JavaScript che è abbastanza potente, ma anche abbastanza nuovo. E PHP ha in realtà anche questo. 

Lasciatemi andare avanti e fare qualcosa di reale veloce. Lasciami andare avanti e mettere questo qui. Permettetemi di fare questo. Funzione. Chiamiamo questo gestore (). Una funzione del gestore per così dire. Qualcosa che gestisce alcune operazioni. Permettetemi di ripulire il mio rientro. E mettere questo qui. E mettere qui. Yep. OK. 

Così ora ho una funzione chiamata handler () che io non so davvero cosa fa ancora. E 'solo ancora quella roba. Whoops. Ha preso troppo. Cerchiamo di fare questo. Bene. Mi dispiace. Bene. Permettetemi di fare questo. OK. Che sembra piacevole e dritto avanti ora. Permettetemi di fare questo. Fate questo. E OK. Così ora, mettiamo questo qui. Non più di programmazione al volo. OK. 

Così ora, torniamo a dove la storia ha avuto inizio. In precedenza, ho detto che questa linea qui significa che quando il documento è pronto, andare avanti e farlo. Cosa voglio fare? Bene in particolare, io voglio andare avanti e fare quanto segue. Eseguire questa riga di codice, e quindi quello che voglio fare è chiamare questa funzionare quando il modulo viene inviato. 

Ora, questo è ciò che è interessante. Questo non è esso stesso una funzione. Notate che non sto mettendo tra parentesi qui in modo normale. Sto letteralmente passando una funzione chiamata gestore () ad un'altra funzione chiamato submit () come argomento come se è come una variabile. E questa è una delle caratteristiche di JavaScript, è funzioni stesse sono in realtà oggetti solo. In realtà, sono in realtà solo variabili di qualche tipo. E se il nome della funzione è handler (), non vi è alcun motivo per cui non posso passarlo come argomento qui. E questo significa che quando il modulo con l'ID di demo è presentata, chiamare questa funzione. 

Ma ora, se io sciolgo tutto questo, perché allora ho forse io questo un momento fa? Bene, questa è una funzione anonima. Perché, francamente, ho capito perché sono io preoccuparsi di perdere tempo, che dichiara una funzione chiamata handler () solo per chiamare in uno e un solo posto? Se non ho bisogno del nome, e io non lo faccio bisogno di chiamare più di un luogo, facciamo solo implementare la funzione proprio dove ne ho bisogno. E così JavaScript e PHP sostenere quello sono chiamati funzioni anonime che mi permetta di fare esattamente questo qui. 

Ma stiamo solo grattando la superficie. Diciamo stuzzicare con solo un paio ultimi esempi qui. 

Se vado in quote.php. Si noti che questo è in realtà un PHP funzione, un programma PHP, che ho scritto che si aspetta un parametro chiamato HTTP simbolo, e posso passare un valore come FB. E se in realtà guardiamo alla fonte codice, questo sta interrogando un sito web gratuito chiamato Yahoo Finance, proprio come p-set sette, e sta tornando a me qualcosa a quanto pare il formato noto è JSON - JavaScript Object Notation. E 'solo un oggetto. Notate le parentesi graffe, le citazioni, il colon, e le virgole. 

Ora invece, questo è piuttosto fresco. Perché io posso probabilmente usare una programmazione linguaggio per generare URL che simile a questa dinamica, vero? Posso cambiare questo a Google e tornare Google prezzo delle azioni di $ 1,017.55. Così vediamo se non possiamo usare questo momento. 

Lasciami andare a ajax-0 qui, che appare come il seguente. E 'solo un sito web che ha un form con un pulsante. Lasciatemi qui andare avanti e digitare in YHOO per il simbolo azionario di Yahoo, fare clic su Get Quote e ora accorgo ho ottenuto un avviso con 32.86. 

Lasciatemi in realtà andare a una versione più elaborata di questa pagina, la versione due, e digitare in diciamo Microsoft, MSFT. Preventivo. E ora notare, nessun allarme. Notate dove si dice prezzo da determinarsi? Vi è il più semplice degli esempi che allude a ciò che Gchat, e Facebook Chat, e Gmail, e di altri come siti web stanno facendo da realtà cambiare la pagina web. 

Notare questo. Lasciatemi ricaricare la pagina. Lasciatemi apro ispettore di Chrome. Lasciami andare agli elementi scheda qui. Ora notare se lo zoom in qui e aprire questo, si noti che questo è il mio HTML DOM - la mia document object model. Questo è il mio HTML. Ma ora notate, anche se sta andando essere un po 'difficile da vedere in entrambi posti contemporaneamente, se digito FB qui, guardare il fondo del campo inquadrato. 

In realtà cambiando il mio HTML al volo. E che sta facendo questo semplicemente facendo qualcosa di simile. Se apro ajax-2, l'avviso di esecuzione qualcosa di sexy come che, anche se è abbastanza brutto, ma sofisticato come quello funzionalmente, ha qualche HTML nella parte inferiore. Ma accorgo che ho usato per etichettare. Noi non abbiamo usato prima, ma questo è come, ma non forza tutto su una nuova linea. Si fa solo una regione rettangolare sulla stessa linea sostanzialmente. 

Si noti che ho dato un ID di prezzo. E si scopre utilizzando lo stesso JavaScript biblioteca, ho una funzione chiamato citazione (), che chiama ogni volta il modulo viene inviato. E quello che sto facendo è questo. Sto dichiarare una variabile in JavaScript chiamato url, salvando il valore quote.php simbolo? =. In altre parole, mi sto cominciando per preparare una richiesta HTTP, e quindi Sto concatenando su quella con un plus qualunque sia l'elemento con l'ID di simbolo è, che l'avviso è che campo di testo fino qui. Quindi, proprio come abbiamo avuto forme del passato. 

E poi si scopre in jQuery, se chiamare. val (), che chiama di val funzione, una funzione di valore, che ottiene tutto ciò che l'utente ha digitato dentro E allora tutto il traffico di rete ciò che accade è questo. $. GetJSON. 

E per inciso, il simbolo del dollaro è solo una notazione abbreviata. E 'davvero jQuery.getJSON. Portami a JSON da questo URL, e quando la richiesta ritorna, chiamare questo funzione e passare come argomento qualunque sia tornato dal server. 

Quindi, in altre parole, se torno al del browser, e torno a quote.php, ciò che il mio browser sta facendo è sempre questo blocco di dati. E quando vado a questa pagina web qui, notare se noi invece andiamo alla rete linguetta e chiaro, quindi digitare qualcosa come GOOG per Google e ottenere Quote, si noti che la pagina non è cambiata. Ma una richiesta HTTP è stato fatto, e ciò che tornato qui se guardiamo al la risposta è un insieme di JSON che accedessimo infine con questa semplice linea qui. 

I dati sono ciò che è stato ottenuto dal server. Il prezzo è il nome del Tasto mi preoccupo. Così data.price mi dà questo. 

Ora intanto, e questo è l'ultimo esempio. Si può fare ancora di più con la pagina. Una realtà, ben due. Siamo in grado di riportare la tag, se vi ricordate questo. Ecco JavaScript. Possiamo farlo. Molto emozionante. Lasceremo che, come un cliffhanger. 

Ma più eccitante, è possibile fare cose come questa. Se vado a geolocalizzazione-1, si scopre che Chrome sa che siamo a longitudine latitudine 42.37. -71,10. Quindi c'è ancora di più ci a vostra disposizione. Ma più che la prossima settimana. Ci vediamo Lunedi.