[Powered by Google Translate] [Woche 9] [David J. Malan - Harvard University] [Dies ist CS50. - CS50.TV] Gut. Willkommen zurück. Dies ist CS50, und dies ist der Beginn der Woche 9. Heute sind wir in besonderem Schwerpunkt auf Design, nicht mehr im Rahmen der C aber im Kontext von PHP und ein wenig SQL und ein wenig JavaScript, besonders in Richtung eines Endes der beiden pset 7 und auch das endgültige Projekt. In der Tat, wenn Sie an dieser Stelle in das endgültige Projekt wo vermutlich als einer Stunde oder so vor Ihnen zumindest begonnen, sich Gedanken zu geben Ihre endgültige Projekt und du denkst, du würdest gerne mit 1 oder 2 Klassenkameraden zusammenarbeiten, wenn Sie Probleme mit der Verbindung mit dem Klassenkameraden, fühlen Sie sich frei, füllen Sie das Formular auf cs50.net/partners/form. Es fragt nur, wer du bist, welche Art von Projekt Sie über das Denken, wo Sie leben nur aus logistischen Gründen. Und dann, wenn Sie im Auge behalten in der nächsten Woche oder so der Tabellenkalkulation URL gibt, Sie können dann eine Nur-Lese-Version des Google doc in denen wir sammeln diese Informationen. Also, wenn Sie mit jemandem arbeiten wollen, mit allen Mitteln zögern Sie nicht auf die Menschen zugehen über diesen Mechanismus. Aber die Mehrheit der Leute tun Arbeit solo. Das ist völlig in Ordnung. Also nicht das Gefühl, dass dies in keiner Weise verpflichtend ist. Am Freitag war es nur mich und ein paar der Team hier leeren Theater zum größten Teil. Es wurden 3 Touristen up sitzen, das war also ein wenig umständlich. Was wir darüber gesprochen war Datenbanken und wir sprachen über pset 7 ein wenig. Und wenn Sie nicht zufällig, dass auf Video nur noch zu fangen, ist das in Ordnung. Ich werde versuchen, alle Begriffe zu definieren, dass wir sonst für selbstverständlich basierend auf Freitag Vortrag. 

Aber heute werden wir versuchen, Sie auf den Punkt kommen der nicht nur in der Lage, so etwas wie pset 7 do aber wirklich zu verstehen, was los ist unter der Haube, Besonders einige der Abstraktionen, dass wir in Kraft gesetzt in der functions.php-Datei um euer Leben ein bisschen einfacher, aber so, dass Sie letztlich zu verstehen so dass, wenn die Stützräder off kommen in ein paar Wochen kann man noch überleben in der realen Welt und machen dieses Zeug ohne CS50 Rahmen unter Ihnen. Diese $ _SESSION, für diejenigen von euch, die vertraut sind oder wer bereits gefangen das Video am Freitag, was bedeutet SESSION lassen Sie uns in einer PHP-basierte Web-Anwendung? Dies ist eine superglobal Variable, die es im Geiste gleich GET und POST bedeutet, und ein paar andere, aber was ist dieses Ding geeignet? 

Was ist SESSION verwendet? Yeah. [Schüler] Logging in. Sorry? [Schüler] Logging in. Logging in. In der Tat. In pset 7 verwenden wir diese SESSION superglobal zu erleichtern Logging in. Und was ist schön zu dieser superglobal ist, dass es ein assoziatives Array ist. Ein assoziatives Array, Rückruf, ist nur ein Array, aber deren Indizes nicht mehr Zahlen wie 012. Sie können Zahlen sein, oder sie können sogar Strings sein. Und so, wenn Sie in pset 7 tauchten schon besitzen, können Sie sich erinnern, dass wir speichern einen Schlüssel namens ID Innere dieses assoziatives Array, dessen Wert ist so etwas wie 123 - was die derzeit in Benutzer-ID angemeldet ist. Die Motivation dafür besteht darin, dass auch nach der Benutzer besucht localhost oder meine Website mehr allgemein und dann haben sie angemeldet auch wenn sie nicht auf einen Link klicken oder zurück zu meiner Website für 5 Minuten oder sogar eine Stunde oder sogar einen Tag, aber sie lassen ihre Browser-Fenster geöffnet, über diese superglobal kann ich mich erinnern, dass sie angemeldet sind in. 

In anderen Worten, erlaubt es mir leicht langfristige was ich will über einen Benutzer zu speichern. Und Sie können es wirklich als Inkarnation eines Einkaufswagens. Orte wie Amazon natürlich können Sie die Dinge in einem Einkaufswagen, aber HTTP, das Protokoll, die Befugnisse der Web, ist staatenlos in dem Sinne, dass, wenn Sie eine Website besuchen, zum größten Teil Sie nicht über einige konstante Netzwerkverbindung zwischen Ihrem Browser und dem Server. Sobald Sie haben das HTML und die JPEGs und die GIFs heruntergeladen und all das, die Verbindung geht weg und Sie müssen nur eine Kopie der Datei und so weiter aus dem Server. Aber wenn der Server will etwas über dich erinnern, die Last auf dem Server tatsächlich aufnehmen, dass die Informationen. Und so der Programmierer, der die Kontrolle über den Server haben können die meisten, was Sie wollen hineinlegen dieser superglobal assoziatives Array und es wird dort das nächste Mal der Benutzer kommt zurück, ob es sich um Minuten oder sogar Tage später, wenn sie ihre Browser-Fenster schließen, an welcher Stelle SESSION verschwindet. So vergänglich Speicher, es ist non-persistent, und es soll weg sobald der Benutzer schließt seinen Browser - nicht nur, dass Reiter, die oft das gesamte Browser, dadurch wirksam Anmeldung des Benutzers aus. Also, wie ist das Ding tatsächlich umgesetzt? Werfen wir einen kurzen Blick auf ein einfaches Beispiel wir am Freitag sah. Für die Leser, es war so einfach wie diese. Dies ist eine Web-Seite, deren einziger Zweck im Leben ist, mir zu sagen, wie oft habe ich diese Seite besucht. Dies ist das erste Mal hier am Montag, dass ich sie besuchte, so heißt es 0 mal. 

Aber wenn ich diese Seite neu laden zu starten, heißt es 1 Mal, 2, 3, 4, 5, und dies wird schließlich nur auf das Zählen bis zu halten, up, up, up, up für jedes Mal, wenn ich tatsächlich klicken Sie darauf laden. Also, wie ist diese Arbeit? Lassen Sie mich reingehen dieser Datei aufgerufen counter.php. Der obere Teil ist es alle blauen Kommentare, aber der interessante Teil ist hier. In Zeile 13 rufen wir diese Funktion session_start, und das ist wörtlich alles, was Sie tun müssen, wenn Sie den Zugriff haben wollen um diese spezielle superglobal namens $ _SESSION. Das macht es möglich, und wir werden in einem Moment, wie das alles möglich zu sehen. In Zeile 16 bemerken, was ich tue. Wenn der Schlüssel, genannt Zähler - mit anderen Worten: der Indexwert - "counter" existiert innerhalb dieses Array namens SESSION, dann was mache ich mit ihm in der Zeile darunter? Was ist Zeile 18 zu tun? 

[Unverständlich Studenten Antwort] Was ist das? [Schüler] Speichern des Wertes. Gut. Es speichert den Wert, der in SESSION ist jetzt in einer neuen lokalen temporären Variablen, $ Counter in Kleinbuchstaben. Beachten Sie, dass PHP wird bereits ein wenig faul hier. Beachten Sie, wir haben keine Erwähnung von int oder float oder String oder so etwas weil PHP schwach typisiert wird, wobei man nicht um den Typ einer Variablen angeben, und in diesem Fall hier habe ich noch nicht einmal erklärt, es noch nicht. Ich erkläre es innerhalb dieser geschweiften Klammern und im Gegensatz zu C, das ist eigentlich okay. Egal wie tief eine variable Erklärung verschachtelt ist in PHP - Innere geschweiften Klammer, innerhalb der geschweiften Klammer und dergleichen - es wird in diesem Moment in der Zeit für den Rest des Programms vorhanden ist, zum Besseren oder zum Schlechteren. So wird es sofort global, sobald Sie es definieren, wie wir hier sind. 

Ansonsten, wenn ich nicht feststellen, dass es etwas gibt in der SESSION superglobal, Ich bin anscheinend der Initialisierung dieses variable Zähler auf 0, dabei ebenso vorausgesetzt, der Benutzer hat nie hier gewesen. Und dann dies natürlich wird Inkrementieren des Zählers, wie? Ich bin Aktualisierung der Wert, der im Inneren ist dieses assoziativen Arrays indem sie gleich, was Zähler derzeit + 1. Wenn ich hier unten scrollen, um den HTML-Code der Seite, es ist eigentlich ziemlich einfach. Alles, was ich in den Körper dieser Seite ist: "Sie haben diese Seite so-und-so-mal besucht." Und dies ist ein PHP Konstrukt. Wenn Sie das tun <? = Entspricht dies effektiv zu welcher Funktion? Es ist wirklich entspricht etwas wie printf, die wir oft gesehen habe in C, obwohl, wie Sie vielleicht schon wissen aus der spec in pset 7, Druck ist auch eine Funktion, die gerade druckt etwas aus, ist es nicht wirklich nutzen Format-Codes, und man kann tatsächlich sagen, Echo als gut. Sie sind alle immer so leicht unterschiedlichen obwohl die Netto-Effekt ist letztlich das gleiche. So diese Verwendung des Gleichheitszeichens ist nur eine Art elegante Weise, es zu tun kurz und bündig, als Sie vielleicht anders sein können. So, das ist alles this site tut. Es druckt den Wert des Zählers. Wie ist das alles wirklich passiert? Sie erinnern sich vielleicht eine Woche oder so begannen wir suchen unter der Haube , wie eine Web-Seite mit diesem Inspector Registerkarte funktioniert. 

Chrome hat diese sowohl in der Mac-Version, die Windows-Version, und auch die Linux-Version, und Firefox und IE haben ähnliche Mechanismen, durch die Sie diese integrierten Debugger haben innerhalb des Browsers. Werfen wir einen Blick auf die folgenden. Wir haben eine ganze Reihe von Registerkarten hier, und daran erinnern, dass die am weitesten links ein Elements ist, und egal wie godawful die HTML-und JavaScript in einer Seite ist, daran erinnern, dass mit der Registerkarte Elemente kann man tatsächlich navigieren HTML hierarchisch und schön und ordentlich. Also, wenn Sie versuchen, von einer Website wie Google oder Facebook zu lernen oder wirklich jede Website, erkennen, dass Sie wahrscheinlich besser dran Blick auf den Quellcode auf diese Weise zu betrachten das rohe Quelle Gegensatz was kann ein Chaos, wie wir vor allem auf die Google-Website zu sehen. Also, wenn ich stattdessen auf der Registerkarte Netzwerk klicken Sie hier, Mal sehen, was los ist, wenn ich diese Seite zu besuchen. Zunächst lassen Sie mich klar meinen Cache. Ich werde in Einstellungen in Chrome gehen und gehen Sie dann zu Geschichte und deaktivieren Sie alle Browser-Daten. Man könnte dies zu tun für andere Zwecke verwendet werden, [Gelächter] aber wenn es um die Entwicklung von Websites geht, ist es tatsächlich nützlich - wenn Sie lachen wirst du wissen. [Gelächter] Es ist eigentlich sehr nützlich, wenn die Entwicklung von Websites, weil die Realität ist, Dinge wie Cookies und ähnliche Dinge zwischengespeichert HTML-Dateien zwischengespeichert JavaScript-Dateien kann tatsächlich eine große Kopfschmerzen geworden, denn wenn aus irgendeinem Grund Der Browser entscheidet, einige Dateien zwischenspeichern und doch haben Sie Änderungen an der Datei auf dem Server vorgenommen aber der Browser hat nicht wirklich realisiert, dass die Datei geändert hat und daher eigentlich nicht erneut herunterladen, auch wenn Sie die Reload-Taste klicken, einer der todsichere Möglichkeiten, um nur sicherzustellen, dass die Störung nicht mit Ihrem Code, Es ist mit dem Verhalten des Browsers, ist hier in Ihrem Browser gehen und löschen Sie einfach die ganze Geschichte so, dass es keine Verwirrung. 

Und dann, wenn Sie wirklich wollen, paranoid zu sein, den Browser beenden, neu starten, und dann stellen Sie sicher, alles funktioniert wie erwartet. Also kurz gesagt, ist Clearing-Cache gut, wenn dabei die Entwicklung. Also hier haben wir die Registerkarte Netzwerk. Ich zuvor besucht die Website 9 mal, aber lassen Sie mich gehen Sie jetzt und klicken Sie auf Neu laden. Und ich bin wieder auf 0. Lassen Sie tatsächlich sehen, wie es ist, dass diese Sitzung superglobal umgesetzt wird. Ich werde auf dem 1 HTTP-Anforderung, die gemacht wurde klicken, und das Debugging-Fenster lässt mich hineinschauen davon. Hier sehe ich nur die Antwort vom Server, das ist nicht interessant. Ich habe dies in einer beliebigen Anzahl von Möglichkeiten gesehen. Aber was ist technisch interessant sind die Header. Wenn ich nach unten scrollen hier und konzentrieren sich auf die Request-Header, und klicken Sie Quelltext, was ich zu sehen, ist buchstäblich die HTTP-Anforderung das ging einfach aus meinem Browser auf dem Server, GET ist das richtige Wort und dann / counter.php ist der Name der Datei, HTTP/1.1 einfach nur die Version von HTTP, dass mein Browser verwendet. Diese Linie ist hier eine kleine Erinnerung vom Browser zum Server, was der Name des Servers ist dass es will zu reden. Und dann der Rest ist manchmal interessant, aber nicht relevant jetzt. 

Dies ist nur eine Art Neugier. Cryptic obwohl diese Zeichenfolge ist, zu jeder Zeit Ihres Browsers besucht eine Website es informiert den Server, welchen Browser Sie verwenden und welches Betriebssystem Sie verwenden und welche Version davon. Also, wenn Sie sich jemals gefragt, wie Websites wie CNN und so weiter wissen, was die Prozentsätze der Mac-Anwender sind auf den Web-, PC-Anwender, IE-Benutzer, Chrome-Nutzer und dergleichen, ist es, weil alle unsere Browser sagen jede einzelne Website gibt, was wir sind. Es muss nicht unbedingt enthalten persönliche Daten aber es macht Sie dem Server, was Ihre IP-Adresse ist und welchen Browser und Betriebssystem Sie verwenden. Also das ist, wo diese Informationen. Aber was ist mehr interessant, jetzt, wenn es um diesen Sitzungen kommt, ist die Antwort-Header. Lassen Sie mich auf Quelle neben Reaktion zu sehen. Was interessant ist hier ein paar Dinge. 1, haben wir wieder einen Status Code 200. Wir sehen nie diesen Status Code, weil das bedeutet, alles ist gut. Es bedeutet wörtlich Ordnung im Gegensatz zu etwas anderem. Was ist eine Zahl, die wir manchmal das ist schlecht? [Schüler] 404. 404, Datei nicht gefunden, vielleicht 403 Sie auf bereits stolpern, was verboten ist, was bedeutet, dass Sie vergessen haben, chmod etwas, wahrscheinlich. Und es gibt eine Reihe von anderen. 

Hier unten ist ein wenig verrückt. Ich schrieb gerade diese Datei ein paar Minuten durch Einfügen in gedit. Warum hat diese Seite im Jahr 1981 auslaufen, bevor es war wirklich ein Web? Was ist da los? 

[Unverständlich Studenten Antwort] Der Zeitstempel. Aber warum? Es ist etwas willkürlich, aber es ist tatsächlich nützlich ist. Was dies ist mein Browser sagt, ist diese PHP Datei, die Sie gerade angefordert haben bereits abgelaufen ist. In der Tat, abgelaufen vor 30 Jahren. Aber was bedeutet das eigentlich? Es bedeutet nur, das nächste Mal den Besuch der Seite, sei es durch neu zu laden oder die Eingabe der URL in der Adressleiste, stellen Sie sicher gehen und holen eine neue Kopie. Dies ist eine Art Beispiel für Cache-Busting, ein dummes Wort, das bedeutet nur versuchen, den Browser zu entmutigen von tatsächlich Caching HTML Das ist von einem Server gesendet so dass Sie nicht versehentlich reload getroffen und dann sehen die gleiche Version der Datei. Sie wirklich wollen, dass der Server eine neue Kopie zu senden. So ist die Tatsache, dass es 1981 ist nur, dass das ist, was das Gerät der Wahl als beliebiges Datum in der Vergangenheit. Aber die wirkliche saftige Linie ist nun diese. Schon vor 50 du bist wahrscheinlich vage vertraut mit Cookies. Ab jetzt, besonders unter denen weniger komfortabel oder zwischen Was ist ein Cookie in Ihrem Verständnis gerade obwohl wir um Ihr Verständnis mehr technische bist? Was ist ein Cookie? Yeah. [Schüler] Informationen über den Benutzer, wie wenn sie ihren Benutzernamen oder etwas geschrieben habe. 

Gut. Es ist Informationen über den Benutzer, ob sie schon in ihren Benutzernamen eingegeben schon. Cookies sind ein Weg, auf dem Server etwas über einem Benutzer erinnern kann. Und was für ein Cookie wirklich ist eine Textdatei oder eine Folge von Bytes Das ist durch die Server innerhalb Ihres Browsers gepflanzt, und innerhalb der genannten Datei oder unter jenen Bytes ist eine Art von Kennung. Vielleicht ist es buchstäblich Ihren Benutzernamen, aber oft ist es etwas kryptisch anmutenden wie dieses Ding hier - bo8dal3ct und so weiter - das ist wirklich große alphanumerische Zeichenfolge das ist wirklich nur gedacht eine eindeutige Kennung für Sie sein. Oder Sie können es als eine Art virtuelle Handstempel denken. Wenn Sie einem Club oder einem Vergnügungspark zu gehen, sich daran zu erinnern, dass Sie tatsächlich gezahlten gegangen und in, legte sie einen kleinen roten Aufkleber auf der Hand von einer Art, und dass erinnert die Menschen an der Theke, die Sie bereits bezahlt und Sie können kommen und gehen, wie es Ihnen beliebt. Cookies sind ein wenig im Geiste gleich dazu. Das erste Mal besuchte ich diese Website, wie ich nur nach dem Löschen meinen Cache, der Web-Server, das Gerät in diesem Fall, setzen Sie einen Stempel auf meiner Hand dessen Name PHPSESSID, Session-ID, deren Wert das ist wirklich lange alphanumerische Zeichenkette. 

Also das ist jetzt eine Art prangt auf meine Hand, so dass ich das nächste Mal traf laden oder manuell besuchen Sie diese URL in einem Browser mein Browser nach Definition von HTTP wird den Handstempel präsentieren wieder und wieder und wieder. Also auch wenn der Server nicht unbedingt wissen, wer ich bin, sie wenigstens wissen, dass ich den gleichen Benutzer oder zumindest, genauer gesagt, der gleiche Browser bin. Und dies ist letztlich, wie die Sitzung superglobal umgesetzt wird. Der Server hat keine Ahnung, wer Sie sind, wenn Sie eine Website für die zweite oder die dritte Zeit erneut es sei denn, Ihnen diese Handstempel. Und sobald du diesen Handstempel präsentieren, der Web-Server geht in einen im wesentlichen kleine eigene Datenbank und prüft, okay, ich habe gerade die Hand Stempel Benutzer bo8dal3ct gesehen und so weiter. Lassen Sie mich sehen, welche Informationen der Programmierer gespeichert hat Innenseite des superglobal Über diesen Nutzer, und dann lassen Sie mich darauf achten, dass die Daten wieder im Inneren des SESSION superglobal so dass der Programmierer kann wieder Zugriff auf die Daten auch wenn es einige Minuten oder Stunden eingestellt. Mit anderen Worten, Cookies, die einen schlechten Ruf für einige Zeit erhielt wegen der Unsicherheiten in Browsern und können sie wirklich verletzt unsere Privatsphäre und all diese, sie tatsächlich haben großen Nutzen, denn ohne sie Sie würden ständig werden Sie sich in jedem Facebook-Seite besuchen oder jeder Google Mail lesen Sie, wenn der Browser nicht über einen Weg des Erinnerns dass Sie bereits authentifiziert. 

So auf diese Weise Cookies werden vor und zurück über die Verbindung gesendet. Eine weitere Kuriosität über Cookies, besonders hier ist, dass diese vollständig im Klartext. Es gibt keine Verschlüsselung geht hier immer, und ja, ich bin mit HTTP im Moment. Einer unserer Favoriten Momente in CS50, das ist jetzt 2 Jahre her, wurde in der Zeit ein Tool namens Firesheep kam heraus. Dies war eine kostenlose Software, die von einem Security Researcher gemacht wurde als Weckruf für die Gemeinde zu sagen, wie grausam umgesetzt bestimmte Authentifizierungsmechanismen im Web waren. Also für einige Zeit war Facebook fast ausschließlich über HTTP, kein HTTPS. Und selbst wenn Sie keine Ahnung, wie die Krypto funktioniert haben, ist S sichere so dass es bedeutet, dass es zumindest einige Verschlüsselung beteiligt. Facebook hat verwendet, um Benutzernamen und Passwörter zu verschlüsseln, aber sobald Sie an Ihrem sah stochert oder Ihre Nachrichten oder Ihre News-Feed, All das war unverschlüsselt. So war bis vor einem Jahr oder 2 vor Gmail. Jedes Mal, wenn Sie sich angemeldet haben, ja, benutzten sie eine sichere Verschlüsselung, danach aber sie tat es nicht. Und warum könnte das sein? Warum nicht einfach Kryptografie die ganze Zeit in Gebrauch Fällen wie diesem? Was ist das? Ich glaube, ich habe etwas gehört. [Schüler] Speed. Geschwindigkeit, nicht wahr? Es gibt Möglichkeiten, dies zu umgehen. Aber wenn man solche nur darüber logisch zu denken, wenn Sie verschlüsseln etwas, Sie müssen mindestens ein wenig mehr Arbeit zu tun. In pset 2, wenn Sie Caesar oder Vigenere umgesetzt oder sogar Crack, nur Druck einen String ist relativ einfach. Verschlüsseln und Drucken eine Zeichenfolge minimal erfordert ein wenig mehr Arbeit. 

 Für super beliebte Websites wie Google und Facebook, wenn Sie mehr Arbeit für jeden Benutzer zu tun für jede einzelne Webseite, die sie besuchen, das dauert nur mehr CPU-Zeit. Und wenn Sie mehr CPU-Zeit benötigen, müssen Sie mehrere Server, das heißt, Sie könnten mehr Geld benötigen. Und so für viele Jahre das nur wirklich nicht die beste Praxis. Die Leute würden SSL-Verschlüsselung nur dann, wenn sie benötigt werden. Aber es stellte sich heraus, und als dieser Kerl mit Firesheep gemacht super klar, wenn Sie Kerle, die derzeit auf Facebook jetzt - Aus Neugier, lasst uns sehen, ob Sie fess werde auf. Wenn Sie auf Facebook jetzt in einigen Registerkarte, auch wenn es nicht im Vordergrund ist, Ihr URL HTTP oder HTTPS? [Mehrere Schüler] S. S? [Gelächter] Okay. Jede HTTP? Nur 1? Okay. So können wir alle dieses Kerls Facebook-Account jetzt hacken. Für den größten Teil dieser hat sich standardmäßig eingeschaltet, zumindest in einigen Websites. Und lange Rede kurzer Sinn, wenn Ihre Web-Verkehr nicht verschlüsselt ist, nicht nur der HTML hin und her über die WIFIs unverschlüsselt, also Dinge wie Cookies hin und her in der Luft ohne jegliche Form der Verschlüsselung. Also, wenn Sie nur ein bisschen Programmierung versierte oder ein bisschen Googlen Fähigkeiten auf freie Software, die dies tut zu finden, ist alles, was Sie tun müssen, Starbucks sitzen oder in einem Flughafen sitzen, wo es in der Regel unverschlüsselt ist WiFi oder PHPSESSID: und nur nach Schlüsselwörtern wie Set-Cookie zu sehen denn wenn man die technische versierte müssen zusehen, wie die WiFi für alle Bits, die Strömung in der Luft für dieses Muster, Sie können dann sagen, dass Kerl PHPSESSID sein bo8dal und so weiter passiert. Und dann wieder, wenn Sie ausreichend technisch versierte oder das richtige Werkzeug, Sie können dann einfach neu eigenen Browser zu starten präsentieren, dass Handstempel um Facebook.com und Facebook ist nur davon ausgehen, dass Sie, dass Kerl sind weil alles, was sie wissen, ist nicht, wer du bist, sondern dass Sie diese eindeutige Kennung haben. Also, wenn Sie zu stehlen, dass eindeutige Kennung und präsentieren es auf der Web-Server als eigene, sie sind gerade dabei, zeigen Ihnen dieser Person Newsfeed oder dieser Person Nachrichten steckt. 

Und ich würde jetzt Google, wie HTTPS für Facebook vielleicht zu aktivieren. Aber es ist wirklich so einfach. Und so Facebook und Google und dergleichen bekommen haben wirklich gut darin, aber halten Sie ein Auge umso mehr für alle von Ihnen besuchten Websites, die nicht mit HTTP und haben eine Art von sensiblen Informationen über sie, ob es sich um finanzielle oder persönliche oder dergleichen. Wenn sie nicht verwenden Damit kann womöglich Cookies wie diese sehr leicht gestohlen und dann geschmiedet, und das ist genau das, was Firesheep tat. Sie hatten nicht ein Programmierer zu sein. Alles, was Sie tun musste, war eine Internet-Verbindung, laden Sie dieses kostenlose Tool, und was sie tun würde, ist, dass Sie sich anmelden und dann würde es zeigen Ihnen die Facebook-Namen von jeder in Sanders, in diesem besonderen Demonstration, um Sie und alles, was Sie tun musste, war auf ihren Namen klicken und die Software automatisiert den Prozess von Sniffing das Cookie, präsentiert es auf Facebook als Ihre eigene, und, voila, du eingeloggt Also das ist einer von diesen "dies nicht tun" offiziell. Wenn Sie Ihr eigenes Heimnetzwerk und haben Sie zu basteln, mit allen Mitteln, aber erkennen, das tut die Linie auf einem universitären Umfeld. 

Aber das Ziel ist hier wirklich zu betonen, nicht, wie dies zu tun aber wie man sich gegen diese Art von Dingen zu verteidigen. Und die triviale Lösung hier, obwohl es selbst fehlerhaft ist, ist es wirklich reduzieren den Einsatz von Websites, die nicht mit HTTPS ständig. So Sites wie Facebook und Google haben zunehmend Checkboxen wo Sie entscheiden, um diese Art der Sache, und Banken haben dies seit Jahren aus ähnlichen Gründen. Also nur ein wenig von einer Angst-Faktor, wenn wir können. Aber das ist es auf den Punkt. Das ist wie ein Server merkt sich, wer Sie sind. Und sobald sie sich erinnern können, wer Sie sind, können sie sich erinnern, etwas über Sie dass der Programmierer hat im Inneren dieser besonderen superglobal namens $ _SESSION gespeichert. Und für pset 7 verwenden wir es trivial, nur um eine int erinnern, nämlich die eindeutige ID des Benutzers, der sich angemeldet hat, so dass wir wissen, dass sie dort gewesen. Fragen Sie dann auf Sitzungen oder Cookies oder dergleichen? Firesheep nicht so gut funktionieren nicht mehr, und Sie müssen Ihren Computer in einen speziellen Promiscuous-Modus zu versetzen so dass Sie tatsächlich hören für den Verkehr neben euch. Also, wenn Sie gerade runterlädst Firesheep, erkennen, es ist nicht ganz so einfach wie es einmal war, zu demonstrieren. Gut. Und tun Sie es nicht in Sanders. Tun Sie es zu Hause. Datenbanken. Eines der Dinge, die wir in pset 7 hat ganz bewusst war, dass wir Ihnen eine Probe Datenbank-Tabelle für Benutzer, die einige Benutzer-IDs hat, einige Benutzernamen und einige verschlüsselte Passwörter darin. Und wie Sie sehen werden, wenn Sie nicht bereits haben, sind Sie gehen zu müssen, ändern Sie die Tabelle ein wenig. Sie gehen zu müssen, um etwas Cache zu jedem der Benutzer in dieser Tabelle hinzuzufügen, und du wirst zu haben, um eine andere Geschichte Tisch, ein Portfolios Tabelle hinzuzufügen, oder vielleicht nennen es etwas anderes. Aber in Bezug auf darüber nachzudenken, wie dies zu tun, öffnen wir bis dieses Tool denen wir verwendet am Freitag, aber wenn nicht vertraut, kommt das Gerät mit einem Werkzeug genannt phpMyAdmin die zufällig in PHP geschrieben ist, aber ihr Zweck im Leben, nachdem ich hier einloggen als jharvard mit roten, ist mir eine benutzerfreundliche Weise zum Anzeigen und Ändern meiner Datenbank. 

Die Datenbank, die ich auf dem Gerät ausgeführt wird, als MySQL. Dies ist sehr beliebt, und es ist ein freies Open-Source-Datenbank, die sich wunderbar einfach zu bedienen ist, vor allem mit Frontends wie diese. Was dieses Tool mir erlaubt, zu tun, zum Beispiel, ist herumzustochern Tabellen. Lassen Sie mich gehen Sie vor und tun dies. Am Freitag haben wir eine Tabelle namens Studenten, die super einfach war. Es hatte 3 Spalten - ID, Name und E-Mail - und ich manuell eingefügt ein paar Zeilen wie David und Mike in diesem speziellen Beispiel. Lassen Sie uns das ein bisschen weiter zu gehen, und nehmen wir an, dass wir mehr erinnern wollen als nur Namen und E-Mail über einen Benutzer. Lassen Sie mich auf Struktur hier an der Spitze. Und wieder geht der pset Sie durch die erforderlichen Schritte hier so mach dir keine Sorgen, wenn einige das ist ein bisschen schnell. Dann werde ich klicken Sie hier. Ich werde eine bestimmte Anzahl von Spalten nach E-Mail hinzufügen weil ich etwas wie Haus hinzufügen möchten. Ich habe vergessen, ein Student das Haus aufzunehmen. Lassen Sie mich auf Go, und jetzt haben wir diese Form, die leider ein wenig breit von links nach rechts, aber ich werde den Namen dieses Feldes Haus anrufen, und dann die Art habe ich jetzt zu wählen. So lassen Sie uns einen kurzen Plausch über die verschiedenen Arten in MySQL denn während PHP schwach typisiert und es irgendwie spielt schnell und locker mit Typen, in einer Datenbank vor allem ist es super wichtig, um tatsächlich Typisierung zu Ihrem Vorteil weil man der Dinge, MySQL und anderen Datenbank-Engines für Sie tun können ist sicherzustellen, dass Sie nicht setzen falsche Daten in Ihre Datenbank. Dies ist eine Art der freien Fehlerprüfung zur Verfügung. 

Für Haus, das wir natürlich nicht wollen, dass es ein int, die eine 32-Bit-Wert in MySQL ist. Wir haben zu reden kurz auf Freitag über varchar, die für variable Länge char steht. Was ist das? Diese können Sie angeben, dass Sie diese in einen String von einer Art sein soll. Es ist nicht wirklich im Voraus, wie lange es wissen, so dass wir willkürlich sagen, ein Haus Name kann 255 Zeichen lang sein, aber man konnte mit 32, 64 gehen - eine beliebige Anzahl wirklich. Aber der Vorteil der Verwendung eines varchar über ein Feld namens char ist was? Nur intuitiv, wenn ich nach unten scrollen hier bemerken, gibt es char und es gibt varchar. Varchar variabler Länge char; char ist ein fester Länge char. Also nur auf dieser Definition, ist das, was der Vorteil oder Nachteil von jedem von diesen? Mit anderen Worten, wer interessiert sich schon die Unterscheidung, oder warum sollten Sie darauf? 

Yeah. [Schüler] Varchar hat mehr Flexibilität, sondern nimmt mehr Speicher. Gut. Varchar nimmt mehr - Mal sehen. Ich bin mir nicht sicher, ob ich das richtig gehört. Können Sie sagen, dass einmal mehr? [Schüler] Ich sagte varchar hat wahrscheinlich mehr Flexibilität, aber es braucht mehr Speicher. Interesting. Okay. Varchar wahrscheinlich gibt Ihnen mehr Flexibilität, sondern nimmt mehr Speicher. Letzteres ist nicht unbedingt wahr. Es hängt vom Kontext ab, aber wir kommen darauf zurück. 

[Unverständlich Student Response] Genau. Es ist tatsächlich der Fall, dass char wird in der Regel mehr Speicherplatz weil ein char, wie in C, ist wie eine Kette, es ist ein Array von Zeichen. Also, wenn Sie sagen, ein char-Feld der Länge 255, die Datenbank wird buchstäblich werde Ihnen 255 Zeichen. Und wenn das Haus endet als MATHER und 6 Zeichen insgesamt, Sie mehr als 200 Zeichen zu verschwenden. 

So ein varchar effektiv verwendet nur so viele Zeichen wie nötig bis zu einer maximalen Menge. Aber der Preis, den Sie zahlen, ist tatsächlich die Leistung, möglicherweise. Wenn Sie im Voraus wissen, dass alle Ihre Saiten gehen zu 8 Zeichen lang sein - zum Beispiel annehmen, dass Sie Passwörter der Länge 8 erfordern - der Vorteil der Verwendung eines char-Feld gelegentlich, wenn auch nicht oft, ist eine feste Länge für so etwas wie ein Kennwort angeben denn jetzt kann die Datenbank noch klüger sein. Wenn es, dass jedes Feld Zeichen weiß ist jede Zeichenfolge in einer Spalte die gleiche Länge haben, Sie wieder die Funktion der wahlfreien Zugriff. Sie können hüpfen zwischen den verschiedenen char Felder in Ihrer Datenbank-Tabelle wegen einer Datenbank denken, wie Zeilen und Spalten. Also, wenn jeder von den Saiten ist die gleiche Länge, Sie wissen, dass das erste Byte 0 ist, ist die nächste bei Byte 8 und dann 16 und dann 24 und so weiter. Also, wenn alle Saiten von gleicher Länge sind, können Sie hüpfen viel effizienter. Also das kann ein Vorteil in Bezug auf Leistung sein, aber in der Regel müssen Sie nicht den Luxus im Voraus zu wissen, so dass ein varchar ist der Weg zu gehen. Hier ist ein weiteres Detail, dass auch Facebook in schließlich lief. Ints sind groß, und wir haben irgendwie nutzen sie standardmäßig zu jeder Zeit wollen wir eine Zahl, aber es ist nur 32 Bit. 

Und obwohl Facebook nicht ganz haben 4 Milliarden Nutzer jetzt es gibt definitiv einige Leute da draußen mit mehreren Konten oder Konten wurden geöffnet und wieder geschlossen, und so Facebook selbst. Ich glaube, vor ein paar Jahren musste Übergang von int um, wie es treffend genannt, bigint, die nur 64 Bit statt ist. So auch das ist eine Design-Entscheidung. Sie wäre unglaublich glücklich, wenn das endgültige Projekt wendet Start hat 4 Milliarden und 1 Benutzer, geben oder nehmen, in diesem Fall mit ints vielleicht ein wenig kurzsichtig. Aber in Wirklichkeit ist Ihr Benutzer-Tabelle wahrscheinlich gut mit ints. Aber für so etwas wie pset 7, wie Ihre Geschichte Tisch, haben Sie vielleicht Tausende, Millionen von Nutzern, wenn Sie entwickeln sich zu etrade.com. So während Sie vielleicht nicht mehr als 4 Milliarden Anwender jene Benutzer, die Sie zu tun haben könnte mehr als 4 Milliarden Transaktionen im Laufe der Zeit - kauft und verkauft und Dinge in ihrer Geschichte. Also, wenn Sie erwarten, zu tun - wieder, das sind gute Probleme haben, wenn Sie so viel Daten haben - wenn Sie erwarten, Daten über die Größe eines int, gehen mit so etwas wie bigint ist eine Richtung, die nicht häufig genug von Designern verabschiedet weil die Menschen Zahl, die nicht ist ein Problem zu sein, aber es ist so einfach, etwas größer als die Auswahl. Decimal wir in pset 7, die fester Genauigkeit legt mit so können Sie vermeiden, die Fragen im Zusammenhang mit Schwimmern und Doppelzimmer und Realen und dergleichen. 

Und dann gibt es einige andere Felder hier. Wir werden unsere Hände auf sie winken bis zu einem gewissen Ausmaß. Aber Daten, Zeiten haben alle einen vorgeschriebenen Format in MySQL, und der Vorteil der Speicherung von Daten als Daten und nicht VARCHARs bedeutet, dass die Datenbank tatsächlich formatieren sie in verschiedenen Formaten, ob ein US-Format oder europäischem Format oder dergleichen - aber Sie wollen, dass es - viel effizienter, als wenn es nur einige generische varchar. Und dann gibt es einige andere binary, varbinary Blobs. Dies sind binary large objects, und Sie können auch binäre Daten sowie geometrische Daten in einer Datenbank. Aber für uns wir typischerweise etwa ints und VARCHARs und dergleichen zu kümmern. Wir beenden dieses Beispiel mit Haus. Haus werde ich willkürlich sagen werde wird 255 Zeichen sein. Dann Standardwert konnten wir dies tun. Wir könnten standardmäßig jeden in Mather House, zum Beispiel. Das ist, wie wir angeben, dass die Datenbank sollten sicherstellen, dass immer jemand hat einen Wert. Aber ich lasse das sein. In der Tat, für Menschen, die aus leben Campus und nicht in einem Haus, vielleicht habe ich wirklich wollen, um anzugeben, dass der Standardwert für Haus NULL ist, und dann muss ich dieses Kontrollkästchen und geben Sie die Datenbank, es ist okay, wenn die Benutzer-Haus ist NULL. 

Auch dies ist ein weiterer Abwehrmechanismus Sie an Stelle setzen können Sie müssen also nicht einmal, um es in Ihrem PHP-Code unbedingt setzen. Die Datenbank wird sichergestellt, dass die Dinge sind oder nicht NULL. Und dann schließlich Attribute. Keiner von ihnen sind wirklich relevant. Binary, unsigniert - keiner von denen sind für eine varchar. Index. Hat jemand wissen oder vergessen haben oder eine Vermutung, was ein Index ist für so etwas wie Haus? Auch dies ist tatsächlich ein wichtiges und relativ einfach Design-Entscheidung. Für diejenigen, die sie noch nicht gesehen, am Freitag sprachen wir kurz über Primärschlüssel. In einer Datenbank-Tabelle ist ein Primärschlüssel das Feld oder Spalte eindeutig identifiziert Zeilen in der Tabelle. So in der aktuellen Tabelle haben wir IDs haben wir Namen und E-Mails. Welche von denen ist der beste Kandidat für ein Primärschlüssel sein, deren Aufgabe es ist eindeutig zu identifizieren Zeilen? Wahrscheinlich ID. Wohl konnten wir auch nutzen, was eigentlich? Vielleicht könnten Sie nutzen E-Mail, weil es in der Theorie einzigartig ist es sei denn, die Menschen teilen sich E-Mail-Konten. Aber die Realität ist, dass, wenn Sie mit einer numerischen ID wie 1234, das ist nur 32 Bit, während ein E-Mail-Adresse Diese viele Bytes oder diese viele Bytes sein könnte. So in Bezug auf Effizienz eindeutige Kennungen, es neigt dazu, eine gute Übung, nur um eine int verwenden auch wenn Sie eine Schnur Kandidaten, dass Sie wohl gebrauchen könnte. 

Für so etwas wie Haus, sollte dies nicht ein Primärschlüssel sein weil dann nur 1 Person könnte in Mather leben und 1 Person im Currier und dergleichen. Desgleichen sollte diese nicht eindeutig sein. Die Differenz zwischen primären und einzigartig ist, dass im Fall der aktuellen Tabelle, ID wäre primär, sondern E-Mail ist nicht primär für den Grund, warum wir gerade erwähnt - Leistung - aber es sollte noch eindeutig sein. So können Sie immer noch Eindeutigkeit erzwingen, ohne den Anspruch dass es ein super wichtig primären Sichtfeld. Aber dieses ist sehr hilfreich: Index. Wenn Sie wissen im Voraus für Ihre Abschlussarbeit, für pset 7, oder im allgemeinen, dass dieses Feld Haus wird etwas, das man auf eine Menge zu suchen sein, mit dem Schlüsselwort SELECT oder etwas anderes, dann kann man präventiv sagen, die Datenbank, um ihre Magie zu arbeiten und stellen Sie sicher, dass es in Erinnerung schafft keine Lust Datenstrukturen notwendig Recherchen nach Hause Basis zu beschleunigen. Vielleicht wird es eine Hash-Tabelle zu verwenden, vielleicht wird es mit einem verketteten Liste. In Wirklichkeit ist es, einen Baum zu verwenden pflegt, heißt oft eine Struktur eines B-Baum - kein binärer Baum, sondern ein B-Baum - das ist ein sehr breit Baum dass Sie vielleicht in einer Klasse wie cs124 die Datenstrukturen Klasse zu sehen. Aber kurz gesagt, müssen Sie nicht über, dass bei Verwendung intelligente Datenbank-Software kümmern. Sie können nur sagen, dass es, "Index dieses Feld, damit ich auf sie effizienter durchsuchen können." 

Wenn Sie diese aus und lassen Sie versuchen, für alle in der Datenbank, die in Mather lebt suchen, es wird in eine lineare Suche über. Und wenn du hast 6.000 undergrads alle leben in einem Haus, Sie gehen, um die gesamte Tabelle zu suchen, um die Matherites finden, während, wenn Sie sagen Index, hoffentlich wird es etwas enger zu einer logarithmischen Suche sein diese Arten von Studenten. Dies ist nur eine kostenlose Funktion einzuschalten, obwohl es nicht zu einem Preis von rund Menge an Speicherplatz kommen. Schließlich auto-increment, diese AI Feld das bedeutet nur, wenn es ein int ist und Sie nicht wollen, zu kümmern zu erhöhen it yourself jedes Mal, wenn es einen neuen Benutzer zu überprüfen, dass und jeder Benutzer, die eingefügt wird, erhalten automatisch eine neue ID. Lassen Sie auf Speichern, und jetzt lassen Sie uns Fehler mit diesem Entwurf. Wenn ich gehe in Blättern Beachten Sie, dass sowohl Mike und mein Haus NULL ist. Ich kann phpMyAdmin diese manuell bearbeiten. Ich kann gehen, hier und geben Mather und dann die Eingabetaste drücken, und jetzt feststellen, die Tabelle ist anders. Aber ich merke, könnte auch noch etwas anderes zu tun. Davids ID ist 1, so phpMyAdmin ist wieder nur ein administratives Werkzeug; Das ist nicht etwas, was Ihre Benutzer immer gehen, um zu sehen. Also, wenn ich stattdessen auf die Registerkarte SQL up top - und wieder wird pset 7 Sie mehr von dieser Abfragen einzuführen - Ich kann manuell ausführen SQL Structured Query Language-Befehl UPDATE users SET Haus = 'Pfoho' WHERE id = 1. Diese SQL-Abfragen, schön genug, ziemlich lesbar von links nach rechts. Aktualisieren Sie die Benutzer-Tabelle, setzen Sie das Feld namens Haus Pfoho sich der Benutzer-ID 1 ist. Oder ich könnte auch tun, wo email = 'malan@harvard.edu'. Solange eindeutig identifiziert mir, das wäre so gut funktionieren. Aber ID um eine höhere Leistung zu sein pflegt, so lasst uns das tun. Lasst uns auf Go. Okay, nicht lecture.users nicht existieren. Was ist mein Fehler? Was ist die Tabelle tatsächlich als hier? Es heißt Schüler, nur weil das ist, was wir hier getan hat oben links. Es nennt sich Studenten, nicht Nutzer. So klicken Sie jetzt gehen. 1 row betroffen. Abfrage dauerte 0,01 Sekunden. Wenn ich auf Jetzt durchsuchen, jetzt Malan lebt in Pfoho. Also das ist ein weiterer Vorgeschmack auf SQL, aber die pset werden Sie durch ein bisschen mehr von diesem Spaziergang. 

Es ist eine dumme Entscheidung, die ich schon gemacht habe hier. Ich würde argumentieren, dass diese Datenbank-Design ist ineffizient denn je mehr Leute, die ich in den der Schüler Tisch, Je mehr von uns beginne ich hinzufügen, die mehrere der TFs ich damit beginnen, werden wir beginnen, zu sehen, was Redundanzen in dieser Tabelle? 

Yeah. [Schüler] Sehen, dass es bei den Schülern ist, verwenden wir die gleiche [unverständlich] Das Gleiche - Richtig, genau. Also, wenn 400 Menschen in Mather leben, geben oder nehmen, schließlich diese Tabelle wird auf 400 Zeilen, die "Mather", "Mather sagen haben" "Mather", "Mather", "Mather." Wir verschwenden all diese Bytes, und es gibt ein paar Imbissbuden gibt. 1, gibt es das verrückte Ecke Fall, wenn jemand zahlt eine Menge Geld und benennt Mather, haben wir jetzt unsere ganze Datenbank-Tabelle zu ändern. Das ist nicht zu oft passieren, obwohl Pfoho einmal genannt wurde North House vor 15 Jahren, so ist es passiert. Aber das ist nicht alles, was überzeugend. Zwingender als eine Ecke Fall wie dem des Müssens, um die Daten in großen Mengen zu aktualisieren für eine Datenbank ist, warum sind Sie die Speicherung MATHER wieder und wieder und wieder und wieder? Das ist eine Menge von Zeichen, 6 Zeichen. Können wir nicht noch besser machen als die, vor allem für Pforzheimer? Sicherlich können wir besser machen, als dass viele Zeichen. Warum nicht einfach zuordnen eine eindeutige Kennung mit jedem Haus und speichern, die für jeden Benutzer? Also lasst uns versuchen. Anstatt einfach die Schüler Tisch, lass mich gehen bis zu meinem Vortrag Datenbank hier oben links. Beachten Sie hier heißt es Tabelle erstellen. Lassen Sie mich eine neue Tabelle namens Häuser. Die Anzahl der Spalten wird 2 sein. Enter. Jetzt habe ich 2 Felder. Ich werde nennen dies die Namen, und es wird ein varchar der Länge 255 sein, 

aber das ist ziemlich willkürlich. Lassen Sie mich dies hier unten durch Konvention gestellt. So setzen Sie eine ID hier. Lassen Sie geben jedem Haus eine eindeutige Kennung. Geben wir jedem Haus einen Namen. Lassen Sie festlegen, dass die Kennung wird nur durch Konvention unsigned um nur positive Zahlen. Fahren wir fort und geben diese ein Auto-increment-Feld für jetzt. Und brauchen wir etwas anderes? Fahren wir fort und klicken Sie auf Speichern. Jetzt habe ich eine zweite Tabelle. Beachten Sie als beiseite dies der etwas kryptischen SQL-Befehl Sie hätte, um manuell eingeben, wenn nicht mit einem Administrator-Tool wie phpMyAdmin. So ein weiterer Grund, warum wir sie verwenden. Es ist wunderbar nützliche Art von pädagogisch, weil Sie klicken können, um und herauszufinden, wie die Dinge nur durch Kopieren und Einfügen, was phpMyAdmin haben zu arbeiten. Aber die CREATE TABLE-Befehl ist, was gerade ausgeführt wird, und hier ist mein Tisch. Lassen Sie mich gehen Sie jetzt und nutzen raw SQL anstatt vereinfachen, indem Sie auf die Registerkarte Einfügen. Lassen Sie mich nicht in die Häuser INSERT, und ich werde sagen, der Name des Hauses wird ein Wert von 'Mather' haben. Das war's. Diese Syntax ist ein wenig mehr kryptisch. Dies ist der Name der Felder, die wir einfügen wollen. Dies sind die Werte, die wir wollen in diesen Bereichen einzusetzen. Lassen Sie mich auf Start klicken. 1 Zeile eingefügt dauerte 0,02 Sekunden. Lassen Sie mich auf Jetzt durchsuchen. 

Beachten Sie, wenn ich auf Durchsuchen klicken, gibt es Mather, dessen ID durch Automatisierung die Nummer 1. Lass es mich tun eine andere. Lassen Sie mich in der Registerkarte SQL gehen. INSERT INTO Häuser. Der Name des Hauses wird einen Wert von Pfoho haben und so weiter. Gehen. Und ich kann weiter machen dies wieder und wieder und wieder. Oder wenn Sie sich langweilen mit phpMyAdmin, können Sie einfach auf die Registerkarte Einfügen und nicht um die rohe SQL eingeben. Sie können einfach schlagen es schneller, indem Sie zum Beispiel, Currier, Enter, und jetzt, wenn wir auf Durchsuchen klicken, gibt es Currier mit der ID 3. Also das ist, was wir mit auto-increment bedeuten. Aber jetzt haben wir etwas bei den Schülern zu beheben. In die Schüler, was sollte der Datentyp des Hauses Feld nun sein? Es sollte ein int sein, richtig? Also das Ziel ist hier ausklammern, sonst wie zu normalisieren bekannt, die Tische so dass wir speichern keine Informationen redundant in keinem meiner Tabellen. Und wieder wird der Weg, den wir hier wollten Mather, Mather sagen, Mather, Mather, Pfoho, Pfoho, Pfoho, Pfoho, die sehr überflüssig ist im Hinblick auf die Verschwendung von den Zeichen. Also lass mich gehen Sie vor, und dies ändern, indem Sie auf Struktur, und lassen Sie mich gehen Sie vor und überprüfen Sie das Haus Feld klicken Sie auf Ändern, und jetzt werde ich dies zu ändern int sein. 255 ist nicht mehr relevant. Lassen Sie mich gehen Sie vor und sagen, dass ist gut, wenn es immer noch NULL. Speichern. Jetzt Tabelle Schüler wurde erfolgreich geändert, und wieder bemerken Haus ist ein int. Nebenbei, ignorieren Sie die Zahl in Klammern, wenn es um ints kommt. 

Dies ist für Legacy Gründen. Zurück in den Tag, wenn Sie nicht über GUIs, Sie stattdessen hatte eine Befehlszeile Umwelt, die 10 und 11 angegeben, wie viele Zeichen Sie soll zeigen, in das Terminal-Fenster tatsächlich angezeigt Feldern. Es hat nichts mit der Bit-Länge des eigentlichen Feld zu tun, so dass wir einfach ignorieren, dass für jetzt. Jetzt habe ich in dieser Tabelle gehen. Und wenn David in Mather lebt, sollte Haus nicht 0 sein, das ist ein Standard-int Wert am nächsten auf NULL. Er sollte in Haus 1 leben. Lasst uns willkürlich sagen, dass Mike lebt in Pfoho, so Hausnummer 2. Jetzt ist meine Tabelle sieht ein wenig mehr kryptisch. Aber bedenken Sie die Effizienz. Ich bin jetzt mit nur 32 Bit, um das Haus zu identifizieren, was bedeutet, es gibt nur 1 kanonischen Definition von meinem Haus Mather und Pfoho und das ist in den Häusern Tisch. Also, wenn ich jetzt wieder anzuschließen diese Tabellen wollen, der es auf diese Weise zu denken. Hier habe ich meinen Schülern Tisch, und auf der rechten Seite gibt es diese Zahlen, 1 und 2. 1 ist Mather, 2 Pfoho. Wir haben die gleichen Zahlen in dieser anderen Tabelle, die als Häuser wird, 1 und 2 und 3 für die drei Häuser. Was wir jetzt wollen, ist die Möglichkeit im Code, PHP und SQL, zur sortieren anzuschließen diese Tische, wo, wenn dies sind die Studenten und das sind die Häuser, Wir wollen irgendwie kombinieren, so dass ein Linien mit 1, 2 Zeilen mit 2, und damit wir herausfinden können, wo David und wo Mike und wo alle anderen lebt. Um dies zu tun, können wir eine SQL-Abfrage wie folgt aus. SELECT * FROM Schüler JOIN Häusern ON - Und nun, was Feldern wollen wir auf beitreten? So students.house = houses.id. 

Ein wenig kryptisch, aber dieser Teil bedeutet wörtlich eine neue temporäre Tabelle Das ist das Ergebnis des Beitritts Studenten und Häuser. Und wie wollen Sie die Fingerspitzen hier kombinieren? Set der Studierenden Haus Feld gleich der Häuser ID-Feld. Und wenn ich jetzt klicken Sie auf Go, bekomme ich wieder genau das, was ich erhofft hatte. David ist in Mather, ist Mike in Pfoho, und ich sehe auch die eindeutigen IDs. Aber der Punkt ist jetzt habe ich eine komplette Tabelle. Und so ist die takeaway hier für pset 7 oder wirklich für das endgültige Projekt: Wenn Sie feststellen, dass Sie die Speicherung jedes Stück Information redundant ob es ein Haus ist, vielleicht ist es eine Stadt, Staat und Postleitzahl wo ZIP können in der Regel, aber nicht immer als eindeutige Kennung verwendet werden, Sie durch die Ausübung geistig und dann mit so etwas wie phpMyAdmin Factoring darauf hin, dass gemeinsame Daten, da insbesondere Ihre Website erhält mehr gut genutzt und mehr populär, ist dies, wie Sie sicher, dass alles super schnell ist zu machen, indem die Datenbank so viele Hinweise auf Einzigartigkeit als möglich. Das war eine Menge. Haben Sie Fragen? Gut. Werfen wir einen 5-minütigen Pause gibt und neu zu gruppieren. Gut. Das Folgende ist ein Beispiel, das vor einigen Jahren verwendet wurde, wenn ich CS161 stattfand, das ist die Betriebssysteme Klasse an der Hochschule die ist dafür erstaunlich bekannt, aber eine verrückte Menge an Arbeit, und es konzentriert sich wirklich auf einige der Low-Level-Probleme, die in Betriebssystemen ergeben und auch selbst in der Welt der Datenbanken. 

Die Geschichte, die von meinem Professor, Margo Seltzer, wurde gesagt, dass Jahr war wie folgt. Angenommen, Sie haben ein wenig dorm Kühlschrank für Sie und Ihre Mitbewohner haben und Sie beide wirklich gerne Milch. So Sie nach Hause kommen von der Klasse 1 Tag, ist Ihr Mitbewohner noch nicht da, Sie öffnen den Kühlschrank, und man merkt, "Oh verdammt, wir sind der Milch." So Sie den Kühlschrank zu schließen, gehen Sie über die Straße zu CVS und in den immer lange Schlangen zu bekommen, um etwas Milch bei CVS kaufen. Unterdessen kommt Ihre Mitbewohner Hause von seiner Klasse, kommt in den Raum, öffnet den Kühlschrank wirklich wollen etwas Milch, öffnet den Kühlschrank und: "Verdammt, keine Milch." So schließt er oder sie den Kühlschrank, geht aus der Tür und geht zum ABP oder irgendwo anders als CVS, wo du nicht gehst, um über den Weg zu holen etwas Milch. Natürlich ein paar Minuten später, bekommen Sie beide wieder nach Hause und jetzt haben Sie doppelt so viel Milch, wie Sie eigentlich wollte. Und als Milch, jetzt wird es zu gehen schlecht, weil man Milch möchte aber man weiß nicht wirklich wie Milch, so jetzt haben Sie zu viel Milch, so es wird sauer. Dies ist eine schreckliche, schreckliche Situation. Was könnte dieses Dilemma gelöst haben, wenn Sie das erste Mitbewohner zu Hause waren? Ja. [Student] Sie sollten eine Notiz hinterlassen haben. [Gelächter] Gut. Sie sollten eine Notiz hinterlassen haben. Sie sollten einen Post-it Note oder dergleichen zu sagen, gesetzt haben "Gone für Milch," und dann Ihre Mitbewohner konzeptionell würde gesperrt haben tatsächlich tun. Oder Sie könnten ein Schritt weiter gehen. Man konnte buchstäblich sperren den Kühlschrank mit irgendeiner Art von Vorhängeschloss, und jetzt Ihre Mitbewohner werden buchstäblich aus dem Kühlschrank gesperrt werden. Wenn wir zurück zu verallgemeinern, um die Programmierung, Sie können fast aus dem Kühlschrank denken, als eine Art von Variablen oder einer Struktur, eine Art Container für Informationen. Das Problem grundlegend ist, dass Sie beide durften zu inspizieren oder lesen Sie den Zustand dieser Datenstruktur, aber man sah es zu verschiedenen Zeiten und doch beide von Ihnen eine Entscheidung getroffen basierend auf dem Zustand der Welt zu diesen verschiedenen Zeitpunkten. So hatte sie eingesperrt den Kühlschrank, würde man zumindest vermieden haben Ihre Mitbewohner aus der Lage gewesen, um den Zustand der Welt zu inspizieren, damit er oder sie nicht die gleiche Entscheidung getroffen haben. So Datenbanken, wie sich herausstellt, haben dieses Problem ständig. 

Mal sehen, ob wir ein Szenario konstruieren können. Angenommen, Sie haben eine Art von schlechten Kerl bist und du gehst an die Bank of America oder einer der anderen Orten an dem Platz, ein paar Geldautomaten nebeneinander haben, und irgendwie hat man herausgefunden, wie man eine ATM-Karte duplizieren - gar nicht so schwer. Es ist nur ein Magnetstreifen. Und so, was Sie wollen, um zu versuchen zu tun ist, dieses Spiel zu spielen wobei Sie lege 1 Karte in 1 Maschine, eine weitere Karte in die andere Maschine, und Sie Wesentlichen wollen versuchen, Geld gleichzeitig abheben, weil mir vorstellen, dass Geschichte geht wie folgt. Die Maschine, auf der linken Seite nimmt den Schutz Ihrer Karte und Ihrer PIN, und dann sagen Sie: "Gib mir 100 Dollar." Der ATM ist so programmiert, zuerst eine Auswahl ihrer Datenbank oder den Gegenwert - was Datenbank ist es mit - um zu sehen, bedeutet dies Benutzer haben mindestens $ 100 in seinem Konto? Wenn ja, dann spuckte die $ 100 und subtrahieren 100 $ aus ihrem Gleichgewicht. Aber natürlich, wenn es mehrere Maschinen hier oder mehrere Möglichkeiten der Inspektion der Staat dieser Welt, der Banktresor, um zu sehen, wie viel Geld Sie haben, annehmen, dass nur durch Zufall die Maschine auf der linken und der rechten sowohl diese Frage stellen ungefähr zur selben Zeitpunkt. 

Und das kann durchaus passieren. Geldautomaten sind Computer in diesen Tagen. Also, wenn die Maschine auf der linken sagt: "Ja, Sie haben mindestens $ 100," mittlerweile die Maschine auf der rechten sagt: "Ja, du mindestens $ 100 zu haben", dann beide von ihnen gehen, um ihre Programme zu beenden und tatsächlich spuckte die $ 100 und sagen: "Zuvor $ 200 hatte." "Lassen Sie mich aktualisieren variable jetzt $ 100 auf dem Konto übrig sein." Aber wenn sie beide Ihren Kontostand überprüft und festgestellt, dass es $ 200 und beide dann die Mathematik zu tun und zu sagen 200 bis 100, die Maschinen möglicherweise spuckte zwei $ 100 Rechnungen in jeder Maschine, aber sie haben nur Ihre Summe Kontostand aktualisiert, um $ 100 sein. In anderen Worten, Sie haben 200 Euro übernommen, sondern weil sie kontrolliert den Zustand der Welt gleichzeitig und machte dann eine Entscheidung über diesen Wert basiert, sie könnten nicht die Mathematik letztlich richtig. So in einer Bank Situation zu Sie wirklich wollen, um irgendeine Art von Lockout haben so dass, sobald Sie haben den Zustand einiger variable geprüft Das ist wirklich wichtig, wie Ihr Kontostand, lassen Sie sich nicht jemand anderes entscheiden auf der Grundlage dieser, bis Sie fertig machen Ihre Sache, wobei in diesem Fall sind Sie der ATM auf der linken Seite. Sperren alle anderen aus. Sie können tatsächlich diesen Effekt zu erzielen in ein paar verschiedene Möglichkeiten. 

Der einfachste Weg in MySQL ist eine SQL-Zeile, dass wir euch gegeben haben das Problem set-Spezifikation, die genau so aussieht. Legen Sie in der Tabelle - was auch immer es genannt wird - eine ID, ein Symbol und eine Aktie, eine Anzahl von Aktien, die folgenden Werte, zum Beispiel. Wenn Sie noch nicht gelesen haben das spec doch ist dies ein Beispiel für die Einbindung, wie Sie gehen über Kauf von 10 Aktien dieser penny stock for President Skroob, , deren Benutzer-ID für die Zahlen 7? Das sagt INSERT INTO Tabelle die folgende ID, Symbol und die Anzahl der Aktien von 7, 'DVN.V' und 10. Aber - aber, aber, aber - in der zweiten Zeile ist die wichtigste. ON DUPLICATE KEY UPDATE Aktien = Aktien + VALUES (Aktien). So ganz kryptische Aussagen auf den ersten Blick. Aber die Tatsache, dass diese SQL-Abfrage, obwohl es Wraps auf 2 Linien, ist ein lange Abfrage, bedeutet dies, es ist Atom in dem Sinne, dass diese Abfrage entweder alle zusammen oder gar nicht ausgeführt werden. Und nach Definition von MySQL, das ist, wie sie diese Abfrage durchgeführt. Es ist per Definition in der Anleitung garantiert alle auf einmal oder überhaupt nicht ausgeführt wird. Die Motivation dafür ist wie folgt. Wenn Sie in diesem Fall versuchen, 10 Aktien von Aktien zu kaufen, es ist irgendwie die gleiche Geschichte wie die Milch, es ist irgendwie die gleiche Geschichte wie der ATM. 

Wenn Sie machen den Fehler, nicht mit dieser Syntax sondern die Auswahl aus der Datenbank zu sehen, wie viele Aktien dieser penny stock hat Präsident Skroob haben, und nehme an, er hat 10 Aktien, und dann einige Sekundenbruchteile später werden Sie dann tun eine UPDATE-Anweisung, das ist eine andere Anweisung in SQL, gehen Sie vor und fügen Sie 10 weitere Aktien, sagt seiner derzeitigen 10, so dass im Idealfall die Summe 20, das Problem ist, weil in der heutigen Datenbank-Systeme und weil in der heutigen Computern Sie haben mehrere Prozessoren, mehrere Kerne - in anderen Worten, können Computer buchstäblich dabei mehrere Dinge auf einmal - es gibt keine Garantie, dass Ihre SELECT und Ihre UPDATE in diesem Fall werden passieren Rücken an Rücken. So ein schlechtes Szenario wäre Sie die SELECT um zu sehen, wie viele Aktien dieser Penny Stock ist Skroob haben, und dann nur durch Zufall ein weiteres Datenbank-Abfrage wird ausgeführt - vielleicht seine Skroob in einem anderen Browserfenster versucht bis 10 Aktien kaufen in einem anderen Fenster ganz ähnlich wie die ATM - und annehmen, dass eine weitere Abfrage zwischen SELECT und UPDATE bekommt. Es könnte sein, dass Skroob verliert jetzt eine gewisse Anzahl von Aktien werden da ein anderer Prozess wird die Kontrolle des Zustands seiner Welt, oder er bekommt mehr Aktien, als er haben sollte. Wir werden nicht in die Einzelheiten genau das, was diese besondere Geschichte Linien würde gehen, aber der Punkt ist, wenn Sie eine Variablen-Wert überprüfen und dann eine Entscheidung treffen müssen, wenn es ein Risiko, dass jemand anderes etwas zwischen diesen 2 Aussagen, wie in Multiprozessor-Systemen auftreten, in Multicore-Systemen, Computer mit der Fähigkeit, mehrere Dinge gleichzeitig zu tun, können schlimme Dinge passieren wie Bankkonten falsch, belastet den Kauf doppelt so viel Milch, oder in diesem Fall die falsche Anzahl der Aktien. Aber gibt es einen einfacheren Weg, um darüber nachzudenken. 

Es stellt sich heraus, dass SQL unterstützt auch, wenn Sie Ihren Tisch korrekt zu konfigurieren, etwas namens Transaktionen, die würde ich argumentieren, ist eigentlich noch einfacher zu verstehen als dieses, aber es ist nicht eine 1-Liner, so ist es eigentlich ein bisschen komplizierter. Es ist buchstäblich ein Statement in SQL aufgerufen START TRANSACTION. So wie es ist SELECT, UPDATE, INSERT, DELETE und JOIN und eine Reihe von anderen, gibt es Schlüsselwörter wie START TRANSACTION. Und was Sie dann tun im Rahmen der pset 7 - Sie müssen nicht, dies für pset 7 zu tun, es ist ausdrücklich als nicht notwendig abgelehnt, aber für die endgültige Projekten kann es sinnvoll sein - wenn Sie anrufen eine Abfrage START TRANSACTION und dann eine weitere Abfrage und dann eine weitere Abfrage und dann noch eine andere, und eine andere, diese Abfragen nicht wirklich ausgeführt, bis rufen Sie die SQL-Anweisung COMMIT werden, An diesem Punkt, ob es 2 Aussagen oder 20 Aussagen ist, werden sie alle auf einmal ausgeführt werden, was bedeutet, niemand sonst kann versehentlich kaufen zu viel Milch oder Debitkarte zu viel Geld oder kaufen zu viele Aktien, weil alle Ihre Anfragen werden ausgeführt Rücken an Rücken an Rücken an Rücken. Und das ist super wichtig, vor allem, wenn du tust so etwas. Dies ist eine willkürliche Beispiel, lasst uns zu aktualisieren das Bankkonto, sagt indem ein Gleichgewicht gleich Balance - $ 1000, wo die Kontonummer 2 ist. Und dann die zweite Aussage ist nun lasst uns hinterlegen, dass 1000 $ in jemand anderes Bankkonto, dessen Kontonummer 1. 

Mit anderen Worten, dies ist ein perfektes Beispiel dafür, wo Sie wollen, um sicherzustellen, dass diese beiden Aussagen geschehen oder überhaupt nicht weil sonst der Kunde wird bekommen verschraubt und du wirst ihr Geld nehmen und nicht einzahlen es anderswo, oder die Bank wird bekommen verschraubt, wohin Sie gehen, um das Geld zu hinterlegen sind aber nicht tatsächlich subtrahieren sie von dem Konto des Benutzers. Sie wollen also beide zur Ausführung zusammen. So tritt in der Welt Transaktionen. Also das ist etwas in der Rückseite Ihres Geistes zu halten, nicht so sehr für die Zwecke nur eine endgültige Projekt aber wenn Sie möchten, um Ihre endgültige Projekt irgendwo treffen, Wenn Sie starten wollen einige Unternehmen um ihn herum, wenn Sie wollen, um einige studentische Gruppe das Problem auf dem Campus zu lösen und tatsächlich eine Live, aktive Website, dies sind die Art der subtilen Fehler, die auftreten können Wenn Sie nicht ganz zu durchdenken, was passieren kann, wenn 2 Personen versuchen, Ihre Website zugreifen zu buchstäblich im selben Moment in der Zeit, wobei deren Abfragen sonst verwoben zu werden. 

Ready for some JavaScript, a teaser davon? Dies ist unsere letzte Sprache für das Semester. Gut. Glücklicherweise sieht JavaScript sehr, sehr, sehr ähnlich zu den 2 Sprachen, C und PHP, haben wir bisher getan. Es gibt keine JavaScript in pset 7, aber es ist ein unglaublich nützliches Werkzeug wenn es darum geht zu tun webbasierte letzten Projekte oder wirklich nur Web-Programmierung im Allgemeinen. So einen schnellen Überblick über etwas namens DOM. Hier ist eine super einfache Web-Seite, die wirklich nur sagt Hallo Welt sowohl im Titel und in den Körper. Da die Einkerbung hat seit einiger Zeit darauf hindeutet, es ist in der Tat eine Hierarchie zu Webseiten. Ich könnte das gleiche Ausschnitt des HTML als Baum zu zeichnen, Denken zurück zu unserer Diskussion von Datenstrukturen in C, wie folgt. Ich habe einige spezielle Wurzelknoten bezeichnet das Dokument Knoten und wir werden das analoge dies in JavaScript in nur einem Augenblick sehen. Das erste Kind und einzige Kind, dass in diesem Fall ist das HTML-Tag. Es gibt keine direkte Zuordnung des doctype. Das ist eine besondere Sache, also sollten wir es einfach ignorieren, wenn es um dieses DOM kommt, Diese Document Object Model Baum. Beachten Sie, dass das HTML-Tag, das ich willkürlich habe als Rechteck dargestellt, hat 2 Kinder: Kopf und Körper. 

Diese werden ebenfalls als Rechtecke gezeichnet. Es ist sinnvoll, bildhaft, dass der Kopf auf der linken Körper ist. Die Implikation ist, dass Kopf zuerst kommt im Baum. So gibt es tatsächlich eine Bestellung an einen Baum, wenn Sie es so zu zeichnen, obwohl die Formen und so weiter sind willkürlich. Leiter der Zwischenzeit hat ein einziges Kind namens Titel, und Titel hat eigentlich seine eigene Kind, das "Hallo Welt" ist, die ich bewusst machte, wie eine ovale hier, um es etwas anders aus dem Rechteck. Diese Rechtecke sind Elemente, während hallo, Welt wirklich ein Text-Knoten. Es ist also ein Knoten im Baum, aber es ist eine andere Art von Knoten so zog ich es beliebig anders. Ähnlich funktioniert Körper haben ein Kind namens hallo, Welt als gut, so anderen Knoten, obwohl sie zufällig sind die gleichen Text, aber ich habe es gezeichnet mit der gleichen Form. So who cares? Nun, was ist schön zu HTML ist, dass es diese hierarchische Natur haben. Und was ist schön zu JavaScript und insbesondere Bibliotheken, die frei verfügbar sind und beliebt wie jQuery, können Sie in der Baumstruktur so verblüffend einfach. Jede der Sachen, die wir in C haben mit Zeigern und Verfahrgeschwindigkeit Bäume und rekursiv auf Knoten linke Kind nach rechts Kind plötzlich wir sortieren können für selbstverständlich als erstaunlich aufschlussreich, wenn nicht ein bisschen frustrierend aber nicht annähernd eine effiziente Möglichkeit, über die Programmierung gehen. Und so mit diesen höheren Programmiersprachen wie JavaScript wir in der Lage sein, diesen Baum viel intuitiver navigieren. 

Und in der Tat ist die Syntax sein wird ziemlich vertraut. Wenn Sie noch nie JavaScript zuvor gesehen, ist dies eine wirklich schöne Referenz von den Mozilla Leute, die Leute, die machen Firefox, also zögern Sie nicht, dass an Ihrer Bequemlichkeit zu durchsuchen. Was Sie zu finden - und diese Folien sind identisch, was wir früher den anderen Tag - ebenso ist Haupt gegangen. Also, wenn Sie ein Programm in JavaScript zu schreiben, gibt es keine Hauptfunktion. Starten Sie einfach das Schreiben von Code. Aber ein wesentlicher Unterschied zwischen JavaScript und C und PHP ist, dass während C und PHP bisher wurden serverseitig ausgeführt durch das Gerät in diesem Fall oder allgemeiner von einem Server, JavaScript by design ist in der Regel von einem Browser ausgeführt wird. In anderen Worten, schreibt man JavaScript-Code, wie wir zu erleben auf einem Server in das Gerät, aber Sie sind es unter Ihren HTML, unter Ihren CSS, unter Ihren GIFs und Ihre PNGs und Ihre JPEGs so dass, wenn der Benutzer Ihre Web-Seite besucht, wenn Sie mit JavaScript, , dass JavaScript-Code wird vom Server zum Browser, und es ist der Browser tatsächlich ausführt. So hat dies sinnvolle Konsequenzen für noch geistigen Eigentums. Es ist irgendwie albern, auch um den Schutz Ihrer IP denken, wenn es um JavaScript-Code kommt weil von der Natur der Sprache wird sie in der Regel Browser-Seite ausgeführt. 

Sie können verschleiern sie, was bedeutet, können Sie es sehen verrückt und hässlich ohne Leerzeichen, horrible Variablennamen, machen es schwieriger für die Menschen, um Ihre IP stehlen, aber der Schlüssel ist, dass es seitlich Browser ausgeführt wird. Obwohl als beiseite JavaScript verwendet werden Server-Seite, die häufigste Anwendungsfall ist im Moment noch auf dem Browser. Und hier ist, wie es aussieht. Hier ist ein if-else if-else wie C konstruieren, wie PHP. Hier ist ein boolescher Ausdruck, wenn Sie "oder" 2 Dinge zusammen. Hier ist, wenn Sie "und" 2 Dinge zusammen. Hier ist eine switch-Anweisung, die ähnlich wie PHP ist dass können Sie auf verschiedene Arten von Werten zu wechseln. Loops haben ähnlich for-Schleifen hier, was identisch zu dem, was wir bisher gesehen haben strukturiert. While-Schleifen, wir haben while-Schleifen zu tun. Variablen, jemals so etwas anders. Sie Variablen deklarieren, wie Sie in PHP und C zu tun, aber ähnlich ist JavaScript schwach typisiert. Sie geben keinen int oder float oder String oder so etwas in der Regel. Sie können angeben, var. Sie müssen nicht var angeben, aber es hat Auswirkungen, wenn Sie nicht zu tun. Normalerweise, wenn Sie var weglassen, Sie versehentlich eine globale Variable statt local. Also lassen Sie mich schlagen vor, dass Sie fast immer nur sagen var und dann den Namen der Variablen. Es ist nicht eine Art, es ist nur var für variable. Dies wäre ein Beispiel sein, ob es 123 oder "Hallo Welt" ist. Arrays vorhanden sind und syntaktisch ähnlich wie PHP. Ich werde sagen, var Zahlen und dann verwende ich eckigen Klammern wieder auf eine Variable deklarieren deren Typ Array, das diese besonderen Zahlen in durch Komma getrennt hat. Und dann endlich, das ist das einzige, das wirklich anders aussieht. Daran erinnern, dass in PHP würden wir ein assoziatives Array für einen Studenten umgesetzt haben wie Zamyla das könnte so aussehen, wo die Variable heißt Student. Die eckigen Klammern bedeuten, hier kommt ein Array. 

Die Tatsache, dass ich nicht mit numerischen Indizes, sondern Strings - id, Haus, und der Name - bedeutet, dass diese ein assoziatives Array ist, und diese Pfeile mit dem Gleichheitszeichen und dem Winkelhalter bedeutet, daß der Schlüssel "id" ist, ist der Wert 1; der Schlüssel ist, "haus", ist der Wert Winthrop House; der Schlüssel ist "name", ist der Wert Zamyla Chan. So gibt es 3 Tasten innerhalb dieses assoziatives Array, von denen jeder seinen eigenen Wert hat. Wir haben das in pset 7 oder Sie bald in JavaScript gleiche Idee gesehen aber es wird so aussehen. So var Studenten - kein Dollarzeichen und keine Erwähnung der Typ noch, aber var - entspricht und öffnen Sie dann geschweiften Klammern, weil in JavaScript, wenn Sie Schlüssel-Wert-Paare, Sie tatsächlich so etwas als Objekt bezeichnet. Und diejenigen von euch, die APCS beteiligt waren oder dergleichen könnte Objekte aus Java erinnern oder ähnliche Sprachen. JavaScript ist nicht Java, in erster Linie. Es war eine bewusste Design-Entscheidung Jahren zu erledigen etwas anderes, das populär war, seinen Namen, obwohl es keine grundsätzliche Beziehung zu sich selbst Java hat. JavaScript muss Objekte und erstellen Sie sie mittels der geschweiften Klammer-Notation. Objekte in JavaScript sind so ziemlich gleichbedeutend mit assoziativen Arrays in PHP wenn es um das Speichern von Daten in ihnen. 

Aber auch stärker in JavaScript können Sie sehr leicht zuordnen Funktionen im Inneren eines Objekts, und obwohl Sie können dies in anderen Sprachen zu tun, Es ist durchaus eine gemeinsame Paradigma, wie wir sehen werden. Kurz gesagt, stellt dieses Objekt ein Student, der sich besonders Zamyla, und es ist ähnlich wie konzeptionell, nur syntaktisch verschieden ist. Lassen Sie tatsächlich nutzen JavaScript in einer Datei. Es stellt sich heraus gibt es ein Skript-Tag. Wir haben einen Stil tag gesehen und wir haben andere HTML-Tags zu sehen. Das script-Tag tatsächlich enthalten einige JavaScript-Code. Lassen Sie mich in das Gerät gehen, wo wir einige Quellcode vorgefertigt haben. Ich habe es noch nicht auf der Webseite veröffentlicht, aber das werde ich nach dem Unterricht zu tun. Lasst uns eröffnen diese, blink.html. Zurück in den 1990er Jahren, es war buchstäblich ein HTML-Tag namens blink tag, und dies war eines der herrlich überstrapaziert Tags im Internet wobei Sie hatte Besuch einiger der 1990er Jahre-Stil Web-Seite und starten Sie sehen Text blinkt, wie diese, die Ergebnisse des Marquis tag hatte die Texte gehen wie diese. Eines der wenigen Male, wo die Welt tatsächlich auf einem Web-Standard hat sich bereit erklärt, jeder auf der ganzen Linie tötete den blink tag vor einigen Jahren. Aber wir können es mit JavaScript auferstehen als Demonstration der Macht haben wenn Sie ein Programm innerhalb einer Web-Seite zu schreiben. Lassen Sie uns zunächst über die neuen Sachen zu überspringen und konzentrieren uns nur auf den alten. 

Hier ist das alte Zeug in diesem Beispiel. Ich habe ein HTML-Tag, ein Kopf-Tag, und ein title-Tag. Dann habe ich einen Körper tag haben hier mit einem div, ist die Erinnerung nur ein rechteckiger Bereich auf der Seite dass ich eine eindeutige ID willkürlich "Begrüßung" gegeben, nur damit ich einen Weg eindeutig darauf zu verweisen haben, hat, dass einige sehr einfache Text: hallo, Welt. Nun lassen Sie mich nach oben an die Spitze dieser Datei und sehen, was es Neues gibt. Das erste, was die neue up top ist das Skript-Tag, und innerhalb des script-Tags Ankündigung Ich habe erklärt, eine Funktion. Um eine Funktion in JavaScript, ziemlich ähnlich wie PHP zu erklären, Sie buchstäblich Write-Funktion dann den Namen der Funktion, Klammern, und vielleicht einige Argumente, wenn es dauert keine. Dann habe ich meine geschweiften Klammern wie gewohnt, und jetzt haben wir etwas neuen Code aber mal sehen, was das bedeutet. So var div, bedeutet dies einfach, geben Sie mir eine Variable namens div. Ich konnte es nannte foo haben, aber ich wollte, dass es als div werden aus Gründen, die klar sein, wird in einem zweiten. Dann stellt sich heraus in JavaScript - und dies ist JavaScript-Code in die Webseite eingebettet - gibt es einen speziellen globalen Variablen von Arten als Dokument. JavaScript ist in der Tat eine objekt-orientierte Sprache. Wir werden nicht ins Detail gehen in 50, was das bedeutet, aber jetzt wissen, dass ein Objekt so ziemlich wie ein struct. Wie wir sahen Weg zurück, wenn in einer der frühesten Problem stellt wo wir eine Vielzahl von Informationen in einer Struktur, ähnlich wird dokumentieren eine besondere Struktur, die mit dem Browser geht, kommt mit einem beliebigen Web-Seite. Es ist nicht etwas, was ich geschaffen. Innerhalb von diesem Dokument Struktur, aber haben Sie nicht nur Daten aber Sie haben auch Funktionen. 

Und jedes Mal, wenn eine Funktion im Inneren einer Struktur, innerhalb eines Objekts, es heißt eine Methode. Aber es ist die gleiche Sache. Eine Methode ist eine Funktion, die einfach so passiert, auf der Innenseite der etwas anderes sein. Dies bedeutet also, dass diese besondere globale Variable Dokument namens hat eine Funktion getElementById, die buchstäblich tut das genannt. Es wird Sie ein Element aus dem DOM, Document Object Model Baum, dessen ID ist in diesem Fall Begrüßung. Mit anderen Worten kommt man die ganze Zeit auf Datenstrukturen verbracht ins Spiel. Dieses Bild von einem DOM, dass wir vor einem Moment hatte, obwohl die Seite ist ein wenig anders, wenn ich einen div hatten in diesem Bild, Welche document.getElementById würde zu mir zurückkehren würde effektiv ein Zeiger sein auf das Rechteck in den Baum, ein Verweis auf das Rechteck in den Baum. Also das ist, was es eigentlich nennen eine dieser Funktionen bedeutet. Auch in diesem Fall ist es ein div. Es ist nicht ein Körper oder ein Titel. Also mal sehen, was ich dann tun mit diesem div jetzt, dass ich es habe innerhalb dieses Variable namens div. Es stellt sich heraus mit JavaScript haben Sie die Möglichkeit, die CSS Ihrer Seite dynamisch zu zwicken. Bis jetzt ist alles der CSS wir getan haben, wenn auch begrenzte, in Stilattribute oder wo sonst haben wir setzen CSS? Ich Art verwöhnt, dass man. In der Stil-Tags am Anfang der Datei. Oder dritten Platz in gewesen? 

Eine externe Datei, irgendwas. Css. Das sind also die drei Orte, die wir CSS bisher getan haben, aber der Haken ist, dass wir haben hart alles codiert. Sie haben sich entschieden, wie Sie in pset 7 tauchte, entschieden wir uns vor der Vorlesung, was unsere CSS wäre. Aber wenn Sie Ihre CSS ändern möchten, können Sie konkret tun, dass wenn man einmal eine tatsächliche Programmiersprache. CSS, HTML - nicht Programmiersprachen. JavaScript ist. So stellt sich heraus, dass, sobald Sie eine dieser Rechtecke haben vom Baum DOM genannt, hat sie selbst einige Daten darin. Also das div, dass ich gerade vom Baum griff hat, was wir eine Eigenschaft innerhalb der es nennen als Stil, und die Eigenschaft style hat sich eine Eigenschaft namens Sichtbarkeit. Ich würde dies nur durch Nachschlagen eines CSS Bedienungsanleitung kennen. Es stellt sich heraus, es gibt eine Sichtbarkeit CSS-Eigenschaft, was es sagt. Es macht etwas sichtbar oder nicht, sichtbar oder nicht. Und wie Sie tun, ist dies. Ich programmatisch zu fragen, ob die Sichtbarkeit dieser div verborgen ist, was muss ich ändern, um? Sichtbar. Else, wenn die Sichtbarkeit dieser Seite nicht verborgen ist, logisch Ich mache es versteckt. Ich habe keine Ahnung, warum es sichtbar und versteckt und nicht sichtbar und unsichtbar ist. Das war eine schlechte Design-Entscheidung auf dem Weg. Aber das sind ja Gegensätze in CSS: sichtbare und versteckte. All dies tut, ist es bedeutet, ändern Sie die CSS meiner Datei ein-und ausschalten, ein-und ausschalten für die jeweilige div. Aber auch dies ist eine Funktion namens blinken. Wann wird der Blink-Funktion aufgerufen wird? Es stellt sich heraus, dass es eine weitere Besonderheit globale Variable namens Fenster im Geiste zu dokumentieren, aber während das Dokument bezieht sich auf Ihre Web-Seite, wie die DOM-Baum, schickte der HTML Sie vom Server, Fenster bezieht sich auf das Chrom um ihn herum, die Adressleiste, die Titelleiste, und all das Zeug um Ihre Web-Seite. 

Und es stellt sich heraus, dass das Fenster Objekt eine spezielle Funktion innerhalb der es heißt setInterval hat das tut, was es sagt. Es wird ein Intervall einstellen - in diesem Fall alle 500 Millisekunden - und zu erraten, was ist es geht um alle 500 Millisekunden zu tun? Es wird diese Funktion blink auszuführen. Und was ist schön hier ist, dass wir dies in C gemacht haben, obwohl wir haben nie. C hat etwas aufgerufene Funktion Zeigern, wo Sie Funktionen rund um passieren kann als Argumente. Ähnlich ist es in JavaScript übergeben Sie den Namen einer Funktion in einer anderen Funktion. Und bemerken, was ich tue. Ich tue das nicht. Wenn ich Klammern setzen nach dem blink, würde das bedeuten, rufen Sie die Blink-Funktion. Wenn ich sie weglassen, dh hier ist die Blink-Funktion so dass setInterval nennen es alle 500 Millisekunden. So das Ergebnis, scheußlich obwohl es ist, ist, dass wenn ich in localhost und gehen Sie zu blink.html, Ich habe jetzt dieses Ereignis wieder und wieder. Und wenn ich tatsächlich Inspect Element, lasst uns sehen, ob wir das sehen können. Lassen Sie mich Inspect Element, lassen Sie mich nach unten scrollen nur ein wenig, lassen Sie mich wählen Elements hier rüber, und beachten Sie die DOM Innenseite Chrome Inspektor. Es ist buchstäblich verändert hin und her, alle 500 Millisekunden. Wenn wir gehen, um unseren Freund Nate, Wenn Sie sich jemals gefragt, wie dies funktioniert, ähnliche Idee mit einem Intervall, aber Nate ist tatsächlich so sehr effektive Einsatz von Farbe in diesem speziellen Fall hier. So was können wir tatsächlich tun mit diesem? Lassen Sie eröffnen ein weiteres Beispiel und versuchen, etwas das ist programmatisch noch nützlicher als die Dinge blinken. Lassen Sie mich in unsere Formen Verzeichnis gehen heute und gehen in form0. Das war das hässlichste mögliche Form, dass ich kommen mit, und lassen Sie mich nur zeigen Ihnen, wie es in einem Browser aussieht. 

Lassen Sie mich in localhost / Formen gehen, und das ist form0. Dies ist ein super hässliche HTML-Formular, ein paar Felder für E-Mail hat zum Passwort Kennwort ein, und dann ein wenig Kontrollkästchen, um zu einigen Bedingungen einverstanden. Der Haken ist, wenn ich dieses Formular aus und besuchen Ich möchte nicht, um Ihnen meine E-Mail-Adresse, Ich will nicht zu den Bedingungen vielleicht zustimmen, kann ich klicken Sie auf Registrieren und es lässt mich doch durch. Dies geschieht zu einem dummen PHP Datei namens dump.php einzureichen. Alles, was sie tut, ist Ausdruck der Inhalt von $ _GET nur für diagnostische Zwecke. Das war, was durch den Benutzer übermittelt gerade jetzt. Aber nehmen wir eigentlich wollen des Benutzers Formularübermittlung validieren. Lassen Sie mich in die Version 1 zu gehen. Dies ist form1.html. Es sieht ästhetisch genauso schlecht, aber bemerken, wie ausgefallen ist. Wenn ich ohne kooperiert klicken Sie auf Registrieren, bekomme ich angeschrien. "Sie müssen Ihre E-Mail-Adresse." Gut. Also lassen Sie mich versuchen. So malan@harvard.edu. Ich glaube nicht, benötigen Sie ein Passwort. Registrieren. "Sie müssen ein Passwort." Gut. Also werde ich ein Passwort von Purpur. Registrieren. "Die Passwörter stimmen nicht überein." Ich muss jetzt in crimson hier eingeben. Ich habe aus Versehen überprüft, dass. Registrieren. "Sie müssen den Bedingungen zustimmen." Gut. Stimme es. Registrieren. Und jetzt zeigt er mir die Diagnoseausgang drüben. 

Also, was ist passiert? Wir hatten diese Fähigkeit, Formularen validieren. In der Tat, wenn Sie tauchen hat in pset 7, gibt es eine entschuldigen Funktion das macht es recht einfach, bei der Benutzer mit einer Meldung auf dem Bildschirm zu schreien. Ich bin mit einer etwas anderen Mechanismus, der Alarm-Funktion, das ist nicht eine Funktion, belächelt hat, da es sehr hässlich Benutzernachrichten macht. Aber mal sehen, was ich hier tue. Dies ist form1.html und merke, dass ich ein paar ziemlich bekannte Syntax haben: Body-Tag, Form-Tag, action-Attribut, Methode Attribut. Aber ich merke, gegeben habe meine Form eine eindeutige ID für die Bequemlichkeit. Dann habe ich eine E-Mail Feld, dessen Typ ist Text, ein Passwort Feld, dessen Typ ist durch ein Passwort, Bestätigung Feld, dessen Typ ist vergessen, und dann eine Checkbox, dessen Name Einigung über hier, ist vom Typ Kontrollkästchen. Und dann habe ich noch einen Submit-Button. Aber an der Spitze feststellen, was ich noch haben. Zunächst einmal gibt es eine andere Nutzung des Skript-Tag. Wenn Sie etwas JavaScript-Code in einer anderen Datei haben, genau wie mit CSS können Sie sind es. Und Sie tun das mit script Quelle, und dann merke ich bin anscheinend Anschluss auf einen sehr langen Weg googleapis.com aber deren Dateiname endet in jquery.min zum Minimum. js. jQuery ist ein super beliebt Bibliothek für JavaScript, das macht einfach JavaScript umso benutzerfreundlicher zu bedienen. Es ist tatsächlich zu einem de-facto-Standard. Also selbst wenn das, was Sie über zu sehen sind ist nicht rein JavaScript per se, es ist eine Bibliothek auf JavaScript ähnlich wie der CS50-Bibliothek ist eine Schicht auf der Oberseite des Low-Level-C-Code, die Realität ist fast jeder im Internet nutzt. So sind diese nicht Stützräder. Dies ist nur Best Practice in diesen Tagen. Jetzt unten bemerken, dass ist meine eigene Skript-Tag, und beachten Sie, was ich hier getan. Es stellt sich heraus, dass jQuery etwas ein wenig Phantasie tut. JavaScript muss Dollarzeichen, aber sie sind bedeutungslos. 

Sie sind wie die Buchstaben A, B oder C. jQuery hat einfach die Konvention oder Art erhoben Anspruch auf die Tatsache angenommen dass $ ihre Sonderzeichen sein. Also, sobald Sie laden diese globale JavaScript-Datei hier mit dem Skript-Tag, Sie haben Zugang zu einem speziellen globale Variable, $ heißt. Es ist richtig genannt jQuery, aber das bedeutet nicht annähernd so sexy wie $. Aber $ hat keine besondere Bedeutung. In PHP hatte eine besondere Bedeutung. Sie musste es vor einer Variable. Dies ist nur eine sexy Sache, die sie auf nahm. Was ist denn hier los? Beachten Sie, ich bin auf die jQuery-Funktion Weitergabe meiner globalen variablen Dokuments und dann rufe ich an. bereit. Welche jQuery Wesentlichen tut, ist es Ihnen erlaubt, einige Vanille JavaScript Dinge nehmen wie die Dokument-Objekt, das Fenster Objekt, und wenn Sie geben es in der jQuery-Funktion - wieder klar zu sein, das ist eine Funktion namens jQuery - was es tut, ist es wieder zu Ihnen eine spezielle Version des Dokuments das hat mehr Funktionalität zugeordnet. So in rohem JavaScript gibt es keine fertige Funktion, aber wenn Sie passieren Dokument der jQuery-Funktion erster, Es gibt Ihnen eine spezielle Version des document-Objekts das hat mehr tollen Features. Und das ist, warum die Leute es mögen. Es macht die Dinge nur leichter zu tun, wie wir gleich sehen sind. Was bedeutet dies Codezeile bedeuten? Diese Codezeile bedeutet hier, wenn das Dokument fertig ist - In anderen Worten, sobald der Browser erfolgt Lesen dieser Datei oben nach unten - gehen Sie vor und führen Sie die folgende Funktion. Was ist wirklich interessant in JavaScript - und PHP hat dies auch - ist anonym Funktionen. In JavaScript können Sie Funktionen deklarieren, die keinen Namen haben, aber sie haben einen Körper. Beachten Sie, was hier passiert. 

Dies ist eine Funktion namens bereit, und es bedeutet nur, gehen Sie wie folgt wenn die ganze Web-Seite bereit ist, wenn alles wurde in vom Server zu lesen. Was wollen Sie tun? Ich will ein Stück Code auszuführen. Beachten Sie, dass wir nicht wollen, um diesen Code sofort auszuführen. Wenn ich dies unterlassen, würde dies sofort meine starten Ausführung dieser Zeilen Code. Aber die Tatsache, dass ich sage, nein, nein, nein, wickeln es bei einer anonymen Funktion wie diese Mittel nicht ausführen es noch, rufen sie schließlich. Wir sahen dies vor einem Augenblick in unserem bisherigen Form Beispiel. Welche Funktion haben wir schließlich nennen, 500 Millisekunden später? Blinken. So ist die gleiche Idee. Wieder, auch wenn das sieht ein bisschen komisch, gerade jetzt über den Glauben zu nehmen , dass zu erklären, eine anonyme Funktion, die schließlich heißt, Sie schreiben einfach function () { Also, was Code werden wir schließlich ausführen? Die folgende. Auch dies sieht ein wenig neu, aber das bedeutet hier die jQuery-Funktion, und dies ist jetzt eine Abkürzung. Dieser Ausschnitt von HTML am unteren Rand des Bildschirms hat natürlich einige Baum-Darstellung. Es ist dies nicht. Diese Seite ist interessanter als dieser Hallo Welt Beispiel. Aber es gibt einige Baum, der zu dieser HTML entspricht. Es wäre ein Schmerz im Nacken zu haben, um irgendeine Art von rekursive Funktion zu implementieren an der Wurzel-Knoten zu starten und dann finden die Knoten, dessen ID ist die Registrierung. Also, was jQuery macht super einfach für uns buchstäblich ist. Go ahead and get me unabhängig div oder was auch immer Form, unabhängig von HTML-Element hat die ID-Registrierung. Dies ist gleichbedeutend mit document.getElementById ("Registrierung"). 

Warum Leute wie jQuery? Weil es kürzer zu tippen. Aber das ist alles. Es ist die gleiche Idee. Holen Sie mir den Tag, dessen ID ist die Registrierung. Und wenn dieser Tag, der eine Form sein, geschieht, wird vorgelegt, gehen Sie vor und führen Sie diesen Code. So lasst uns jetzt einen Blick auf, wie wir tun, Formular-Validierung. Die Syntax ist zwar kryptisch auf den ersten, aber was ist hier los? Wenn diese Codezeile ist wahr, ich werde beim Anwender schreien, um seine E-Mail-Adresse anzugeben. Also, was ist diese Codezeile? $ Bedeutet jQuery. Jetzt bemerkt. Dies ist eine Art, wie CSS. Wenn Sie in CSS getaucht habe noch, wirst du wissen, dass dies das Element, dessen ID ist die Registrierung bedeutet. Der Raum heißt Sie ein Kind oder ein Nachkomme der Anmeldung, deren Name eingegeben wird. Und dann dieses Ding in eckigen Klammern ist ein kleines Filter. Und selbst wenn diese kryptische aussieht, bedeutet dies einfach, gehen Sie auf die Form, deren ID ist die Registrierung, gehen an den Eingang Element innerhalb der, dass dessen Name E-Mail, und dann ihren Wert, was seinen Wert passiert zu sein - asdf wenn das alles, was ich getippten oder malan@harvard.edu wenn es das ist, was ich getippt. Also, wenn der Wert des Formulars E-Mail-field == nichts, beim Anwender schreien. Else, wenn der Wert des Passwortes field == nichts, beim Anwender schreien. 

Else, wenn der Wert des Passwort-Feld nicht gleich dem Wert der Bestätigung Feld das war die andere Form Element, um den Benutzer zu schreien. Und dann schließlich - und auch das hat einige neue Syntax des eigenen, aber wenn man es gesehen habe, ist es zumindest ein wenig mehr zumutbar - sonst, wenn die Form, deren ID ist die Registrierung hat ein input-Element, dessen Name Vereinbarung und es aktiviert ist, gehen Sie vor und schreien den Benutzer. Also habe ich ganz zugeben, das ist völlig überwältigend auf den ersten Blick. Es gibt eine Menge von neuen Syntax. Aber alle jQuery folgt diesen Arten von Mustern. Und ehrlich gesagt, habe ich nicht einmal weiß, dass dies existierte bis vor ein paar Minuten. Ich googeln, "Woher weißt du überprüfen, ob eine Checkbox in jQuery aktiviert ist?" und dies ist die Syntax, denn es gibt verschiedene Möglichkeiten, es zu tun mit den tatsächlichen Roh JavaScript-Code. So wie die erste Seite Problem Set 7 betont, pset 7 ist sehr viel eine Übung in Bootstrapping selbst wo wir bereitgestellt haben, hoffentlich, einen konzeptionellen Rahmen, mit dem die pset anzugehen. 

Aber wie so oft der Fall mit Web-Design, ist es an Ihnen wirklich um Sack, übernehmen Code-Schnipsel und Beispielen aus dem Web so lange, wie Sie sie nennen Gemäß den Bedingungen an diesem ersten Blatt, und erkennen, dass das Lernen HTML, CSS, JavaScript und sogar SQL ist eigentlich gemeint, dies at-home Übung als wir diese Stützräder abzunehmen beginnen. Und realisieren auch es gibt so viele Dinge, die Sie mit einem Browser machen kann. Innerhalb der meisten dieser Elemente gibt es andere Dinge als Event-Handler. Und obwohl wir sahen diejenigen genannt onsubmit und onready, Sie können Dinge wie onkeydown, onkeyup tun, wie wenn der Benutzer berührt eine Taste drücken, können Sie für diese und Schlüssel bis hören. Gmail hat Tastenkombinationen. Wie funktioniert Google umzusetzen Tastenkombinationen wie C komponieren? Sie hören für Veranstaltungen, wie sie genannt werden, wie onkeypress oder onkeyup und onkeydown. Wenn Sie jemals mit der Maus über einem gewissen Menüpunkt schwebte und plötzlich, voila, erscheint ein Menü oder die Grafik ändert sich die Farbe, Wie tun sie das? Anstatt für onready oder onsubmit zuhören, zuhören Sie onmouseover oder onmouseout. 

Also kurz gesagt, mit diesen sehr einfachen Grundlagen, dass wir begonnen haben, um die Oberfläche von heute kratzen und wir werden weiter am Mittwoch tauchen, die Sie haben, zunehmend Macht, die Art von Dingen, die Sie bereits vertraut sind umzusetzen. Lassen Sie uns also zu Ende, und wir werden dies am Mittwoch fortgesetzt. 

[CS50.TV]