1 00:00:00,000 --> 00:00:02,570 [Powered by Google Translate] [Week 9] 2 00:00:02,570 --> 00:00:04,740 [David J. Malan - Harvard University] 3 00:00:04,740 --> 00:00:07,170 [Dit is CS50. - CS50.TV] 4 00:00:07,170 --> 00:00:12,350 Oke. Welkom terug. Dit is CS50, en dit is het begin van week 9. 5 00:00:12,350 --> 00:00:16,600 Vandaag richten we ons met name op het ontwerp, niet meer in de context van C 6 00:00:16,600 --> 00:00:20,010 maar in de context van PHP en een beetje van SQL en een beetje JavaScript, 7 00:00:20,010 --> 00:00:23,730 in het bijzonder in de richting van een einde van zowel PSET 7 en ook uw uiteindelijke project. 8 00:00:23,730 --> 00:00:26,310 In feite, als u zich op dat moment in uw uiteindelijke project 9 00:00:26,310 --> 00:00:30,100 waar vermoedelijk vanaf een uur of zo geleden heeft u in ieder geval begonnen na te denken over 10 00:00:30,100 --> 00:00:33,730 om je afstudeerproject en je denkt je wilt samenwerken met 1 of 2 klasgenoten, 11 00:00:33,730 --> 00:00:36,150 Als u problemen ondervindt met het aansluiten zei klasgenoten, 12 00:00:36,150 --> 00:00:40,570 voel je vrij om het formulier invullen op cs50.net/partners/form. 13 00:00:40,570 --> 00:00:42,880 Het vraagt ​​je gewoon wie je bent, wat voor soort project dat u denkt over, 14 00:00:42,880 --> 00:00:44,870 waar je woont maar om logistieke redenen. 15 00:00:44,870 --> 00:00:49,510 En dan als je wilt in de gaten houden de komende week of zo de spreadsheet URL daar, 16 00:00:49,510 --> 00:00:53,520 U kunt dan zien een alleen-lezen versie van de Google doc 17 00:00:53,520 --> 00:00:56,010 waarin we verzamelen deze informatie. 18 00:00:56,010 --> 00:00:58,930 Dus als je wilt werken met iemand, met alle middelen te voelen vrij om uit te reiken naar mensen 19 00:00:58,930 --> 00:01:00,480 via dat mechanisme. 20 00:01:00,480 --> 00:01:02,690 Maar de meerderheid van de mensen doen het werk solo. Dat is helemaal goed. 21 00:01:02,690 --> 00:01:06,120 Dat wil niet zeggen dat dit op enigerlei wijze verplicht. 22 00:01:06,120 --> 00:01:09,680 Op vrijdag was het alleen ik en een paar van het team hier, 23 00:01:09,680 --> 00:01:11,100 leeg theater voor het grootste deel. 24 00:01:11,100 --> 00:01:14,600 Er waren 3 toeristen zitten daar boven, dus dat was een beetje lastig. 25 00:01:14,600 --> 00:01:18,970 Wat hadden we het over was databases en spraken we over PSET 7 een beetje. 26 00:01:18,970 --> 00:01:22,200 En als je niet toevallig dat vangen op video gewoon nog niet, dat is prima. 27 00:01:22,200 --> 00:01:26,770 Ik zal proberen om een ​​van de woorden te definiëren die we anders zouden als vanzelfsprekend 28 00:01:26,770 --> 00:01:28,840 gebaseerd op lezing van vrijdag. 29 00:01:28,840 --> 00:01:32,550 >> Maar vandaag gaan we proberen om u naar het punt 30 00:01:32,550 --> 00:01:34,990 van niet alleen in staat om zoiets te doen PSET 7 31 00:01:34,990 --> 00:01:37,360 maar echt te begrijpen wat er aan de hand onder de motorkap, 32 00:01:37,360 --> 00:01:41,910 in het bijzonder een aantal van de abstracties die we in te voeren in de functions.php bestand 33 00:01:41,910 --> 00:01:45,780 om uw leven een stuk makkelijker, maar zo dat je uiteindelijk begrijpen 34 00:01:45,780 --> 00:01:48,760 zodat wanneer de zijwieltjes eraf in een paar weken kunt u nog steeds overleven 35 00:01:48,760 --> 00:01:53,750 in de echte wereld en doen dit spul zonder CS50 kader onder je. 36 00:01:53,750 --> 00:01:57,500 Deze $ _SESSION, voor degenen onder u die op de hoogte 37 00:01:57,500 --> 00:02:01,960 of die reeds de video betrapt op vrijdag, SESSIE wat doet laten we het doen 38 00:02:01,960 --> 00:02:04,330 in een PHP-gebaseerde web applicatie? 39 00:02:04,330 --> 00:02:09,650 Dit is een superglobal variabele, wat betekent dat het in dezelfde geest aan GET POST en 40 00:02:09,650 --> 00:02:13,970 en een paar anderen, maar wat is dit ding nuttig voor? 41 00:02:13,970 --> 00:02:18,320 >> Wat is SESSIE gebruikt? Ja. [Student] Logging in 42 00:02:18,320 --> 00:02:21,040 Sorry? [Student] Logging in Logging in inderdaad. 43 00:02:21,040 --> 00:02:25,100 In PSET 7 gebruiken we deze sessie superglobal te vergemakkelijken in te loggen 44 00:02:25,100 --> 00:02:28,600 En wat er leuk is aan dit superglobal is dat het een associatieve array. 45 00:02:28,600 --> 00:02:33,190 Een associatieve array, recall, ligt op slechts een array, maar waarvan de indexen niet meer te zijn getallen 46 00:02:33,190 --> 00:02:37,670 zoals 012. Ze kunnen getallen of ze kunnen zelfs strings. 47 00:02:37,670 --> 00:02:44,890 En dus als je dook PSET 7 nog, kunt u zich herinneren dat we een sleutel genaamd ID opslaan 48 00:02:44,890 --> 00:02:50,330 binnenkant van deze associatieve array waarvan de waarde is zoiets als 123 - 49 00:02:50,330 --> 00:02:53,780 ongeacht de momenteel aangemelde gebruiker ID's is. 50 00:02:53,780 --> 00:02:59,470 De motivatie hiervoor is dat zelfs nadat de gebruiker heeft bezocht localhost 51 00:02:59,470 --> 00:03:02,720 of mijn website meer in het algemeen en dan hebben ze ingelogd, 52 00:03:02,720 --> 00:03:07,320 zelfs als ze niet op een koppeling of terug te gaan naar mijn website gedurende 5 minuten 53 00:03:07,320 --> 00:03:10,730 of zelfs een uur of zelfs een dag, maar ze laten hun browservenster geopend, 54 00:03:10,730 --> 00:03:14,370 via deze superglobal kan ik herinner me dat ze ingelogd 55 00:03:14,370 --> 00:03:21,140 >> Met andere woorden, het stelt me ​​in staat om op te slaan een beetje op lange termijn wat ik wil over een gebruiker. 56 00:03:21,140 --> 00:03:24,390 En je kunt echt zien als de incarnatie van een winkelwagentje. 57 00:03:24,390 --> 00:03:27,740 Plaatsen als Amazon natuurlijk laat je dingen in een winkelwagentje, 58 00:03:27,740 --> 00:03:32,230 maar HTTP, het protocol dat drijft op het web, is staatloos 59 00:03:32,230 --> 00:03:34,230 in de zin dat wanneer u een website bezoekt, 60 00:03:34,230 --> 00:03:37,290 voor het grootste deel u niet beschikt over een aantal constante netwerkverbinding 61 00:03:37,290 --> 00:03:39,270 tussen uw browser en de server. 62 00:03:39,270 --> 00:03:42,190 Zodra u hebt gedownload van de HTML en de JPEG's en de GIF's en dat alles, 63 00:03:42,190 --> 00:03:48,200 de verbinding gaat weg en je hoeft alleen een kopie van de HTML en wat al niet van de server. 64 00:03:48,200 --> 00:03:53,000 Maar als de server wil herinner me iets over jou, 65 00:03:53,000 --> 00:03:57,580 de last is op de server om daadwerkelijk op te nemen die informatie. 66 00:03:57,580 --> 00:04:00,130 En zodat je de programmeur die de controle over de server 67 00:04:00,130 --> 00:04:04,400 kan zetten de meeste alles wat je wilt binnenkant van dit superglobal associatieve array 68 00:04:04,400 --> 00:04:06,850 en het zal er de volgende keer dat de gebruiker terugkomt, 69 00:04:06,850 --> 00:04:12,070 of het nu minuten of zelfs dagen later, tenzij ze sluiten hun browservenster, 70 00:04:12,070 --> 00:04:14,360 op welk punt SESSIE verdwijnt. 71 00:04:14,360 --> 00:04:17,779 Dus het is vluchtig opslag, het is niet-persistent, en het is bedoeld om weg te gaan 72 00:04:17,779 --> 00:04:22,360 zodra de gebruiker sluit de browser - niet alleen dat tabblad, vaak de hele browser, 73 00:04:22,360 --> 00:04:24,930 waardoor effectief het loggen van de gebruiker uit. 74 00:04:24,930 --> 00:04:28,000 Dus hoe is dit ding werkelijk geïmplementeerd? 75 00:04:28,000 --> 00:04:31,360 Laten we eens een snelle blik op een eenvoudig voorbeeld hebben we gekeken naar vrijdag. 76 00:04:31,360 --> 00:04:33,340 Voor wie niet vertrouwd, het was zo simpel als dit. 77 00:04:33,340 --> 00:04:35,910 Dit is een webpagina met als enige doel in het leven is om te vertellen 78 00:04:35,910 --> 00:04:38,000 hoe vaak ik heb bezocht deze pagina. 79 00:04:38,000 --> 00:04:41,670 Dit is de eerste keer hier op maandag dat ik het bezocht, dus er staat 0 keer. 80 00:04:41,670 --> 00:04:46,940 >> Maar als ik begin herladen deze pagina, het zegt 1 keer, 2, 3, 4, 5, 81 00:04:46,940 --> 00:04:49,800 en dit zal uiteindelijk gewoon blijven tellen omhoog, omhoog, omhoog, omhoog, omhoog 82 00:04:49,800 --> 00:04:53,130 voor elke keer dat ik echt klikt vernieuwen op. 83 00:04:53,130 --> 00:04:58,830 Dus hoe is deze manier van werken? Laat me naar binnen gaan van dit bestand met de naam counter.php. 84 00:04:58,830 --> 00:05:02,490 Het bovenste deel van dit alles is blauw commentaar, maar het interessante deel is hier. 85 00:05:02,490 --> 00:05:06,670 Op lijn 13 noemen we deze functie session_start, 86 00:05:06,670 --> 00:05:09,600 en dat is letterlijk alles wat je moet doen als u toegang wilt hebben 87 00:05:09,600 --> 00:05:13,610 om deze speciale superglobal genaamd $ _SESSION. 88 00:05:13,610 --> 00:05:17,430 Dat maakt het allemaal mogelijk, en we zullen zien in een moment hoe dat is allemaal mogelijk. 89 00:05:17,430 --> 00:05:20,350 In lijn 16 merk op wat ik doe. 90 00:05:20,350 --> 00:05:25,960 Als de sleutel, genaamd counter - met andere woorden, de indexwaarde - "counter" 91 00:05:25,960 --> 00:05:32,310 bestaat binnenkant van deze array genaamd SESSIE, wat doe ik met het in de regel eronder? 92 00:05:32,310 --> 00:05:36,650 Wat is regel 18 aan het doen? 93 00:05:36,650 --> 00:05:40,360 >> [Onverstaanbaar student reactie] Wat is dat? [Student] Het opslaan van de waarde. Goed. 94 00:05:40,360 --> 00:05:45,800 Het opslaan van de waarde die in SESSIE nu in een nieuw lokaal tijdelijke variabele, 95 00:05:45,800 --> 00:05:48,250 $ Teller in kleine letters. 96 00:05:48,250 --> 00:05:50,770 Merk op dat PHP al is een beetje lui hier. 97 00:05:50,770 --> 00:05:55,550 Let op dat we geen vermelding van int of float of string of iets dergelijks hebben dat 98 00:05:55,550 --> 00:06:00,480 omdat PHP is zwak getypt, waarbij je niet het type van een variabele op te geven, 99 00:06:00,480 --> 00:06:03,310 en in dit geval hier heb ik nog niet eens verklaard dat hij nog niet. 100 00:06:03,310 --> 00:06:08,980 Ik verklaar dat de binnenkant van deze accolades en in tegenstelling tot C, dit is eigenlijk oke. 101 00:06:08,980 --> 00:06:13,800 Het maakt niet uit hoe diep een variabele declaratie genest is in PHP - 102 00:06:13,800 --> 00:06:16,650 binnenkant van accolade, de binnenkant van accolade en dergelijke - 103 00:06:16,650 --> 00:06:21,230 zal op dat moment bestaan ​​in tijd voor de rest van het programma, 104 00:06:21,230 --> 00:06:22,680 ten goede of ten kwade. 105 00:06:22,680 --> 00:06:26,930 Dus wordt het onmiddellijk mondiale zodra je deze instelt als we hier doen. 106 00:06:26,930 --> 00:06:31,620 >> Anders, als ik niet vind dat er iets in de SESSION superglobal, 107 00:06:31,620 --> 00:06:34,680 Ik ben blijkbaar het initialiseren van deze variabele teller op 0, 108 00:06:34,680 --> 00:06:37,580 daardoor net de veronderstelling dat de gebruiker heeft hier nog nooit eerder geweest. 109 00:06:37,580 --> 00:06:40,030 En dan is dit natuurlijk is het verhogen van de teller hoe? 110 00:06:40,030 --> 00:06:44,480 Ik ben het bijwerken van de waarde die binnen is van deze associatieve array 111 00:06:44,480 --> 00:06:49,530 door het gelijk aan wat teller momenteel + 1. 112 00:06:49,530 --> 00:06:53,520 Als ik scroll naar beneden hier om de HTML van de pagina, het is eigenlijk vrij eenvoudig. 113 00:06:53,520 --> 00:06:58,920 Alles wat ik heb in het lichaam van deze pagina is: "U hebt deze site bezocht zo-en-zo tijden." 114 00:06:58,920 --> 00:07:00,350 En dit is een PHP-construct. 115 00:07:00,350 --> 00:07:06,080 Als je dat doet 00:07:12,600 Het is echt gelijk aan iets als printf, die we hebben vele malen gezien in C, 117 00:07:12,600 --> 00:07:15,940 hoewel zoals u wellicht al weet van de spec in PSET 7, 118 00:07:15,940 --> 00:07:20,160 print is ook een functie die net drukt iets uit, is het niet daadwerkelijk gebruik maken van formaat codes, 119 00:07:20,160 --> 00:07:23,270 en je kunt eigenlijk zeggen echo ook. 120 00:07:23,270 --> 00:07:27,460 Ze zijn allemaal ooit zo iets anders ook al is het netto-effect is uiteindelijk hetzelfde. 121 00:07:27,460 --> 00:07:31,270 Dus dit gebruik van het is-gelijk teken is gewoon soort van een elegante manier om het te doen 122 00:07:31,270 --> 00:07:34,910 beknopter dan u anders zou kunnen. 123 00:07:34,910 --> 00:07:38,370 Dus dat is allemaal deze site doet. Het drukt de waarde van de teller. 124 00:07:38,370 --> 00:07:40,550 Hoe is dit allemaal echt gebeurt? 125 00:07:40,550 --> 00:07:43,250 U herinnert zich misschien een week of zo geleden zijn we op zoek gegaan naar onder de motorkap 126 00:07:43,250 --> 00:07:47,910 hoe een webpagina werkt met behulp van deze inspecteur tabblad. 127 00:07:47,910 --> 00:07:51,900 >> Chrome heeft dit zowel in de Mac-versie, de Windows-versie, en zelfs de Linux-versie, 128 00:07:51,900 --> 00:07:59,510 en Firefox en IE hebben soortgelijke mechanismen waardoor u deze ingebouwde debugger 129 00:07:59,510 --> 00:08:01,400 binnenkant van de browser. 130 00:08:01,400 --> 00:08:03,040 Laten we eens een kijkje nemen op de volgende. 131 00:08:03,040 --> 00:08:06,960 We hebben een hele hoop tabbladen hier, en herinneren eraan dat de meest linkse men Elements, 132 00:08:06,960 --> 00:08:10,700 en hoe godawful de HTML-en JavaScript in een pagina, 133 00:08:10,700 --> 00:08:15,710 herinneren eraan dat met het tabblad Elementen je daadwerkelijk kunt de HTML-hiërarchisch navigeren 134 00:08:15,710 --> 00:08:17,050 en mooi en netjes. 135 00:08:17,050 --> 00:08:19,370 Dus als je probeert te leren van een website zoals Google of Facebook 136 00:08:19,370 --> 00:08:22,370 of eigenlijk een website, beseffen dat je waarschijnlijk je beter af 137 00:08:22,370 --> 00:08:26,360 naar de broncode zo tegenover de onbewerkte bron, 138 00:08:26,360 --> 00:08:29,580 dat kan een puinhoop zijn, zoals we hebben gezien in het bijzonder op het terrein van Google. 139 00:08:29,580 --> 00:08:32,220 Dus als ik in plaats daarvan hier klikt u op het tabblad Netwerk, 140 00:08:32,220 --> 00:08:34,830 laten we eens kijken wat er gebeurt als ik naar deze pagina. 141 00:08:34,830 --> 00:08:38,669 Laat me eerst duidelijk mijn cache. 142 00:08:38,669 --> 00:08:43,570 Ik ga naar Instellingen in Chrome en vervolgens naar Geschiedenis gaan 143 00:08:43,570 --> 00:08:46,420 en schakel alle browsen gegevens. 144 00:08:46,420 --> 00:08:48,170 U zou kunnen worden gebruikt om dit te doen voor andere doeleinden, [gelach] 145 00:08:48,170 --> 00:08:51,990 maar als het gaat om het ontwikkelen van websites, het is eigenlijk handig - 146 00:08:51,990 --> 00:08:55,980 als je lacht weet je. [Gelach] 147 00:08:55,980 --> 00:08:59,310 Het is eigenlijk heel handig als het ontwikkelen van websites, omdat de realiteit is 148 00:08:59,310 --> 00:09:04,100 dingen zoals koekjes en dat soort dingen in de cache HTML-bestanden, cache JavaScript-bestanden 149 00:09:04,100 --> 00:09:06,390 daadwerkelijk kan worden een grote hoofdpijn, want als om welke reden dan 150 00:09:06,390 --> 00:09:11,500 de browser besluit om de cache een bestand en toch heb je wijzigingen aangebracht in het bestand op de server 151 00:09:11,500 --> 00:09:14,670 maar de browser is niet echt gerealiseerd dat het bestand is gewijzigd 152 00:09:14,670 --> 00:09:19,060 en dus eigenlijk niet opnieuw downloaden, zelfs wanneer u op de knop Opnieuw laden, 153 00:09:19,060 --> 00:09:23,210 een van de meest trefzekere manieren om maar zorg ervoor dat de fout niet met uw code, 154 00:09:23,210 --> 00:09:26,480 het is met het gedrag van de browser, is om hier te gaan in uw browser 155 00:09:26,480 --> 00:09:29,950 en gewoon duidelijk de hele geschiedenis, zodat er geen verwarring. 156 00:09:29,950 --> 00:09:33,210 >> En dan als je echt wilt zijn paranoïde, sluit u de browser, start het opnieuw 157 00:09:33,210 --> 00:09:35,660 en dan zorg ervoor dat alles werkt zoals verwacht. 158 00:09:35,660 --> 00:09:38,820 Dus in het kort, clearing cache is goed wanneer het doen van ontwikkeling. 159 00:09:38,820 --> 00:09:40,690 Dus hier hebben we het tabblad Netwerk. 160 00:09:40,690 --> 00:09:46,020 Ik eerder had bezocht de site 9 keer, maar laat me nu ga je gang en klik op Opnieuw laden. 161 00:09:46,020 --> 00:09:47,500 En ik ben terug naar 0. 162 00:09:47,500 --> 00:09:52,100 Laten we eens echt zien hoe het komt dat deze sessie superglobal wordt uitgevoerd. 163 00:09:52,100 --> 00:09:55,990 Ik ga om te klikken op de 1 HTTP-aanvraag die is gemaakt, 164 00:09:55,990 --> 00:09:58,810 en dit foutopsporingsvenster laat me naar binnen kijken van dat. 165 00:09:58,810 --> 00:10:01,970 Hier zie ik alleen het antwoord van de server, die niet interessant. 166 00:10:01,970 --> 00:10:04,030 Ik heb dit in een aantal manieren. 167 00:10:04,030 --> 00:10:06,350 Maar wat is technisch gezien interessant zijn de headers. 168 00:10:06,350 --> 00:10:11,770 Als ik scroll naar beneden hier en richten zich op het verzoek headers en klik op view source, 169 00:10:11,770 --> 00:10:14,400 wat ik ga zien is letterlijk het HTTP-verzoek 170 00:10:14,400 --> 00:10:17,250 dat ging gewoon van mijn browser naar de server, 171 00:10:17,250 --> 00:10:21,400 GET is het juiste woord en dan / counter.php zijnde de bestandsnaam, 172 00:10:21,400 --> 00:10:25,670 HTTP/1.1 gewoon de versie van HTTP dat mijn browser wordt gebruikt. 173 00:10:25,670 --> 00:10:31,070 Deze lijn is hier een kleine herinnering van browser tot server wat de naam van de server is 174 00:10:31,070 --> 00:10:33,020 te willen praten. 175 00:10:33,020 --> 00:10:38,200 En dan de rest van deze is soms interessant, maar niet relevant op dit moment. 176 00:10:38,200 --> 00:10:40,090 >> Dit is gewoon een soort van een curiositeit. 177 00:10:40,090 --> 00:10:43,530 Cryptic hoewel deze string is, elk moment dat uw browser een website bezoekt 178 00:10:43,530 --> 00:10:47,110 het is het informeren van de server welke browser je gebruikt 179 00:10:47,110 --> 00:10:50,040 en welk besturingssysteem je gebruikt en welke versie daarvan. 180 00:10:50,040 --> 00:10:52,650 Dus als je ooit hebt afgevraagd hoe websites als CNN en wat al niet 181 00:10:52,650 --> 00:10:56,860 weten wat de percentages zijn van Mac-gebruikers op het web, pc-gebruikers, 182 00:10:56,860 --> 00:11:00,820 IE gebruikers, Chrome-gebruikers en dergelijke, dan is dat omdat al onze browsers 183 00:11:00,820 --> 00:11:04,300 vertellen elke website die er zijn wat we zijn. 184 00:11:04,300 --> 00:11:07,410 Het bevat niet noodzakelijkerwijs persoonsgegevens, 185 00:11:07,410 --> 00:11:13,060 maar het vertellen van de server wat uw IP-adres is en welke browser en besturingssysteem dat u gebruikt. 186 00:11:13,060 --> 00:11:14,720 Dus dat is waar deze informatie. 187 00:11:14,720 --> 00:11:19,960 Maar wat interessanter nu als het gaat om deze sessies wordt de response header. 188 00:11:19,960 --> 00:11:22,530 Laat me klikt bron te bekijken naast reactie. 189 00:11:22,530 --> 00:11:24,590 Wat interessant is hier een paar dingen. 190 00:11:24,590 --> 00:11:27,580 1, we hebben weer een statuscode 200. 191 00:11:27,580 --> 00:11:29,840 We zien nooit deze status code, omdat dat betekent dat alles in orde is. 192 00:11:29,840 --> 00:11:32,920 Het betekent letterlijk goed in tegenstelling tot iets anders. 193 00:11:32,920 --> 00:11:36,380 Wat is een aantal zien we soms zo slecht is? [Student] 404. 194 00:11:36,380 --> 00:11:39,860 404, bestand niet gevonden, kan 403 u struikelen over al, 195 00:11:39,860 --> 00:11:43,660 wat verboden is, wat betekent dat je vergat te chmod iets, waarschijnlijk. 196 00:11:43,660 --> 00:11:45,190 En er is een heleboel anderen. 197 00:11:45,190 --> 00:11:47,760 >> Hier beneden, dit is een beetje gek. 198 00:11:47,760 --> 00:11:52,340 Ik schreef net dit bestand een paar minuten geleden door plakken in gedit. 199 00:11:52,340 --> 00:11:57,100 Waarom heeft deze pagina vervallen in 1981 voordat er echt een Web? 200 00:11:58,010 --> 00:12:00,730 Wat is er aan daar? 201 00:12:00,730 --> 00:12:04,390 >> [Onverstaanbaar student response] De tijdstempel. Maar waarom? 202 00:12:06,110 --> 00:12:09,120 Het is enigszins arbitrair, maar het is eigenlijk nuttig. 203 00:12:09,120 --> 00:12:15,500 Wat dit zegt tegen mijn browser is dit PHP bestand dat u zojuist hebt aangevraagd reeds is verstreken. 204 00:12:15,500 --> 00:12:18,580 In feite verlopen 30 jaar geleden. 205 00:12:18,580 --> 00:12:20,260 Maar wat betekent dat eigenlijk? 206 00:12:20,260 --> 00:12:22,500 Het betekent gewoon de volgende keer dat de gebruiker bezoekt deze pagina, 207 00:12:22,500 --> 00:12:25,540 hetzij door opnieuw laden of het typen van de URL in de adresbalk, 208 00:12:25,540 --> 00:12:28,010 zorg ervoor dat je gaan halen een nieuw exemplaar van het. 209 00:12:28,010 --> 00:12:30,840 Dit is een soort van een voorbeeld van cache busting, 210 00:12:30,840 --> 00:12:33,790 een stom woord dat betekent alleen maar dat het proberen om browsers te ontmoedigen 211 00:12:33,790 --> 00:12:37,260 van de werkelijk caching HTML die is verzonden vanaf een server 212 00:12:37,260 --> 00:12:41,490 zodat u niet per ongeluk herladen en dan zie dezelfde versie van het bestand. 213 00:12:41,490 --> 00:12:43,730 Je eigenlijk wilt dat de server om een ​​nieuw exemplaar te sturen. 214 00:12:43,730 --> 00:12:47,440 Dus het feit dat het 1981 betekent gewoon dat dat is wat het apparaat te kiezen 215 00:12:47,440 --> 00:12:50,280 een willekeurige datum in het verleden. 216 00:12:50,280 --> 00:12:53,380 Maar de echte sappige lijn is nu deze. 217 00:12:53,380 --> 00:12:57,550 Nog voor 50 ben je waarschijnlijk vaag bekend met cookies. 218 00:12:57,550 --> 00:13:01,820 Vanaf nu, vooral onder degenen minder comfortabel of tussen, 219 00:13:01,820 --> 00:13:04,120 wat is een cookie in uw begrip op dit moment 220 00:13:04,120 --> 00:13:06,980 ook al zijn we op het punt om uw begrip meer technische? 221 00:13:08,150 --> 00:13:10,070 Wat is een cookie? Ja. 222 00:13:10,070 --> 00:13:13,890 [Student] Informatie over de gebruiker, zoals als ze geschreven zijn gebruikersnaam of zoiets. 223 00:13:13,890 --> 00:13:17,370 >> Goed. Het is informatie over de gebruiker, of ze hebben getypt al in hun gebruikersnaam. 224 00:13:17,370 --> 00:13:21,190 Cookies zijn een manier waardoor servers kunnen iets over een gebruiker te onthouden. 225 00:13:21,190 --> 00:13:25,810 En wat een cookie is echt een tekstbestand of een sequentie van bytes 226 00:13:25,810 --> 00:13:28,340 dat is geplant door de server binnenkant van uw browser, 227 00:13:28,340 --> 00:13:31,960 en de binnenkant van dat bestand of die onder hen bytes is een soort van identificatie. 228 00:13:31,960 --> 00:13:35,640 Misschien is het letterlijk uw gebruikersnaam, maar vaker is het iets meer cryptische uitziende 229 00:13:35,640 --> 00:13:43,700 als dit ding hier - bo8dal3ct enzovoort - dit is echt grote alfanumerieke tekenreeks 230 00:13:43,700 --> 00:13:47,050 dat is echt alleen bedoeld om een ​​unieke id voor u zijn. 231 00:13:47,050 --> 00:13:49,790 Of u kunt het zien als een soort van virtuele hand stempel. 232 00:13:49,790 --> 00:13:53,020 Als je naar een club of een pretpark, om te onthouden dat je daadwerkelijk hebt betaald 233 00:13:53,020 --> 00:13:55,850 en gegaan in, zetten ze een beetje rood sticker op je hand of iets dergelijks, 234 00:13:55,850 --> 00:13:59,270 en dat herinnert de mensen aan de balie die je al hebt betaald 235 00:13:59,270 --> 00:14:01,340 en je kunt komen en gaan wanneer u wilt. 236 00:14:01,340 --> 00:14:04,250 Cookies zijn een beetje in dezelfde geest dat. 237 00:14:04,250 --> 00:14:08,070 De eerste keer dat ik een bezoek aan deze website, zoals ik net deed na het wissen van mijn cache, 238 00:14:08,070 --> 00:14:11,620 de webserver, het apparaat in dit geval, zet een stempel op mijn hand 239 00:14:11,620 --> 00:14:15,030 wiens naam is PHPSESSID, sessie-ID, 240 00:14:15,030 --> 00:14:18,260 waarvan de waarde is dit echt lange alfanumerieke tekenreeks. 241 00:14:18,260 --> 00:14:22,470 >> Dus dat nu is een soort van emblazoned op mijn hand, zodat de volgende keer dat ik geraakt opnieuw te laden 242 00:14:22,470 --> 00:14:25,230 of handmatig naar deze URL in een browser, 243 00:14:25,230 --> 00:14:29,230 mijn browser per definitie van HTTP gaat de hand stempel te presenteren 244 00:14:29,230 --> 00:14:31,940 opnieuw en opnieuw en opnieuw. 245 00:14:31,940 --> 00:14:34,550 Dus ook al is de server niet per se weten wie ik ben, 246 00:14:34,550 --> 00:14:39,610 ze in ieder geval weten dat ik dezelfde gebruiker of in ieder geval, meer in het bijzonder, dezelfde browser. 247 00:14:39,610 --> 00:14:45,660 En dus is dit uiteindelijk hoe de SESSION superglobal wordt uitgevoerd. 248 00:14:45,660 --> 00:14:51,200 De server heeft geen idee wie je bent als je opnieuw een website voor de tweede of de derde keer 249 00:14:51,200 --> 00:14:53,410 tenzij u presenteren deze hand stempel. 250 00:14:53,410 --> 00:14:55,530 En zodra je die hand stempel te presenteren, 251 00:14:55,530 --> 00:14:59,370 de webserver gaat in wezen in een kleine database van de eigen 252 00:14:59,370 --> 00:15:06,040 en controles, oke, ik heb net gezien dat de kant stempel van de gebruiker bo8dal3ct enzovoort. 253 00:15:06,040 --> 00:15:09,850 Laat me zien welke informatie de programmeur heeft opgeslagen 254 00:15:09,850 --> 00:15:12,380 binnenkant van de superglobal over deze gebruiker, 255 00:15:12,380 --> 00:15:17,000 en dan laat ik er zeker van dat deze gegevens weer is de binnenkant van de SESSION superglobal 256 00:15:17,000 --> 00:15:19,830 zodat de programmeur kan opnieuw toegang tot die gegevens 257 00:15:19,830 --> 00:15:23,360 ook al was het een aantal minuten of uren geleden ingesteld. 258 00:15:23,360 --> 00:15:26,150 Met andere woorden, koekjes, die een slechte rap enige tijd kreeg 259 00:15:26,150 --> 00:15:29,990 als gevolg van onzekerheden in browsers en ze kunnen echt schenden onze privacy en dit alles, 260 00:15:29,990 --> 00:15:31,900 ze hebben eigenlijk groot nut want zonder hen 261 00:15:31,900 --> 00:15:36,110 zou je voortdurend aan te melden bij elke Facebook-pagina die u bezoekt 262 00:15:36,110 --> 00:15:40,680 of om de Gmail e-mail te lezen als de browser niet over een of andere manier van herinneren 263 00:15:40,680 --> 00:15:43,320 dat u al geverifieerd. 264 00:15:43,320 --> 00:15:46,640 >> Dus op deze manier cookies heen en weer verzonden over de draad. 265 00:15:46,640 --> 00:15:52,470 Een andere nieuwsgierigheid over cookies, vooral hier, is dat dit volledig in leesbare tekst. 266 00:15:52,470 --> 00:15:54,930 Er is geen encryptie gebeurt hier ook, 267 00:15:54,930 --> 00:15:57,240 en inderdaad ik ben met behulp van HTTP op dit moment. 268 00:15:57,240 --> 00:16:00,890 Een van onze favorieten momenten in CS50, die nu 2 jaar geleden, 269 00:16:00,890 --> 00:16:04,750 werd rond de tijd van een tool genaamd Firesheep kwam. 270 00:16:04,750 --> 00:16:08,320 Dit was een gratis stukje software dat werd gemaakt door een security-onderzoeker 271 00:16:08,320 --> 00:16:13,250 als een wake-up call voor de gemeenschap om te zeggen hoe gruwelijk geïmplementeerd 272 00:16:13,250 --> 00:16:17,900 bepaalde authenticatie mechanismen op het web waren. 273 00:16:17,900 --> 00:16:22,880 Dus voor enige tijd, Facebook was bijna volledig via HTTP, HTTPS geen. 274 00:16:22,880 --> 00:16:25,640 En zelfs als je geen idee hoe de crypto werkt hebben, S is veilig 275 00:16:25,640 --> 00:16:27,950 dus het betekent dat er op zijn minst enige encryptie betrokken. 276 00:16:27,950 --> 00:16:30,610 Facebook heeft gebruikt om gebruikersnamen en wachtwoorden te coderen, 277 00:16:30,610 --> 00:16:33,560 maar zodra u gekeken naar uw steekt of uw berichten of uw nieuwsfeed, 278 00:16:33,560 --> 00:16:35,360 dat alles was niet versleuteld. 279 00:16:35,360 --> 00:16:37,870 Dus was Gmail tot net een jaar of 2 geleden. 280 00:16:37,870 --> 00:16:41,100 Elke keer dat je ingelogd bent, ja, ze gebruikten veilige encryptie, 281 00:16:41,100 --> 00:16:44,300 maar daarna deden ze niet. En waarom zou dat zijn? 282 00:16:44,300 --> 00:16:49,210 Waarom niet gewoon de hele tijd te gebruiken cryptografie in gebruik is gevallen als deze? 283 00:16:49,210 --> 00:16:53,700 Wat is dat? Ik denk dat ik iets hoorde. [Student] Speed. 284 00:16:53,700 --> 00:16:56,250 Snelheid, toch? Er zijn manieren om dit. 285 00:16:56,250 --> 00:16:59,610 Maar als je gewoon een soort van denken logisch, als je versleutelen iets, 286 00:16:59,610 --> 00:17:01,820 je moet op zijn minst een beetje meer werk te doen. 287 00:17:01,820 --> 00:17:05,460 In PSET 2 wanneer u Caesar of Vigenere uitgevoerd of zelfs Crack, 288 00:17:05,460 --> 00:17:07,760 gewoon het afdrukken van een string is relatief eenvoudig. 289 00:17:07,760 --> 00:17:12,040 Versleutelen en vervolgens het afdrukken van een reeks minimaal vereist een beetje meer werk. 290 00:17:12,040 --> 00:17:14,520 >>  Voor super populaire websites zoals Google en Facebook, 291 00:17:14,520 --> 00:17:18,839 als je moet meer werk te doen voor elke gebruiker voor elke webpagina die ze bezoeken, 292 00:17:18,839 --> 00:17:20,520 dat duurt gewoon meer CPU-tijd. 293 00:17:20,520 --> 00:17:22,920 En als u meer CPU-tijd, moet u wellicht meer servers, 294 00:17:22,920 --> 00:17:24,270 wat betekent dat je nodig zou kunnen hebben meer geld. 295 00:17:24,270 --> 00:17:27,579 En zo nog vele jaren dit gewoon was echt niet best practice. 296 00:17:27,579 --> 00:17:31,440 Mensen zouden gebruiken SSL-codering wanneer het nodig was. 297 00:17:31,440 --> 00:17:34,960 Maar het bleek, en als deze kerel met Firesheep gemaakt super duidelijk, 298 00:17:34,960 --> 00:17:37,920 wanneer jullie die op dit moment op Facebook op dit moment - 299 00:17:37,920 --> 00:17:39,880 Uit nieuwsgierigheid, laten we eens kijken of je fess up. 300 00:17:39,880 --> 00:17:42,620 Als je op Facebook op dit moment in een aantal tab, zelfs als het niet voorgrond, 301 00:17:42,620 --> 00:17:46,610 is uw URL HTTP of HTTPS? 302 00:17:46,610 --> 00:17:50,560 [Meerdere studenten] S. S? [Gelach] 303 00:17:50,560 --> 00:17:55,510 Oke. Elke HTTP? Slechts 1? Oke. 304 00:17:55,510 --> 00:17:58,940 Dus ieder van ons kan hacken die vent Facebook-account op dit moment. 305 00:17:58,940 --> 00:18:04,100 Voor het overgrote deel is geworden standaard ingeschakeld, tenminste in sommige websites. 306 00:18:04,100 --> 00:18:08,120 En lang verhaal kort, als uw webverkeer is niet versleuteld, 307 00:18:08,120 --> 00:18:12,960 niet alleen de HTML heen en weer gaan over de WiFis ongecodeerde, 308 00:18:12,960 --> 00:18:16,760 dus maak je dingen zoals koekjes heen en weer te gaan in de lucht 309 00:18:16,760 --> 00:18:18,940 zonder enige vorm van encryptie. 310 00:18:18,940 --> 00:18:23,540 Dus als je gewoon een beetje van de programmering savvy of een beetje Googlen vaardigheden 311 00:18:23,540 --> 00:18:27,410 om gratis software die dit doet vinden, alles wat je hoeft te doen zitten in Starbucks 312 00:18:27,410 --> 00:18:30,680 of zitten in een luchthaven waar is over het algemeen niet-versleutelde WiFi 313 00:18:30,680 --> 00:18:36,070 en gewoon kijken naar trefwoorden als Set-Cookie: PHPSESSID of 314 00:18:36,070 --> 00:18:39,300 want als je over de technische savvy om gewoon kijken naar de WiFi- 315 00:18:39,300 --> 00:18:43,010 voor alle bits die stromen door de lucht voor dit patroon, 316 00:18:43,010 --> 00:18:50,840 kun je dan zeggen dat kerel PHPSESSID toevallig bo8dal enzovoort. 317 00:18:50,840 --> 00:18:53,890 En dan weer als je voldoende technisch onderlegde of het juiste gereedschap, 318 00:18:53,890 --> 00:18:58,890 je kunt gewoon opnieuw configureren dan uw eigen browser om te beginnen met de presentatie van die hand stempel 319 00:18:58,890 --> 00:19:05,030 naar Facebook.com, en Facebook is gewoon om aan te nemen dat je die vent 320 00:19:05,030 --> 00:19:09,880 omdat alles wat ze weten is niet wie je bent, maar dat u deze unieke id hebben. 321 00:19:09,880 --> 00:19:14,650 Dus als je steelt, dat unieke identificatie en legt dit aan de webserver als uw eigen, 322 00:19:14,650 --> 00:19:16,860 ze zijn gewoon te laten zien dat iemands news feed 323 00:19:16,860 --> 00:19:18,980 of die persoon berichten of porren. 324 00:19:18,980 --> 00:19:23,190 >> En ik zou nu Google hoe je misschien HTTPS te activeren voor Facebook. 325 00:19:23,190 --> 00:19:25,150 Maar het is echt zo simpel als dat. 326 00:19:25,150 --> 00:19:27,660 En dus Facebook en Google en dergelijke hebben gekregen echt goed in, 327 00:19:27,660 --> 00:19:31,870 maar houd een oogje in het zeil des te meer voor de websites die u bezoekt die geen gebruik maken HTTP 328 00:19:31,870 --> 00:19:35,020 en hebben een soort van gevoelige informatie over hen, 329 00:19:35,020 --> 00:19:37,490 of het nu financieel of persoonlijk of dergelijke. 330 00:19:37,490 --> 00:19:43,180 Als ze niet met behulp van deze, kan misschien wel cookies als dit heel gemakkelijk gestolen 331 00:19:43,180 --> 00:19:46,270 en dan gesmeed, en dat is precies wat Firesheep deed. 332 00:19:46,270 --> 00:19:48,250 Je hoefde niet naar een programmeur te zijn. 333 00:19:48,250 --> 00:19:51,680 Het enige wat je moest doen was hebben een Internet-verbinding, download dit gratis tool, 334 00:19:51,680 --> 00:19:56,490 en wat het zou doen is je aanmelden en dan kunt u zien op de Facebook-namen 335 00:19:56,490 --> 00:20:00,170 van iedereen in Sanders in dit bijzondere demonstratie, om je heen 336 00:20:00,170 --> 00:20:03,260 en alles wat je moest doen was klikken op hun naam en de software geautomatiseerd proces 337 00:20:03,260 --> 00:20:05,970 van snuiven dat cookie, de presentatie van het aan Facebook als uw eigen, 338 00:20:05,970 --> 00:20:07,990 en, voila, je bent ingelogd 339 00:20:07,990 --> 00:20:11,190 Dus dit is weer een van die "doe dit niet" officieel. 340 00:20:11,190 --> 00:20:14,660 Als u uw eigen thuisnetwerk en je wilt sleutelen, met alle middelen, 341 00:20:14,660 --> 00:20:17,530 maar beseffen dat dit wel over de streep op een universitaire omgeving. 342 00:20:17,530 --> 00:20:20,030 >> Maar het doel is hier echt te benadrukken niet hoe dit te doen 343 00:20:20,030 --> 00:20:22,320 maar hoe te verdedigen tegen dit soort dingen. 344 00:20:22,320 --> 00:20:26,180 En het triviale oplossing hier, ook al is het zelf onjuist is, 345 00:20:26,180 --> 00:20:31,360 is om echt te verminderen gebruik van sites die niet met HTTPS voortdurend. 346 00:20:31,360 --> 00:20:34,520 Dus sites als Facebook en Google steeds meer selectievakjes 347 00:20:34,520 --> 00:20:36,200 waar u kunt kiezen om in dit soort dingen, 348 00:20:36,200 --> 00:20:40,000 en banken hebben dit al jaren om soortgelijke redenen. 349 00:20:40,000 --> 00:20:43,580 Dus gewoon een beetje een factor angst als we kunnen. Maar dat is het in een notendop. 350 00:20:43,580 --> 00:20:46,420 Dat is hoe een server onthoudt wie je bent. 351 00:20:46,420 --> 00:20:50,760 En zodra ze zich kunnen herinneren wie je bent, kunnen ze zich iets herinneren over jou 352 00:20:50,760 --> 00:20:56,140 dat de programmeur heeft binnen opgeslagen van deze speciale superglobal genaamd $ _SESSION. 353 00:20:56,140 --> 00:20:59,750 En voor PSET 7 gebruiken we het triviaal gewoon naar een int herinneren, 354 00:20:59,750 --> 00:21:02,260 namelijk de unieke ID van de gebruiker die is ingelogd, 355 00:21:02,260 --> 00:21:05,880 zodat wij weten dat ze er al geweest. 356 00:21:05,880 --> 00:21:12,450 Hebt u vragen dan op sessies of cookies en dergelijke? 357 00:21:12,450 --> 00:21:15,130 Firesheep werkt niet meer zo goed werkt, 358 00:21:15,130 --> 00:21:18,310 en je moet je computer in een speciale promiscuous mode 359 00:21:18,310 --> 00:21:20,700 dus je bent daadwerkelijk te luisteren voor het verkeer naast jezelf. 360 00:21:20,700 --> 00:21:23,940 Dus als u op dit moment het downloaden van Firesheep, beseffen dat het niet zo gemakkelijk 361 00:21:23,940 --> 00:21:26,850 als het ooit was om aan te tonen. 362 00:21:26,850 --> 00:21:29,070 Oke. En doe het dan niet in Sanders. Doe het thuis. 363 00:21:29,070 --> 00:21:30,890 Databases. 364 00:21:30,890 --> 00:21:33,580 Een van de dingen die we deden in PSET 7 zeer bewust 365 00:21:33,580 --> 00:21:37,780 werd geven wij u een voorbeeld database tabel voor gebruikers die sommige gebruikers-ID's heeft, 366 00:21:37,780 --> 00:21:41,020 sommige gebruikersnamen, en een aantal gecodeerde wachtwoorden daarin. 367 00:21:41,020 --> 00:21:44,520 En zoals u zult zien, als je dat nog niet gedaan, je gaat te hebben om de tabel te wijzigen een beetje. 368 00:21:44,520 --> 00:21:47,710 Je gaat te hebben om wat cache toe te voegen aan elk van de gebruikers in die tabel, 369 00:21:47,710 --> 00:21:51,130 en je gaat te hebben om een ​​andere geschiedenis tafel, een portfolio tabel toe te voegen, 370 00:21:51,130 --> 00:21:53,310 of misschien noem het iets anders. 371 00:21:53,310 --> 00:21:56,740 Maar in termen van na te denken over hoe dit te doen, laten we open deze tool 372 00:21:56,740 --> 00:22:00,570 die we gebruikten op vrijdag, maar als onbekende, het apparaat wordt geleverd met een gereedschap 373 00:22:00,570 --> 00:22:04,680 riep phpMyAdmin die toevallig is geschreven in PHP, 374 00:22:04,680 --> 00:22:07,950 maar zijn doel in het leven, nadat ik hier aanmelden als jharvard met karmozijn, 375 00:22:07,950 --> 00:22:15,160 is om mij een gebruiksvriendelijke manier van kijken en het veranderen van mijn database. 376 00:22:15,160 --> 00:22:18,040 >> De database die ik die op het apparaat wordt genoemd MySQL. 377 00:22:18,040 --> 00:22:23,420 Dit is erg populair, en het is een gratis open source database die is heerlijk eenvoudig te gebruiken, 378 00:22:23,420 --> 00:22:25,620 vooral met vooreinden zo. 379 00:22:25,620 --> 00:22:29,350 Wat deze tool kan ik doen om, bijvoorbeeld, is porren rond tafels. 380 00:22:29,350 --> 00:22:30,890 Laat me ga je gang en doen. 381 00:22:30,890 --> 00:22:36,580 Op vrijdag hebben we een tabel met de naam studenten die was super eenvoudig. 382 00:22:36,580 --> 00:22:41,680 Het had 3 kolommen - id, naam en e-mail - en ik handmatig ingevoegd een paar rijen 383 00:22:41,680 --> 00:22:44,420 als David en Mike in dit specifieke voorbeeld. 384 00:22:44,420 --> 00:22:47,290 Laten we dit een beetje verder, en laten we aannemen dat we meer willen herinneren 385 00:22:47,290 --> 00:22:49,660 dan alleen naam en e-mail over een gebruiker. 386 00:22:49,660 --> 00:22:53,090 Laat me klik Structuur hier omhoog naar de top. 387 00:22:53,090 --> 00:22:55,440 En nogmaals, de PSET loopt u door de vereiste stappen hier, 388 00:22:55,440 --> 00:22:58,150 dus maak je geen zorgen als sommige van deze is een beetje snel. 389 00:22:58,150 --> 00:22:59,690 Dan ga ik hier op. 390 00:22:59,690 --> 00:23:02,270 Ik ga een bepaald aantal kolommen na e-mail toe te voegen 391 00:23:02,270 --> 00:23:04,130 want ik wil iets als huis toe te voegen. 392 00:23:04,130 --> 00:23:06,640 Ik ben vergeten om een ​​student het huis op te nemen. 393 00:23:06,640 --> 00:23:11,400 Laat me klik op Ga naar, en nu hebben we deze vorm, dat helaas een beetje breed is van links naar rechts, 394 00:23:11,400 --> 00:23:13,710 maar ik ga naar de naam van dit veld huis te bellen, 395 00:23:13,710 --> 00:23:16,050 en dan het type ik nu moet kiezen. 396 00:23:16,050 --> 00:23:18,870 Dus laten we eens een korte praten over de verschillende soorten in MySQL 397 00:23:18,870 --> 00:23:24,590 want waar PHP is zwak getypt en het soort speelt zo nauw nemen met typen, 398 00:23:24,590 --> 00:23:29,430 in een database in het bijzonder het is super belangrijk om daadwerkelijk te typen gebruiken in uw voordeel 399 00:23:29,430 --> 00:23:33,260 omdat een van de dingen die MySQL en andere database-engines voor u kan doen 400 00:23:33,260 --> 00:23:37,910 is ervoor te zorgen dat u geen valse gegevens in uw database. 401 00:23:37,910 --> 00:23:41,850 Dit is een soort van gratis foutcontrole voor u beschikbaar. 402 00:23:41,850 --> 00:23:46,250 >> Voor huis we natuurlijk niet willen dat het een int, dat is een 32-bits waarde in MySQL zijn. 403 00:23:46,250 --> 00:23:49,810 We hebben praten kort op vrijdag over varchar, wat staat voor variabele lengte char. 404 00:23:49,810 --> 00:23:54,720 Wat is dit? Hiermee kunt u aangeven dat u wilt dat dit een string van een soort zijn. 405 00:23:54,720 --> 00:23:56,840 Je hoeft niet echt op voorhand weet hoe lang het is, 406 00:23:56,840 --> 00:24:00,100 dus we zullen willekeurig zeggen dat een huis naam kan 255 tekens, 407 00:24:00,100 --> 00:24:04,190 maar je zou kunnen gaan met 32, 64 - een aantal echt. 408 00:24:04,190 --> 00:24:10,700 Maar het voordeel van het gebruik van een varchar over een veld met de naam char is wat? 409 00:24:10,700 --> 00:24:15,110 Net intuïtief als ik naar beneden scrollen hier, ziet er char is en er is varchar. 410 00:24:15,110 --> 00:24:19,520 Varchar is variabele lengte char, char is een vaste lengte char. 411 00:24:19,520 --> 00:24:24,730 Dus alleen gebaseerd op die definitie, wat is het voordeel of nadeel van elk van deze? 412 00:24:24,730 --> 00:24:30,490 Met andere woorden, die geeft om het onderscheid, of waarom heeft dat met jou? 413 00:24:31,660 --> 00:24:35,750 >> Ja. [Student] Varchar heeft meer flexibiliteit, maar neemt meer geheugen in beslag. 414 00:24:35,750 --> 00:24:40,730 Goed. Varchar neemt meer - Laten we eens kijken. Ik weet niet zeker of ik dat goed gehoord. 415 00:24:40,730 --> 00:24:42,360 Kun je zeggen dat als meer? 416 00:24:42,360 --> 00:24:45,850 [Student] Ik zei varchar waarschijnlijk meer flexibiliteit heeft, maar het neemt wel meer geheugen. 417 00:24:45,850 --> 00:24:51,170 Interessant. Oke. Varchar geeft je waarschijnlijk meer flexibiliteit maar neemt meer geheugen. 418 00:24:51,170 --> 00:24:53,220 Dat laatste is niet noodzakelijk waar. 419 00:24:53,220 --> 00:24:56,290 Het hangt af van de context, maar laten we terugkeren naar dat. 420 00:24:56,290 --> 00:25:03,230 >> [Onverstaanbaar student reactie] Precies. 421 00:25:03,230 --> 00:25:06,900 Het is eigenlijk zo dat char zal typisch meer geheugen kunnen gebruiken 422 00:25:06,900 --> 00:25:10,950 omdat een char, net als in C, is als een string, het is een array van karakters. 423 00:25:10,950 --> 00:25:13,690 Dus als je zegt een char veld van lengte 255, 424 00:25:13,690 --> 00:25:16,910 de database wordt letterlijk gaat geven u 255 tekens. 425 00:25:16,910 --> 00:25:22,290 En als het huis eindigt in MATHER en 6 tekens in totaal, 426 00:25:22,290 --> 00:25:25,090 je verspilt meer dan 200 tekens. 427 00:25:25,090 --> 00:25:29,640 >> Dus een varchar effectief gebruikt alleen zoveel tekens in als nodig is 428 00:25:29,640 --> 00:25:31,590 tot een maximum bedrag. 429 00:25:31,590 --> 00:25:35,470 Maar de prijs die u betaalt is eigenlijk de prestaties, mogelijk. 430 00:25:35,470 --> 00:25:39,740 Als je van tevoren weet dat al je snaren gaan worden 8 karakters - 431 00:25:39,740 --> 00:25:43,090 Bijvoorbeeld, stel dat je wachtwoorden van lengte 8 vereist - 432 00:25:43,090 --> 00:25:47,350 het voordeel van het gebruik van een char veld af en toe, maar niet vaak, 433 00:25:47,350 --> 00:25:51,100 is een vaste lengte iets geven zoals een wachtwoord 434 00:25:51,100 --> 00:25:53,300 want nu de database kan nog slimmer worden. 435 00:25:53,300 --> 00:25:58,160 Indien zij weet dat elke char veld elke string in een kolom dezelfde lengte, 436 00:25:58,160 --> 00:26:00,780 je terug de functie van random access. 437 00:26:00,780 --> 00:26:05,110 U kunt rond te springen tussen de verschillende char velden in uw database tabel 438 00:26:05,110 --> 00:26:07,940 omdat denken aan een database als rijen en kolommen. 439 00:26:07,940 --> 00:26:11,670 Als elk van de strings even lang, 440 00:26:11,670 --> 00:26:17,820 u dat de eerste byte 0 is, de volgende byte is 8 441 00:26:17,820 --> 00:26:20,240 en vervolgens 16 en 24 enzovoort. 442 00:26:20,240 --> 00:26:24,500 Dus als alle snaren zijn van dezelfde lengte, kun je springen rond veel efficiënter. 443 00:26:24,500 --> 00:26:26,710 Dus dat kan een voordeel in termen van prestaties, 444 00:26:26,710 --> 00:26:29,420 maar meestal u niet beschikt over de luxe van van tevoren te weten, 445 00:26:29,420 --> 00:26:32,170 dus een varchar is de weg te gaan. 446 00:26:32,170 --> 00:26:36,030 Hier is nog een detail dat zelfs Facebook kwam uiteindelijk. 447 00:26:36,030 --> 00:26:39,670 Ints zijn geweldig, en we soort van ze te gebruiken standaard elk gewenst moment willen we een aantal, 448 00:26:39,670 --> 00:26:41,750 maar het is slechts 32 bits. 449 00:26:41,750 --> 00:26:46,210 >> En hoewel Facebook niet helemaal hebben nu 4 miljard gebruikers, 450 00:26:46,210 --> 00:26:48,680 er is zeker een aantal mensen die er zijn met meerdere accounts 451 00:26:48,680 --> 00:26:50,960 of accounts die zijn geopend en weer gesloten, 452 00:26:50,960 --> 00:26:55,130 en dus Facebook zelf geloof ik een paar jaar geleden moest de overgang van int 453 00:26:55,130 --> 00:27:00,010 om, zoals wordt treffend noemde, bigint, die op slechts 64 bits in plaats daarvan. 454 00:27:00,010 --> 00:27:02,230 Dus dit is ook een ontwerpbeslissing. 455 00:27:02,230 --> 00:27:06,570 Je zou verbazingwekkend geluk spreken als je afstudeerproject gaat opstarten, 456 00:27:06,570 --> 00:27:10,010 heeft 4 miljard en 1 gebruikers, geven of te nemen, 457 00:27:10,010 --> 00:27:13,200 in welk geval het gebruik ints misschien een beetje kortzichtig. 458 00:27:13,200 --> 00:27:16,230 Maar in werkelijkheid, uw gebruikers tafel is waarschijnlijk prima met ints. 459 00:27:16,230 --> 00:27:19,340 Maar voor iets als PSET 7, zoals uw geschiedenis tafel, 460 00:27:19,340 --> 00:27:23,700 u zou kunnen hebben duizenden, miljoenen gebruikers als je evolueren naar etrade.com. 461 00:27:23,700 --> 00:27:26,020 Dus terwijl je misschien niet meer dan 4 miljard gebruikers, 462 00:27:26,020 --> 00:27:30,070 deze gebruikers heb je wel zou kunnen hebben meer dan 4 miljard transacties in de tijd - 463 00:27:30,070 --> 00:27:33,200 koopt en verkoopt en dingen die er in hun geschiedenis. 464 00:27:33,200 --> 00:27:38,090 Dus als je verwacht - nogmaals, dit zijn goede problemen te hebben als je zoveel data - 465 00:27:38,090 --> 00:27:40,920 als je anticiperen op gegevens van meer dan de grootte van een int, 466 00:27:40,920 --> 00:27:47,740 gaan met iets als bigint is een richting die niet vaak genoeg door ontwerpers 467 00:27:47,740 --> 00:27:49,710 omdat mensen cijfer dat niet gaat om een ​​probleem te zijn, 468 00:27:49,710 --> 00:27:51,930 maar het is zo gemakkelijk om uit te kiezen iets dat groter is dan dat. 469 00:27:51,930 --> 00:27:55,380 Decimaal we gebruiken in PSET 7, die vaste precisie specificeert 470 00:27:55,380 --> 00:27:59,840 zodat u kunt voorkomen dat de kwesties met betrekking tot praalwagens en tweepersoonskamers en realen en dergelijke. 471 00:27:59,840 --> 00:28:02,440 >> En dan is er nog een aantal andere velden hier. We zwaaien onze handen op hen tot op zekere hoogte. 472 00:28:02,440 --> 00:28:07,270 Maar data, tijden hebben allemaal een voorgeschreven formaat in MySQL, 473 00:28:07,270 --> 00:28:10,830 en het voordeel van het opslaan van data als data en niet varchars 474 00:28:10,830 --> 00:28:15,730 betekent dat de database daadwerkelijk kan ze opnieuw formatteren in verschillende formaten, 475 00:28:15,730 --> 00:28:18,800 of er een US-formaat of Europese formaat of iets dergelijks - maar je wilt - 476 00:28:18,800 --> 00:28:22,700 veel efficiënter dan wanneer het slechts enkele generieke varchar. 477 00:28:22,700 --> 00:28:25,150 En dan is er nog een aantal andere binaire, varbinary, blobs. 478 00:28:25,150 --> 00:28:28,580 Dit zijn binaire grote objecten, en u kunt ook opslag van binaire gegevens 479 00:28:28,580 --> 00:28:30,750 evenals geometrische gegevens in een database. 480 00:28:30,750 --> 00:28:34,350 Maar voor ons zullen we meestal de zorg over ints en varchars en dergelijke. 481 00:28:34,350 --> 00:28:36,230 Laten we eindigen dit voorbeeld met huis. 482 00:28:36,230 --> 00:28:40,030 Huis Ik ga willekeurig zeggen zal 255 tekens. 483 00:28:40,030 --> 00:28:42,850 Dan standaardwaarde kunnen we dit doen. 484 00:28:42,850 --> 00:28:47,440 We kunnen standaard zetten iedereen in Mather House, bijvoorbeeld. 485 00:28:47,440 --> 00:28:49,710 Dat is hoe we aangeven waarmee de databank 486 00:28:49,710 --> 00:28:52,460 moet ervoor zorgen dat iemand altijd een waarde heeft. Maar ik laat dat. 487 00:28:52,460 --> 00:28:55,270 In feite, voor mensen die leven buiten de campus en niet in een huis, 488 00:28:55,270 --> 00:28:59,590 misschien heb ik eigenlijk willen aangeven dat de standaardwaarde voor huis NULL is, 489 00:28:59,590 --> 00:29:04,890 en dan moet ik deze doos te controleren en de database is het goed als de gebruiker het huis is NULL vertellen. 490 00:29:04,890 --> 00:29:07,270 >> Nogmaals, dit is een ander afweermechanisme u kunt in plaats 491 00:29:07,270 --> 00:29:10,590 dus je hoeft niet eens te se in je PHP-code. 492 00:29:10,590 --> 00:29:14,630 De database zal ervoor zorgen dat de dingen wel of niet NULL. 493 00:29:14,630 --> 00:29:17,310 En dan tot slot, attributen. 494 00:29:17,310 --> 00:29:18,920 Geen van deze zijn echt relevant. 495 00:29:18,920 --> 00:29:22,880 Binaire, unsigned - geen van die relevant zijn voor een varchar. 496 00:29:22,880 --> 00:29:24,220 Index. 497 00:29:24,220 --> 00:29:27,320 Weet iemand of onthouden of een keuze maken van wat een index is 498 00:29:27,320 --> 00:29:29,510 voor iets als huis? 499 00:29:29,510 --> 00:29:35,240 Ook dit is in feite een belangrijke en relatief eenvoudig ontwerpbeslissing. 500 00:29:35,240 --> 00:29:39,200 Voor degenen die nog niet hebben gezien, op vrijdag spraken we kort over primaire sleutels. 501 00:29:39,200 --> 00:29:43,240 In een database tabel, een primaire sleutel is het veld of de kolom 502 00:29:43,240 --> 00:29:46,270 dat een unieke identificatie van rijen in de tabel. 503 00:29:46,270 --> 00:29:49,150 Dus in de huidige tabel hebben we id's, we hebben namen en e-mails. 504 00:29:49,150 --> 00:29:52,050 Welke van deze is de beste kandidaat om een ​​primaire sleutel zijn, 505 00:29:52,050 --> 00:29:55,810 wiens rol is om uniek te identificeren rijen? 506 00:29:55,810 --> 00:29:57,530 Waarschijnlijk ID. 507 00:29:57,530 --> 00:29:59,930 Ongetwijfeld kunnen we ook gebruik maken van wat wel? 508 00:29:59,930 --> 00:30:02,860 Misschien kun je gebruik maken van e-mail omdat in theorie is het unieke 509 00:30:02,860 --> 00:30:05,380 tenzij mensen delen e-mailaccounts. 510 00:30:05,380 --> 00:30:09,980 Maar de realiteit is dat als u gebruik maakt van een numeriek ID als 1234, 511 00:30:09,980 --> 00:30:14,170 dat is slechts 32 bits, terwijl een e-mailadres kan dit aantal bytes of dit aantal bytes. 512 00:30:14,170 --> 00:30:16,610 Dus in termen van efficiëntie voor unieke identificatoren, 513 00:30:16,610 --> 00:30:19,270 het de neiging om goede praktijken net naar een int gebruiken 514 00:30:19,270 --> 00:30:23,090 zelfs als je een stukje tekst kandidaat die je kon misschien wel gebruiken. 515 00:30:23,090 --> 00:30:26,760 >> Voor iets als huis, mag dit niet als een primaire sleutel 516 00:30:26,760 --> 00:30:30,770 omdat toen slechts 1 persoon kon leven in Mather en 1 persoon in Currier en dergelijke. 517 00:30:30,770 --> 00:30:32,790 Ook moet dit niet uniek zijn. 518 00:30:32,790 --> 00:30:37,830 Het verschil tussen primaire en uniek is dat bij de huidige tabel 519 00:30:37,830 --> 00:30:42,620 ID zou zijn primaire, maar e-mail is niet primair voor de reden dat we zojuist genoemde - 520 00:30:42,620 --> 00:30:44,740 prestaties - maar het moet nog steeds uniek. 521 00:30:44,740 --> 00:30:47,200 Zo kunt u nog steeds af te dwingen uniciteit zonder dat de vordering 522 00:30:47,200 --> 00:30:49,520 dat het een super belangrijke primaire veld. 523 00:30:49,520 --> 00:30:52,610 Maar deze is heel nuttig: Index. 524 00:30:52,610 --> 00:30:56,180 Als u weet bij voorbaat voor uw afstudeerproject, voor PSET 7, of in het algemeen, 525 00:30:56,180 --> 00:30:59,480 dat dit veld huis gaat om iets wat je zoeken op een stuk 526 00:30:59,480 --> 00:31:01,910 met behulp van de select trefwoord of iets anders, 527 00:31:01,910 --> 00:31:05,180 dan kunt u preventief vertellen de database zijn magische werk 528 00:31:05,180 --> 00:31:10,510 en zorg ervoor dat het creëert in het geheugen een fancy data structuren die nodig zijn 529 00:31:10,510 --> 00:31:13,770 om zoekopdrachten op basis van huis te versnellen. 530 00:31:13,770 --> 00:31:17,860 Misschien zal het een hash-tabel te gebruiken, misschien zal het gebruik maken van een gelinkte lijst. 531 00:31:17,860 --> 00:31:21,260 In werkelijkheid, neigt het gebruik van een boom, vaak genaamd een B-tree - 532 00:31:21,260 --> 00:31:24,090 niet een binaire boom maar een B-tree - dat een zeer breed boom 533 00:31:24,090 --> 00:31:27,370 dat je zou kunnen zien in een klasse, zoals CS124, de datastructuren klasse. 534 00:31:27,370 --> 00:31:31,800 Maar in het kort, hoeft u zich geen zorgen te maken over dat bij het gebruik van slimme database software. 535 00:31:31,800 --> 00:31:35,890 Je kunt gewoon vertellen, "Index dit veld, dus ik kan zoeken op het efficiënter." 536 00:31:35,890 --> 00:31:40,250 >> Als u dit af en je probeert te zoeken voor iedereen in de database die woont in Mather, 537 00:31:40,250 --> 00:31:42,710 het zal evolueren in lineair zoeken. 538 00:31:42,710 --> 00:31:45,360 En als je hebt 6.000 undergrads alle levende in sommige huis, 539 00:31:45,360 --> 00:31:47,900 je gaat de hele tabel te zoeken naar de Matherites te vinden, 540 00:31:47,900 --> 00:31:52,190 terwijl als je zegt Index, hopelijk zal het iets dicht bij een logaritmische zoektocht 541 00:31:52,190 --> 00:31:54,510 om dat soort studenten te vinden. 542 00:31:54,510 --> 00:31:56,750 Dit is slechts een gratis functie aan te zetten, 543 00:31:56,750 --> 00:31:59,530 hoewel is een prijs van ongeveer ruimte. 544 00:31:59,530 --> 00:32:02,690 Tot slot, auto-increment, dit AI veld, 545 00:32:02,690 --> 00:32:05,830 wat betekent dat gewoon als het een int en u niet wilt dat om de zorg te verhogen het zelf 546 00:32:05,830 --> 00:32:07,570 elke keer als er een nieuwe gebruiker moet je dat, 547 00:32:07,570 --> 00:32:11,910 en elke gebruiker die wordt geplaatst krijgt automatisch een nieuwe ID. 548 00:32:11,910 --> 00:32:15,620 Laten we op Opslaan, en nu laten we fout vinden in dit ontwerp. 549 00:32:15,620 --> 00:32:20,200 Als ik in Bladeren, merk op dat zowel Mike en mijn huis NULL is. 550 00:32:20,200 --> 00:32:22,420 Ik kan gebruik maken van phpMyAdmin om dit handmatig te bewerken. 551 00:32:22,420 --> 00:32:25,110 Ik kan naar binnen gaan en typ in Mather en druk dan op Enter, 552 00:32:25,110 --> 00:32:27,740 en nu ziet de tafel anders is. 553 00:32:27,740 --> 00:32:29,270 Maar let op ik kon iets anders doen ook. 554 00:32:29,270 --> 00:32:33,530 David's ID is 1, dus phpMyAdmin weer is slechts een administratieve tool; 555 00:32:33,530 --> 00:32:35,970 dit is niet iets wat je gebruikers ooit zult zien. 556 00:32:35,970 --> 00:32:38,810 Dus als ik in plaats daarvan klikt u op het tabblad SQL-up top - 557 00:32:38,810 --> 00:32:41,450 en opnieuw, zal PSET 7 u kennismaken met meer van deze vragen - 558 00:32:41,450 --> 00:32:45,260 Ik kan handmatig uitvoeren van de SQL Structured Query Language commando 559 00:32:45,260 --> 00:32:56,410 UPDATE gebruikers SET huis = 'Pfoho' WHERE id = 1. 560 00:32:56,410 --> 00:33:00,830 Deze SQL-query's zijn, mooi genoeg, mooi leesbaar van links naar rechts. 561 00:33:00,830 --> 00:33:04,350 Werk de gebruikers tabel, stelt u het veld genaamd huis Pfoho 562 00:33:04,350 --> 00:33:06,830 waar de gebruiker-ID is 1. 563 00:33:06,830 --> 00:33:11,480 Of ik zou zelfs doen wanneer e-mail = 'malan@harvard.edu'. 564 00:33:11,480 --> 00:33:14,860 Zolang dat uniek is mij identificeert, zou dat zo goed werkt. 565 00:33:14,860 --> 00:33:18,810 Maar ID heeft de neiging om hogere prestaties, dus laten we dat doen. 566 00:33:18,810 --> 00:33:22,950 Laten we klik op Go. Oke, geen lecture.users niet bestaat. Wat is mijn fout? 567 00:33:22,950 --> 00:33:26,220 Wat is de tabel hier eigenlijk wel? 568 00:33:26,220 --> 00:33:28,770 Het heet studenten, alleen maar omdat dat is wat we deden hier boven links bovenaan. 569 00:33:28,770 --> 00:33:31,860 Het heet studenten, niet-gebruikers. Dus klik op Ga nu. 570 00:33:31,860 --> 00:33:34,330 1 rij getroffen. Query duurde 0,01 seconden. 571 00:33:34,330 --> 00:33:38,010 Als ik klik op Nu Bladeren, Malan woont in Pfoho. 572 00:33:38,010 --> 00:33:42,070 Dus dat is een ander smaak van SQL, maar de PSET zal je door een beetje meer van dat. 573 00:33:42,070 --> 00:33:44,710 >> Er is een domme beslissing die ik al heb hier gemaakt. 574 00:33:44,710 --> 00:33:47,820 Ik zou zeggen dat dit database-ontwerp inefficiënt is 575 00:33:47,820 --> 00:33:51,650 want hoe meer mensen ik toevoegen aan de studenten tafel, 576 00:33:51,650 --> 00:33:54,730 hoe meer van ons ik beginnen met het toevoegen, des te meer van de TFS ik beginnen met het toevoegen, 577 00:33:54,730 --> 00:33:58,320 we gaan beginnen om te zien wat ontslagen in deze tabel? 578 00:34:00,840 --> 00:34:06,020 >> Ja. [Student] Toen hij zag dat het in studenten, gebruiken we dezelfde [onverstaanbaar] 579 00:34:06,020 --> 00:34:07,360 Dezelfde - Juist, precies. 580 00:34:07,360 --> 00:34:10,400 Dus als 400 mensen wonen in Mather, geven of te nemen, 581 00:34:10,400 --> 00:34:15,000 uiteindelijk deze tabel gaat tot 400 rijen die "Mather," "Mather zeggen hebben" 582 00:34:15,000 --> 00:34:16,590 "Mather," "Mather," "Mather." 583 00:34:16,590 --> 00:34:19,820 We verliezen al deze bytes, en er zijn een paar afhaalrestaurants daar. 584 00:34:19,820 --> 00:34:23,080 1, is er de gekke hoek geval als iemand betaalt een hoop geld 585 00:34:23,080 --> 00:34:25,949 en hernoemt Mather, hebben we nu onze hele database tabel te wijzigen. 586 00:34:25,949 --> 00:34:29,730 Dat gaat niet vaak gebeuren, hoewel Pfoho was ooit de naam North House 15 jaar geleden, 587 00:34:29,730 --> 00:34:32,310 zo gebeurt. Maar dat is niet alles wat dwingend. 588 00:34:32,310 --> 00:34:36,000 Aantrekkelijker dan een hoek geval als dat van om de gegevens in bulk te werken 589 00:34:36,000 --> 00:34:41,150 voor een database is de reden waarom je het opslaan MATHER opnieuw en opnieuw en opnieuw en opnieuw? 590 00:34:41,150 --> 00:34:43,020 Dat is een hoop van tekens, 6 tekens. 591 00:34:43,020 --> 00:34:45,500 Kunnen we nog beter doen dan dat, vooral voor Pforzheimer? 592 00:34:45,500 --> 00:34:48,320 Zo kunnen we beter doen dan dat veel personages. 593 00:34:48,320 --> 00:34:51,790 Waarom niet gewoon associëren een unieke identificatie met elk huis 594 00:34:51,790 --> 00:34:55,020 en opslaan dat voor elke gebruiker? Dus laten we dit proberen. 595 00:34:55,020 --> 00:35:00,610 In plaats van gewoon gebruik maken van de studenten tafel, laat me naar mijn lezing database up hier links bovenaan. 596 00:35:00,610 --> 00:35:02,600 Let hier staat Maak tafel. 597 00:35:02,600 --> 00:35:04,550 Laat me maak een nieuwe tabel met de naam huizen. 598 00:35:04,550 --> 00:35:08,880 Het aantal kolommen zal worden 2. Enter. 599 00:35:08,880 --> 00:35:11,200 Nu heb ik 2 velden. 600 00:35:11,200 --> 00:35:14,600 Ik ga noemen dit de naam, en het gaat om een ​​varchar met lengte 255, 601 00:35:14,600 --> 00:35:18,770 >> maar dat is vrij willekeurig. Laat ik dit hier beneden volgens afspraak. 602 00:35:18,770 --> 00:35:22,840 Dus zet een ID hier. Laten we elk huis een unieke identificatie. 603 00:35:22,840 --> 00:35:25,360 Laten we elk huis een naam. 604 00:35:25,360 --> 00:35:30,980 Laten we aangeven dat de identifier zal unsigned net volgens afspraak alleen positieve getallen. 605 00:35:30,980 --> 00:35:35,020 Laten we verder gaan en geven deze een auto-increment veld voor nu. 606 00:35:35,020 --> 00:35:38,160 En doen we nog iets nodig? 607 00:35:38,160 --> 00:35:41,010 Laten we verder gaan en klik op Opslaan. 608 00:35:41,010 --> 00:35:42,480 Nu heb ik een tweede tabel. 609 00:35:42,480 --> 00:35:45,860 Let nog even terzijde dit is het iets cryptisch SQL-opdracht 610 00:35:45,860 --> 00:35:50,280 dat je had moeten handmatig zo niet met behulp van een administratieve tool zoals phpMyAdmin. 611 00:35:50,280 --> 00:35:51,990 Dus een andere reden waarom we het gebruiken. 612 00:35:51,990 --> 00:35:55,480 Het is heerlijk handig soort van pedagogische, want je kunt klikken om 613 00:35:55,480 --> 00:36:01,050 en uitzoeken hoe dingen werken door gewoon kopiëren en plakken wat phpMyAdmin gedaan. 614 00:36:01,050 --> 00:36:04,150 Maar de Create tafel commando is wat net uitgevoerd, en hier is mijn tafel. 615 00:36:04,150 --> 00:36:11,370 Laat me nu gaan en gebruik maken van ruwe SQL in plaats van te simpel door te klikken op het tabblad Invoegen. 616 00:36:11,370 --> 00:36:15,040 Laat me niet INSERT INTO huizen, 617 00:36:15,040 --> 00:36:22,230 en ik ga zeggen de naam van het huis gaat een waarde van 'Mather' hebben. 618 00:36:22,230 --> 00:36:24,790 Dat is het. Deze syntax is een beetje meer cryptisch. 619 00:36:24,790 --> 00:36:26,660 Dit is de naam van de velden we willen voegen. 620 00:36:26,660 --> 00:36:30,390 Dit zijn de waarden die we willen invoegen in die velden. Laat mij klik op Go. 621 00:36:30,390 --> 00:36:34,410 Geplaatst is 1 rij duurde 0,02 seconden. Laat ik klik nu op Bladeren. 622 00:36:34,410 --> 00:36:42,020 >> Let op, als ik klik op Bladeren, er is Mather, waarvan de id is door automatisering het getal 1. 623 00:36:42,020 --> 00:36:45,000 Laat mij er nog een. Laat me gaan in de SQL-tabblad. 624 00:36:45,000 --> 00:36:52,950 INSERT INTO huizen. De naam van het huis zal een waarde hebben Pfoho enzovoort. 625 00:36:52,950 --> 00:36:56,350 Go. En ik kan blijven doen opnieuw en opnieuw en opnieuw. 626 00:36:56,350 --> 00:36:59,470 Of als je te vervelen met behulp van phpMyAdmin, kunt u gewoon gebruik maken van het tabblad Invoegen 627 00:36:59,470 --> 00:37:01,000 en niet naar de ruwe SQL typen. 628 00:37:01,000 --> 00:37:04,690 Je kunt gewoon bang it out sneller door te typen, bijvoorbeeld Currier, Enter, 629 00:37:04,690 --> 00:37:07,610 en nu als we op Bladeren klikt, is er Currier met een ID van 3. 630 00:37:07,610 --> 00:37:09,920 Dus dit is wat we bedoelen met auto-increment. 631 00:37:09,920 --> 00:37:12,280 Maar nu moeten we iets vast te stellen in studenten. 632 00:37:12,280 --> 00:37:16,240 In de studenten wat moet het gegevenstype van het huis veld nu zijn? 633 00:37:16,240 --> 00:37:19,450 Het moet een int zijn, toch? 634 00:37:19,450 --> 00:37:23,950 Dus het doel hier is om factor uit, ook bekend als normaliseren de tabellen 635 00:37:23,950 --> 00:37:27,940 zodat we niet redundant opslaan van informatie in een van mijn tabellen. 636 00:37:27,940 --> 00:37:31,130 En nogmaals, is het pad dat we waren hier gaat Mather, Mather zeggen, 637 00:37:31,130 --> 00:37:34,220 Mather, Mather, Pfoho, Pfoho, Pfoho, Pfoho, die zeer redundant 638 00:37:34,220 --> 00:37:36,240 in termen van de verspilling van de tekens. 639 00:37:36,240 --> 00:37:40,820 Dus laat me ga je gang en dit veranderen door te klikken op Structuur, 640 00:37:40,820 --> 00:37:44,620 en laat mij ga je gang en afvinken het huis veld, klikt u op Wijzigen, 641 00:37:44,620 --> 00:37:46,990 en nu ga ik dit veranderen naar een int zijn. 642 00:37:46,990 --> 00:37:49,490 255 is niet meer relevant. 643 00:37:49,490 --> 00:37:54,010 Laat me ga je gang en zeg dat is prima als het nog NULL. Opslaan. 644 00:37:54,010 --> 00:37:55,870 Nu tabel studenten met succes is gewijzigd, 645 00:37:55,870 --> 00:37:59,090 en nogmaals opmerken huis is een int. 646 00:37:59,090 --> 00:38:02,220 Even terzijde, negeer het aantal tussen haakjes als het gaat om ints. 647 00:38:02,220 --> 00:38:03,770 >> Dit is voor legacy redenen. 648 00:38:03,770 --> 00:38:06,920 Terug in de dag wanneer u niet GUI's hebben, je in plaats daarvan had een command line omgeving, 649 00:38:06,920 --> 00:38:11,580 de 10 en 11 respectievelijk aangegeven hoeveel tekens je moet zien 650 00:38:11,580 --> 00:38:13,950 in het terminal-venster om daadwerkelijk weer te geven velden. 651 00:38:13,950 --> 00:38:19,150 Het heeft niets te maken met de bitlengte van de werkelijke veld, dus we zullen alleen dat negeren voor nu. 652 00:38:19,150 --> 00:38:20,990 Nu moet ik gaan in deze tabel. 653 00:38:20,990 --> 00:38:24,610 En als David woont in Mather, mag huis niet 0 zijn, 654 00:38:24,610 --> 00:38:27,350 dat is een standaard int waarde die het dichtst op NULL. 655 00:38:27,350 --> 00:38:29,810 Hij moet leven in huis 1. 656 00:38:29,810 --> 00:38:36,870 Laten we willekeurig zeggen dat Mike woont in Pfoho, dus huisnummer 2. 657 00:38:36,870 --> 00:38:40,160 Nu is mijn tafel ziet er een beetje meer cryptisch. 658 00:38:40,160 --> 00:38:41,960 Maar rekening houden met de efficiëntie. 659 00:38:41,960 --> 00:38:44,860 Ik ben nu met behulp van slechts 32 bits om het huis te identificeren, 660 00:38:44,860 --> 00:38:49,530 wat betekent dat er slechts 1 canonieke definitie van mijn huis Mather en Pfoho 661 00:38:49,530 --> 00:38:52,090 en dat is in de huizen tabel. 662 00:38:52,090 --> 00:38:55,880 Dus als ik nu weer aan deze tabellen, denk aan het op deze manier. 663 00:38:55,880 --> 00:39:01,980 Hier heb ik mijn studenten tafel, en aan de rechterkant is er deze nummers, 1 en 2. 664 00:39:01,980 --> 00:39:04,180 1 is Mather, 2 Pfoho. 665 00:39:04,180 --> 00:39:08,580 We hebben die dezelfde nummers in deze andere tabel, genaamd huizen 666 00:39:08,580 --> 00:39:11,020 1 en 2 en 3 voor de drie huizen. 667 00:39:11,020 --> 00:39:14,990 Wat we nu willen doen is de mogelijkheid in code, PHP en SQL, 668 00:39:14,990 --> 00:39:18,800 te sorteren van deze weer aan tafels, waar als deze zijn de studenten en dit zijn de huizen, 669 00:39:18,800 --> 00:39:22,050 willen we een of andere manier te combineren, zodat een lijn staat met 1, 670 00:39:22,050 --> 00:39:25,670 2 lijnen met 2, en zodat we kunnen achterhalen waar David 671 00:39:25,670 --> 00:39:28,000 en waar Mike en waar iedereen woont. 672 00:39:28,000 --> 00:39:31,850 Om dit te doen kunnen we het uitvoeren van een SQL-query als volgt uit. 673 00:39:31,850 --> 00:39:40,470 SELECT * FROM studenten huizen JOIN ON - 674 00:39:40,470 --> 00:39:43,000 En nu, wat velden willen we mee aan de hand? 675 00:39:43,000 --> 00:39:49,520 Dus students.house = houses.id. 676 00:39:49,520 --> 00:39:54,150 >> Een beetje cryptisch, maar dit deel betekent letterlijk een nieuwe tijdelijke tabel 677 00:39:54,150 --> 00:39:56,690 dat is het resultaat van de toetreding tot de studenten en huizen. 678 00:39:56,690 --> 00:40:00,340 En hoe wil je hier combineren de toppen van mijn vingers? 679 00:40:00,340 --> 00:40:05,280 Stel de studenten huis veld gelijk is aan de huizen 'ID-veld. 680 00:40:05,280 --> 00:40:10,220 En als ik nu klik op Start, ik terug ben precies wat ik hoopte te. 681 00:40:10,220 --> 00:40:15,890 David is in Mather, Mike is in Pfoho, en ik zie ook de unieke identificatoren. 682 00:40:15,890 --> 00:40:18,640 Maar het punt is nu heb ik een volledige tabel. 683 00:40:18,640 --> 00:40:23,020 En dus is de afhaalmaaltijden hier voor PSET 7 of echt voor het afstudeerproject: 684 00:40:23,020 --> 00:40:25,830 Als u vindt dat u een stuk van informatie redundant opslaan, 685 00:40:25,830 --> 00:40:28,850 of het nu een huis, misschien is het een stad, staat en postcode 686 00:40:28,850 --> 00:40:32,050 waar ZIP kan meestal, maar niet altijd gebruikt worden als een unieke identificatie, 687 00:40:32,050 --> 00:40:35,810 gaan wel door de uitoefening mentaal en dan met iets als phpMyAdmin 688 00:40:35,810 --> 00:40:40,660 van factoring erop dat gemeenschappelijke gegevens want vooral als uw website krijgt meer goed gebruikt 689 00:40:40,660 --> 00:40:45,440 en meer populair, dit is hoe je ervoor zorgen dat alles is super snel, 690 00:40:45,440 --> 00:40:51,930 door aan de database veel aanwijzingen om unieke mogelijk. 691 00:40:51,930 --> 00:40:53,860 Dat was veel. 692 00:40:53,860 --> 00:40:59,010 Nog vragen? Oke. Laten we daar neemt een 5-minuten pauze en te hergroeperen. 693 00:41:01,600 --> 00:41:03,540 Oke. 694 00:41:03,540 --> 00:41:08,680 Het volgende is een voorbeeld dat werd enkele jaren geleden gebruikt toen ik CS161, 695 00:41:08,680 --> 00:41:10,960 dat is de besturingssystemen klasse op het college 696 00:41:10,960 --> 00:41:15,160 die bekend staat om zijn geweldig, maar een gekke hoeveelheid werk, 697 00:41:15,160 --> 00:41:19,810 en het richt zich echt op een aantal van de low-level problemen die zich voordoen in besturingssystemen 698 00:41:19,810 --> 00:41:22,700 en zelfs in de wereld van databases. 699 00:41:22,700 --> 00:41:27,040 >> Het verhaal dat werd verteld door mijn professor, Margo Seltzer, dat jaar was als volgt. 700 00:41:27,040 --> 00:41:30,990 Stel dat je een beetje slaapzaal koelkast voor u en uw kamergenoot hebben 701 00:41:30,990 --> 00:41:34,030 en jullie beiden echt leuk melk. 702 00:41:34,030 --> 00:41:36,360 Dus je komt thuis uit de klas op een dag, je kamergenoot is er nog niet, 703 00:41:36,360 --> 00:41:39,650 het openen van de koelkast, en je realiseert je: "Oh damn, we hebben geen melk." 704 00:41:39,650 --> 00:41:42,070 Dus u de koelkast sluit, loop je de overkant van de straat om CVS 705 00:41:42,070 --> 00:41:45,830 en krijgen in de steeds lange rijen om wat melk te kopen bij CVS. 706 00:41:45,830 --> 00:41:48,470 Ondertussen, je kamergenoot komt thuis van zijn of haar klas, 707 00:41:48,470 --> 00:41:51,690 komt de kamer, opent de koelkast echt willen wat melk, 708 00:41:51,690 --> 00:41:54,130 opent de koelkast en: "Verdomme, geen melk." 709 00:41:54,130 --> 00:41:57,890 Zodat hij of zij sluit de koelkast, loopt de deur uit, en gaat ABP om 710 00:41:57,890 --> 00:42:00,910 of ergens anders dan CVS waar je niet van plan om tegen elkaar aan 711 00:42:00,910 --> 00:42:02,790 om te gaan krijgen wat melk. 712 00:42:02,790 --> 00:42:04,820 Natuurlijk een paar minuten later, jullie beiden terug naar huis 713 00:42:04,820 --> 00:42:07,740 en nu heb je twee keer zoveel melk als je eigenlijk wilde. 714 00:42:07,740 --> 00:42:10,670 En omdat melk, nu het gaat om te gaan slecht, omdat je melk 715 00:42:10,670 --> 00:42:14,200 maar dat is niet echt zoals melk, dus nu heb je te veel melk, dus het gaat verzuren. 716 00:42:14,200 --> 00:42:16,830 Dit is een vreselijke, vreselijke situatie. 717 00:42:16,830 --> 00:42:22,920 Wat zou hebben opgelost deze hachelijke situatie als je de eerste kamergenoot thuis? Ja. 718 00:42:22,920 --> 00:42:25,970 [Student] Je had moeten een briefje. [Gelach] 719 00:42:25,970 --> 00:42:28,090 Goed. Je had moeten een briefje. 720 00:42:28,090 --> 00:42:32,320 Je moet hebben een Post-it notitie of iets dergelijks te zeggen: "Gone voor melk," 721 00:42:32,320 --> 00:42:36,830 en dan je kamergenoot conceptueel zou zijn uitgesloten van eigenlijk om dat te doen. 722 00:42:36,830 --> 00:42:38,010 Of je kan een stap verder gaan. 723 00:42:38,010 --> 00:42:41,060 Je kon de koelkast letterlijk te vergrendelen met een soort van hangslot, 724 00:42:41,060 --> 00:42:44,870 en nu je kamergenoot zal letterlijk worden uitgesloten van de koelkast. 725 00:42:44,870 --> 00:42:48,520 Als we terug generaliseren van de programmering, 726 00:42:48,520 --> 00:42:51,610 je kunt bijna denken aan de koelkast als een soort variabele of een struct, 727 00:42:51,610 --> 00:42:53,500 een soort container voor informatie. 728 00:42:53,500 --> 00:42:58,290 Het probleem fundamenteel is dat jullie beiden mochten inspecteren 729 00:42:58,290 --> 00:43:02,370 of lees de toestand van deze gegevens structuur, 730 00:43:02,370 --> 00:43:08,050 maar je zag het op verschillende momenten en toch jullie beiden een beslissing genomen 731 00:43:08,050 --> 00:43:11,920 gebaseerd op de toestand van de wereld op de verschillende tijdstippen. 732 00:43:11,920 --> 00:43:15,570 Dus had je opgesloten de koelkast, zou je op zijn minst kunnen worden vermeden je kamergenoot 733 00:43:15,570 --> 00:43:19,070 van hebben kunnen de toestand van de wereld inspecteren 734 00:43:19,070 --> 00:43:22,530 zodat hij of zij kon niet gemaakt heeft, deze beslissing. 735 00:43:22,530 --> 00:43:25,780 Dus databases, zo blijkt, voortdurend hebben dit probleem. 736 00:43:25,780 --> 00:43:31,050 >> Laten we eens kijken of we een scenario te construeren. 737 00:43:31,050 --> 00:43:34,310 Stel dat je een soort van slechte kerel en je gaat aan Bank of America 738 00:43:34,310 --> 00:43:37,950 of een van de andere plaatsen op het plein dat een paar geldautomaten naast elkaar te hebben, 739 00:43:37,950 --> 00:43:41,200 en een of andere manier je bedacht hoe een pinpas dupliceren - niet zo moeilijk. 740 00:43:41,200 --> 00:43:42,730 Het is gewoon een magneetstrip. 741 00:43:42,730 --> 00:43:45,180 En dus wat je wilt proberen te doen is dit spel te spelen 742 00:43:45,180 --> 00:43:49,060 waarbij je er 1 kaart in 1 machine, een andere kaart in de andere machine, 743 00:43:49,060 --> 00:43:51,980 en je wezen wilt proberen om tegelijkertijd geld opnemen, 744 00:43:51,980 --> 00:43:54,930 voorstellen want dat verhaal gaat als volgt. 745 00:43:54,930 --> 00:43:57,350 De machine op de linker neemt uw kaart en uw PIN-code, 746 00:43:57,350 --> 00:44:00,240 en dan zeg je: "Geef me $ 100." 747 00:44:00,240 --> 00:44:04,790 De ATM is geprogrammeerd om eerst een select doen op de database of het equivalent - 748 00:44:04,790 --> 00:44:10,780 wat-database het is gebruikt - om te zien heeft deze gebruiker zijn ten minste $ 100 in zijn of haar account? 749 00:44:10,780 --> 00:44:16,180 Zo ja, dan spugen de $ 100 en aftrekken $ 100 van hun evenwicht. 750 00:44:16,180 --> 00:44:20,470 Maar natuurlijk als er meerdere machines hier of meerdere manieren van de inspectie van 751 00:44:20,470 --> 00:44:23,560 de toestand van deze wereld, de bankkluis, om te zien hoeveel geld je hebt, 752 00:44:23,560 --> 00:44:26,780 veronderstellen dat enkel toevallig de machine links en rechts 753 00:44:26,780 --> 00:44:30,140 zowel die vraag op ongeveer hetzelfde moment in de tijd. 754 00:44:30,140 --> 00:44:34,160 >> En dit kan zeker gebeuren. Geldautomaten zijn computers deze dagen. 755 00:44:34,160 --> 00:44:37,670 Dus als de machine op de linker zegt: "Ja, je moet ten minste $ 100," 756 00:44:37,670 --> 00:44:42,150 ondertussen de machine aan de rechterkant zegt: "Ja, u ten minste $ 100 hebben," 757 00:44:42,150 --> 00:44:47,420 dan beiden gaan naar hun programma's af en eigenlijk spugen de $ 100 758 00:44:47,420 --> 00:44:50,820 en zeggen: "Voorheen je 200 dollar had." 759 00:44:50,820 --> 00:44:54,890 "Laat me het actualiseren van de variabele nu tussen de € 100 nog in de rekening." 760 00:44:54,890 --> 00:44:58,780 Maar als beiden hebben uw account gecontroleerd balans en vond dat het 200 dollar 761 00:44:58,780 --> 00:45:02,000 en beiden dan doen de wiskunde en bijvoorbeeld 200 - 100, 762 00:45:02,000 --> 00:45:06,990 de machines hebben mogelijk uitspugen twee $ 100 rekeningen in elke machine, 763 00:45:06,990 --> 00:45:11,360 maar ze hebben alleen bijgewerkt uw som saldo op $ 100. 764 00:45:11,360 --> 00:45:15,130 Met andere woorden, je hebt genomen van $ 200, maar omdat ze inspecteerde de toestand van de wereld 765 00:45:15,130 --> 00:45:18,840 gelijktijdig en maakte vervolgens een beslissing op basis van die waarde, 766 00:45:18,840 --> 00:45:21,930 ze misschien niet de wiskunde uiteindelijk goed. 767 00:45:21,930 --> 00:45:25,520 Dus in een bank situatie te je echt wilt een soort van lock-out hebben 768 00:45:25,520 --> 00:45:28,450 zodat zodra je de toestand van sommige variabele gecontroleerd 769 00:45:28,450 --> 00:45:31,220 dat is echt belangrijk, zoals uw rekeningsaldo, 770 00:45:31,220 --> 00:45:36,070 laat niemand anders beslissingen nemen op basis van dat totdat je klaar bent doe je ding, 771 00:45:36,070 --> 00:45:38,920 waar in dit geval bent u de ATM aan de linkerkant. 772 00:45:38,920 --> 00:45:41,160 Lock iedereen uit. 773 00:45:41,160 --> 00:45:44,650 U kunt dit effect daadwerkelijk te realiseren in een paar verschillende manieren. 774 00:45:44,650 --> 00:45:48,660 >> De eenvoudigste manier in MySQL is een lijn van SQL dat we je gaf 775 00:45:48,660 --> 00:45:52,030 in het probleem set specificatie die lijkt precies op deze. 776 00:45:52,030 --> 00:45:57,420 In te voegen in de tabel - wat het ook heet - een id, een symbool, en een aandeel, een aantal aandelen, 777 00:45:57,420 --> 00:45:59,660 de volgende waarden, bijvoorbeeld. 778 00:45:59,660 --> 00:46:03,370 Als u nog niet hebt gelezen de spec, dit is een voorbeeld met betrekking tot hoe ga je over het 779 00:46:03,370 --> 00:46:07,340 het kopen van 10 aandelen van deze penny stock for President Skroob, 780 00:46:07,340 --> 00:46:10,340 waarvan gebruikers-ID gebeurt te zijn het getal 7? 781 00:46:10,340 --> 00:46:14,070 Dit zegt INSERT INTO tabel worden de volgende id, symbool, en het aantal aandelen 782 00:46:14,070 --> 00:46:18,200 van 7, 'DVN.V' en 10. 783 00:46:18,200 --> 00:46:21,510 Maar - maar, maar, maar - de tweede regel is het belangrijkste. 784 00:46:21,510 --> 00:46:26,310 ON DUPLICATE KEY UPDATE aandelen = aandelen + VALUES (aandelen). 785 00:46:26,310 --> 00:46:28,350 Zo totaal cryptisch uitziende op het eerste gezicht. 786 00:46:28,350 --> 00:46:31,990 Maar dat deze SQL query, hoewel wikkelt op 2 lijnen, 787 00:46:31,990 --> 00:46:35,920 is 1 lange query, het betekent dat het atoom is 788 00:46:35,920 --> 00:46:41,000 in de zin dat deze zoekopdracht ofwel wordt samen of helemaal niet uitgevoerd. 789 00:46:41,000 --> 00:46:45,100 En per definitie van MySQL, dat is hoe ze deze query uitgevoerd. 790 00:46:45,100 --> 00:46:51,010 Het is per definitie in de handleiding gegarandeerd alle voeren tegelijk of helemaal niet. 791 00:46:51,010 --> 00:46:54,020 De reden hiervoor is als volgt. 792 00:46:54,020 --> 00:46:58,540 Als in dit geval je probeert om 10 aandelen van voorraad te kopen, 793 00:46:58,540 --> 00:47:02,260 het is een soort van hetzelfde verhaal als de melk, het is een soort van hetzelfde verhaal als de ATM. 794 00:47:02,260 --> 00:47:04,970 >> Als u de fout niet het gebruik van deze syntaxis 795 00:47:04,970 --> 00:47:09,610 maar in plaats daarvan selecteren uit de database om het aantal aandelen van deze penny stock te zien 796 00:47:09,610 --> 00:47:13,750 heeft de Voorzitter Skroob hebben, en veronderstel dat hij heeft 10 aandelen, 797 00:47:13,750 --> 00:47:19,330 en dan nog wat fractie van een seconde later je dan doen een UPDATE-instructie, 798 00:47:19,330 --> 00:47:24,810 dat is een ander statement in SQL die zegt ga je gang en voeg 10 meer aandelen 799 00:47:24,810 --> 00:47:28,700 aan zijn huidige 10 zodat idealiter het totaal is 20, 800 00:47:28,700 --> 00:47:33,490 het probleem is dat in de database van de huidige systemen en omdat in de huidige computers 801 00:47:33,490 --> 00:47:35,990 je hebt meerdere processors, meerdere cores - 802 00:47:35,990 --> 00:47:38,920 met andere woorden, kunnen computers letterlijk moeten doen meerdere dingen tegelijk - 803 00:47:38,920 --> 00:47:44,270 er is geen garantie dat uw SELECT en uw UPDATE in dit geval 804 00:47:44,270 --> 00:47:46,150 gaan gebeuren rug aan rug. 805 00:47:46,150 --> 00:47:49,140 Dus een slechte scenario zou zijn doe je op de SELECT 806 00:47:49,140 --> 00:47:51,670 om te zien hoeveel aandelen van deze penny stock heeft Skroob hebben, 807 00:47:51,670 --> 00:47:54,710 en dan gewoon bij toeval een andere database query wordt uitgevoerd - 808 00:47:54,710 --> 00:47:57,740 misschien zijn Skroob in een ander browservenster proberen om 10 aandelen te kopen 809 00:47:57,740 --> 00:48:00,700 in een ander venster geheel, net als de ATM - 810 00:48:00,700 --> 00:48:05,410 en stel dat een andere query krijgt in tussen SELECT en UPDATE. 811 00:48:05,410 --> 00:48:10,210 Zo kan het gebeuren dat Skroob nu een aantal aantal aandelen verliest zijn 812 00:48:10,210 --> 00:48:14,340 omdat een ander proces wordt de inspectie van de staat van zijn wereld, 813 00:48:14,340 --> 00:48:17,800 of krijgt hij meer aandelen dan hij zou moeten hebben. 814 00:48:17,800 --> 00:48:23,250 We zullen niet ingaan op de details van wat die bepaalde verhaallijnen zou zijn, 815 00:48:23,250 --> 00:48:28,380 maar het punt is als je een variabelen waarde controleren en vervolgens een beslissing nemen, 816 00:48:28,380 --> 00:48:32,500 als er een risico dat iemand anders iets tussen die twee verklaringen, 817 00:48:32,500 --> 00:48:36,220 zoals kan gebeuren in multiprocessor-systemen, in multicore-systemen, 818 00:48:36,220 --> 00:48:41,220 computers met de mogelijkheid om meerdere dingen tegelijk te doen, kan er slechte dingen gebeuren 819 00:48:41,220 --> 00:48:44,530 zoals bankrekeningen verkeerd gedebiteerd, kopen twee keer zo veel melk, 820 00:48:44,530 --> 00:48:46,730 of in dit geval het verkeerde aantal aandelen. 821 00:48:46,730 --> 00:48:48,370 Maar er is een eenvoudiger manier om na te denken over dit. 822 00:48:48,370 --> 00:48:53,290 >> Het blijkt dat SQL ondersteunt, als u correct te configureren uw tafel, 823 00:48:53,290 --> 00:48:56,920 iets genaamd transacties, die ik zou willen stellen is eigenlijk nog makkelijker te begrijpen 824 00:48:56,920 --> 00:49:00,650 dan dit, maar het is niet een 1-liner, dus het is eigenlijk een beetje meer betrokken. 825 00:49:00,650 --> 00:49:04,960 Er is letterlijk een statement in SQL genaamd START TRANSACTIE. 826 00:49:04,960 --> 00:49:08,300 Net zoals er SELECT, UPDATE, INSERT, DELETE, JOIN en en een hoop anderen, 827 00:49:08,300 --> 00:49:10,970 Er zijn zoekwoorden als START TRANSACTIE. 828 00:49:10,970 --> 00:49:13,560 En wat je dan doen in het kader van PSET 7 - 829 00:49:13,560 --> 00:49:17,270 je hoeft dit niet te doen voor PSET 7, het is nadrukkelijk gewezen, niet noodzakelijk is, 830 00:49:17,270 --> 00:49:18,830 maar voor de laatste projecten kan het nuttig zijn - 831 00:49:18,830 --> 00:49:22,820 als je belt een query van START TRANSACTIE en dan een andere query 832 00:49:22,820 --> 00:49:25,620 en een query en andere, nog een en nog, 833 00:49:25,620 --> 00:49:31,860 die vragen zullen niet daadwerkelijk worden uitgevoerd totdat u de SQL-instructie COMMIT, 834 00:49:31,860 --> 00:49:37,220 op welk punt, of het nu 2 stellingen of 20 verklaringen, zullen ze allemaal in een keer te worden uitgevoerd, 835 00:49:37,220 --> 00:49:42,770 wat betekent dat niemand anders kan per ongeluk kopen te veel melk of betaalkaart te veel geld 836 00:49:42,770 --> 00:49:46,340 of kopen te veel aandelen omdat al uw vragen zullen uitvoeren 837 00:49:46,340 --> 00:49:48,410 rug aan rug aan rug aan rug. 838 00:49:48,410 --> 00:49:51,580 En dit is super belangrijk, vooral als je iets als dit te doen. 839 00:49:51,580 --> 00:49:54,900 Dit is een willekeurige voorbeeld dat zegt laten we het actualiseren van de bankrekening 840 00:49:54,900 --> 00:50:00,200 door het instellen van een evenwicht dat gelijk is aan balans - $ 1000 waar de rekening nummer 2. 841 00:50:00,200 --> 00:50:04,260 En dan de tweede verklaring is laten we nu neerleggen dat 1000 dollar 842 00:50:04,260 --> 00:50:07,310 in andermans bankrekening waarvan het rekeningnummer is: 1. 843 00:50:07,310 --> 00:50:10,400 >> Met andere woorden, dit is een perfect voorbeeld van waar u wilt er zeker van 844 00:50:10,400 --> 00:50:13,590 dat beide verklaringen gebeuren of helemaal 845 00:50:13,590 --> 00:50:15,450 omdat anders de klant gaat krijgen geschroefd 846 00:50:15,450 --> 00:50:17,670 en je gaat om hun geld te nemen en niet elders deponeren, 847 00:50:17,670 --> 00:50:20,470 of de bank gaat om geschroefd waar je naartoe gaat om het geld te storten 848 00:50:20,470 --> 00:50:23,140 maar niet echt trek deze af van de rekening van de gebruiker. 849 00:50:23,140 --> 00:50:25,810 Dus je wilt ze allebei uit te voeren samen. 850 00:50:25,810 --> 00:50:29,140 Zo komt in de wereld transacties. 851 00:50:29,140 --> 00:50:31,360 Dus dat is iets om in de rug van je geest, 852 00:50:31,360 --> 00:50:34,710 niet zozeer ten behoeve van slechts een afstudeerproject, 853 00:50:34,710 --> 00:50:36,700 maar als u wilt uw uiteindelijke project ergens te nemen, 854 00:50:36,700 --> 00:50:39,040 als je wilt op te starten wat gezelschap rond het, 855 00:50:39,040 --> 00:50:41,270 als je wilt een aantal studenten groep probleem op te lossen op de campus 856 00:50:41,270 --> 00:50:45,210 en eigenlijk een live, actieve website, dit zijn de soort van subtiele bugs die kunnen ontstaan 857 00:50:45,210 --> 00:50:49,480 als je niet helemaal door te denken wat er kan gebeuren als 2 personen 858 00:50:49,480 --> 00:50:54,190 proberen toegang tot uw website op letterlijk hetzelfde moment in de tijd, 859 00:50:54,190 --> 00:50:56,890 waarbij hun vragen anders zou raken met elkaar verweven. 860 00:50:58,840 --> 00:51:01,420 >> Klaar voor wat JavaScript, een teaser daarvan? 861 00:51:01,420 --> 00:51:04,320 Dit is onze laatste taal voor het semester. Oke. 862 00:51:04,320 --> 00:51:09,940 Gelukkig, JavaScript ziet er heel, heel, heel vergelijkbaar met de 2 talen, C en PHP, 863 00:51:09,940 --> 00:51:11,140 we hebben tot nu toe gedaan. 864 00:51:11,140 --> 00:51:14,340 Er is geen JavaScript PSET 7, maar het is een ongelooflijk nuttig instrument 865 00:51:14,340 --> 00:51:18,840 als het gaat om het doen van web-based laatste projecten of eigenlijk alleen maar web programmeren in het algemeen. 866 00:51:18,840 --> 00:51:20,950 Dus een snel overzicht van iets genaamd DOM. 867 00:51:20,950 --> 00:51:23,600 Hier is een super eenvoudige web-pagina die gewoon echt zegt hallo, wereld 868 00:51:23,600 --> 00:51:25,970 zowel in de titel en in het lichaam. 869 00:51:25,970 --> 00:51:29,270 De inkeping is voorgesteld enige tijd, 870 00:51:29,270 --> 00:51:31,380 Er is inderdaad een hiërarchie aan webpagina's. 871 00:51:31,380 --> 00:51:34,220 Ik kon tekenen ditzelfde stukje HTML als een boom, 872 00:51:34,220 --> 00:51:37,470 terugdenkend aan onze discussies van de data structuren in C, als volgt. 873 00:51:37,470 --> 00:51:40,710 Ik heb een aantal speciale root node genaamd de document node, 874 00:51:40,710 --> 00:51:43,650 en we zullen zien de analoge van dit in JavaScript in slechts een moment. 875 00:51:43,650 --> 00:51:48,330 Het eerste kind en enige kind van dat in dit geval is de HTML-tag. 876 00:51:48,330 --> 00:51:49,880 Er is geen directe mapping van de doctype. 877 00:51:49,880 --> 00:51:53,170 Dat is een speciale ding, dus moeten we het gewoon negeren als het gaat om deze DOM, 878 00:51:53,170 --> 00:51:55,810 Dit Document Object Model boom. 879 00:51:55,810 --> 00:51:59,530 Merk op dat de HTML-tag, die ik willekeurig heb afgebeeld als een rechthoek, 880 00:51:59,530 --> 00:52:02,890 heeft 2 kinderen: hoofd en lichaam. 881 00:52:02,890 --> 00:52:04,840 >> Die worden op dezelfde wijze getekend als rechthoeken. 882 00:52:04,840 --> 00:52:08,970 Het is zinvol picturaal dat hoofd naar links van het lichaam. 883 00:52:08,970 --> 00:52:11,960 De implicatie is dat het hoofd eerst komt in de boom. 884 00:52:11,960 --> 00:52:14,910 Dus er is eigenlijk een bestelling tot een boom als je tekenen als dit, 885 00:52:14,910 --> 00:52:17,460 hoewel de vormen en wat al niet zijn willekeurig. 886 00:52:17,460 --> 00:52:20,360 Hoofd heeft inmiddels een kind genaamd titel, 887 00:52:20,360 --> 00:52:25,170 en de titel heeft eigenlijk zijn eigen kind, dat is "hello, world", 888 00:52:25,170 --> 00:52:32,210 die ik met opzet trok als een ovaal hier om het enigszins afwijken van de rechthoek. 889 00:52:32,210 --> 00:52:37,420 Deze vakken zijn elementen, terwijl hello, world is echt een tekst node. 890 00:52:37,420 --> 00:52:39,850 Dus het is een knooppunt in de boom, maar het is een ander soort knooppunt 891 00:52:39,850 --> 00:52:41,730 dus ik trok het willekeurig anders. 892 00:52:41,730 --> 00:52:45,000 Ook heeft het lichaam een ​​kind genaamd hello, wereld ook, 893 00:52:45,000 --> 00:52:47,910 zo verschillend knooppunt hoewel ze toevallig zijn dezelfde tekst, 894 00:52:47,910 --> 00:52:52,100 maar ik heb getekend met behulp van dezelfde vorm. Dus who cares? 895 00:52:52,100 --> 00:52:56,820 Nou, wat is er leuk over HTML is dat het hoeft deze hiërarchische aard. 896 00:52:56,820 --> 00:53:01,010 En wat leuk over JavaScript en met name de bibliotheken die vrij beschikbaar 897 00:53:01,010 --> 00:53:07,120 en populaire zoals jQuery, kunt u navigeren door de boomstructuur zo verbazingwekkend eenvoudig. 898 00:53:07,120 --> 00:53:11,790 Elk van de dingen die we in C deden met pointers en doorlopen van bomen en recursing op knooppunten 899 00:53:11,790 --> 00:53:15,300 linker kind naar rechts kind, opeens kunnen we sorteren van voor lief nemen 900 00:53:15,300 --> 00:53:19,450 als zijnde verbazingwekkend verhelderend, zo niet een beetje frustrerend 901 00:53:19,450 --> 00:53:22,470 maar lang niet op een efficiënte manier om te gaan over het programmeren. 902 00:53:22,470 --> 00:53:24,470 En dus met deze hogere programmeertalen zoals JavaScript 903 00:53:24,470 --> 00:53:28,340 zullen we in staat zijn om deze boom navigeren nog veel meer intuïtief. 904 00:53:28,340 --> 00:53:30,430 >> En inderdaad de syntaxis gaat worden heel vertrouwd. 905 00:53:30,430 --> 00:53:32,950 Als je nog nooit hebt gezien JavaScript eerder, dit is echt een mooie referentie 906 00:53:32,950 --> 00:53:35,910 van de Mozilla mensen, de mensen die Firefox, 907 00:53:35,910 --> 00:53:38,370 dus voel je vrij om dat te bladeren op uw gemak. 908 00:53:38,370 --> 00:53:41,590 Wat vindt u - en deze dia's zijn identiek aan wat we vroeger de andere dag - 909 00:53:41,590 --> 00:53:44,030 Op dezelfde wijze wordt de belangrijkste weg. 910 00:53:44,030 --> 00:53:47,010 Dus als u een programma in JavaScript te schrijven, is er geen hoofdfunctie. 911 00:53:47,010 --> 00:53:48,690 Je gewoon beginnen schrijven van code. 912 00:53:48,690 --> 00:53:51,660 Maar een belangrijk onderscheid tussen JavaScript en C en PHP 913 00:53:51,660 --> 00:53:55,890 is dat terwijl C en PHP tot nu toe zijn uitgevoerd server-side 914 00:53:55,890 --> 00:53:59,180 door het apparaat in dit geval of meer algemeen door een server, 915 00:53:59,180 --> 00:54:04,270 Javascript via ontwerp wordt meestal uitgevoerd door een browser. 916 00:54:04,270 --> 00:54:08,440 Met andere woorden, kunt u schrijven JavaScript-code, zoals we gaan, 917 00:54:08,440 --> 00:54:13,080 op een server in het apparaat, maar u opnemen onder uw HTML, onder uw CSS, 918 00:54:13,080 --> 00:54:16,100 onder uw GIF's en uw PNG's en uw JPEG-afbeeldingen 919 00:54:16,100 --> 00:54:19,170 zodat wanneer de gebruiker uw webpagina bezoekt, als je JavaScript gebruikt, 920 00:54:19,170 --> 00:54:21,770 dat JavaScript code komt van de server naar de browser, 921 00:54:21,770 --> 00:54:24,540 en het is de browser die daadwerkelijk uitvoert. 922 00:54:24,540 --> 00:54:27,960 Dit heeft dus betekenisvolle gevolgen voor zelfs intellectuele eigendom. 923 00:54:27,960 --> 00:54:32,600 Het is een beetje dom om te denken aan het beschermen van uw IP als het gaat om JavaScript-code 924 00:54:32,600 --> 00:54:37,560 omdat door de aard van de taal het wordt gewoonlijk uitgevoerd browser kant. 925 00:54:37,560 --> 00:54:40,360 >> U kunt verduisteren het, wat betekent dat je kunt maken het er gek en lelijk 926 00:54:40,360 --> 00:54:45,400 zonder witruimte, vreselijke namen van variabelen, zodat het moeilijker voor mensen om uw IP te stelen, 927 00:54:45,400 --> 00:54:48,120 maar de belangrijkste is dat het browser zijde uitgevoerd. 928 00:54:48,120 --> 00:54:51,790 Ook al als een terzijde JavaScript gebruikt kan worden server-side, 929 00:54:51,790 --> 00:54:54,480 de meest voorkomende use case op dit moment nog op de browser. 930 00:54:54,480 --> 00:54:59,800 En hier is hoe het eruit ziet. Hier is een if-else-if-else constructie, net als C, net als PHP. 931 00:54:59,800 --> 00:55:02,420 Hier is een Booleaanse expressie wanneer u "of" 2 dingen samen. 932 00:55:02,420 --> 00:55:04,330 Hier is wanneer je "en" 2 dingen samen. 933 00:55:04,330 --> 00:55:08,300 Hier is een switch, die vergelijkbaar is met PHP 934 00:55:08,300 --> 00:55:10,810 in dat je kunt schakelen op verschillende soorten waarden. 935 00:55:10,810 --> 00:55:15,180 Loops eveneens hebben voor lussen hier, die identiek zijn gestructureerd aan wat we al eerder gezien. 936 00:55:15,180 --> 00:55:18,110 Terwijl loops, we nog hebt doen terwijl loops. 937 00:55:18,110 --> 00:55:20,290 Variabelen, ooit zo iets anders. 938 00:55:20,290 --> 00:55:24,560 Je hoeft variabelen op zoals je in PHP en C, 939 00:55:24,560 --> 00:55:27,860 maar eveneens is JavaScript zwak getypt. 940 00:55:27,860 --> 00:55:32,730 Je hoeft niet te specificeren int of float of string of iets dergelijks meestal. 941 00:55:32,730 --> 00:55:34,240 U kunt opgeven var. 942 00:55:34,240 --> 00:55:38,040 Je hoeft niet te var opgeven, maar het heeft gevolgen als je dat niet doet. 943 00:55:38,040 --> 00:55:42,000 Meestal als je weglaten var, u per ongeluk een globale variabele in plaats van lokaal. 944 00:55:42,000 --> 00:55:46,420 Dus laat me voorstellen dat je gewoon bijna altijd var zeggen en dan de naam van de variabele. 945 00:55:46,420 --> 00:55:48,740 Het is niet een soort, het is gewoon var voor variabele. 946 00:55:48,740 --> 00:55:52,930 Dit zou een voorbeeld zijn, of het nu 123 of "hello, world". 947 00:55:52,930 --> 00:55:58,910 Arrays zijn aanwezig en syntactisch vergelijkbaar met PHP. 948 00:55:58,910 --> 00:56:03,690 Ik zeg var getallen en dan moet ik weer vierkante haken gebruiken om een ​​variabele te declareren 949 00:56:03,690 --> 00:56:08,870 waarvan het type matrix dat deze specifieke getallen in het gescheiden door komma heeft. 950 00:56:08,870 --> 00:56:11,740 En tenslotte is de enige die echt er anders uit. 951 00:56:11,740 --> 00:56:16,700 Bedenk dat in PHP we een associatieve array hebben geïmplementeerd voor een student 952 00:56:16,700 --> 00:56:20,220 zoals Zamyla dat kan er zo uitzien, waar de variabele wordt genoemd student. 953 00:56:20,220 --> 00:56:23,370 De vierkante haken betekenen hier komt een array. 954 00:56:23,370 --> 00:56:28,500 >> Het feit dat ik niet numerieke indices maar snaren met behulp van - id, huis, en naam - 955 00:56:28,500 --> 00:56:30,990 betekent dat dit een associatieve array, 956 00:56:30,990 --> 00:56:34,490 en deze pijlen met de gelijk-teken en de schuine beugel 957 00:56:34,490 --> 00:56:37,310 betekent dat de sleutel "id", de waarde 1; 958 00:56:37,310 --> 00:56:39,310 de sleutel is "huis", is de waarde Winthrop House; 959 00:56:39,310 --> 00:56:41,800 de sleutel is "naam", de waarde is Zamyla Chan. 960 00:56:41,800 --> 00:56:47,110 Zodat er 3 sleutels binnenkant van deze associatieve array, die elk zijn eigen waarde. 961 00:56:47,110 --> 00:56:52,880 We hebben gezien dat in PSET 7, of je al snel zal in JavaScript hetzelfde idee, 962 00:56:52,880 --> 00:56:55,220 maar het gaat er als volgt uitzien. 963 00:56:55,220 --> 00:57:00,070 Dus var student - geen dollarteken en geen melding van het type nog steeds, maar var - 964 00:57:00,070 --> 00:57:05,860 is gelijk aan en open vervolgens accolades omdat in JavaScript als je sleutel waarde paren, 965 00:57:05,860 --> 00:57:08,900 u daadwerkelijk gebruik maken van zoiets als een object. 966 00:57:08,900 --> 00:57:13,490 En degenen onder u die rekening heeft APCS of iets dergelijks zou kunnen herinneren voorwerpen uit Java 967 00:57:13,490 --> 00:57:15,140 of soortgelijke talen. 968 00:57:15,140 --> 00:57:17,880 JavaScript is niet Java, in de eerste plaats. 969 00:57:17,880 --> 00:57:21,600 Het was een bewuste ontwerpbeslissing jaar geleden naar knock off iets anders dat populair was, 970 00:57:21,600 --> 00:57:25,640 zijn naam, ook al is het geen fundamentele relatie tot zichzelf Java heeft. 971 00:57:25,640 --> 00:57:31,490 JavaScript heeft objecten en u deze maken door middel van de accolade-notatie. 972 00:57:31,490 --> 00:57:36,710 Objecten in JavaScript zijn vrij veel overeen met associatieve arrays in PHP 973 00:57:36,710 --> 00:57:40,030 als het gaat om het opslaan van gegevens in hen. 974 00:57:40,030 --> 00:57:44,100 >> Maar nog krachtiger in JavaScript kan je associeert heel gemakkelijk functies 975 00:57:44,100 --> 00:57:48,040 binnenkant van een object, en hoewel u kunt dit doen in andere talen, 976 00:57:48,040 --> 00:57:50,040 het is nogal een gemeenschappelijk paradigma, zoals we zullen zien. 977 00:57:50,040 --> 00:57:54,380 Kortom, dit object vertegenwoordigt een student, die is bijzonder Zamyla, 978 00:57:54,380 --> 00:58:00,380 en het is vergelijkbaar conceptueel, maar syntactisch anders dan dit. 979 00:58:00,380 --> 00:58:03,840 Laten we eigenlijk JavaScript te gebruiken in een bestand. 980 00:58:03,840 --> 00:58:05,570 Het blijkt dat er een script-tag. 981 00:58:05,570 --> 00:58:08,180 We hebben gezien een stijl tag en we hebben gezien andere HTML-tags. 982 00:58:08,180 --> 00:58:11,510 Het script tag ook daadwerkelijk wat JavaScript code bevatten. 983 00:58:11,510 --> 00:58:15,500 Laat me gaan in het apparaat, waar we een aantal broncode pre-gemaakt. 984 00:58:15,500 --> 00:58:18,700 Ik heb nog niet gepost nog niet op de website, maar ik zal dat doen na de les. 985 00:58:18,700 --> 00:58:21,770 Laten we open deze, blink.html. 986 00:58:21,770 --> 00:58:27,560 Terug in de jaren 1990, was er letterlijk een HTML-tag genoemd de blink-tag, 987 00:58:27,560 --> 00:58:30,340 en dit was een van de meest heerlijk overused tags op het internet 988 00:58:30,340 --> 00:58:36,140 waarbij je zou een bezoek brengen aan jaren 1990 stijl webpagina en beginnen met het zien tekst knipperen je van deze, 989 00:58:36,140 --> 00:58:39,810 de resultaten van de markies tag, had die tekst gaat als volgt. 990 00:58:39,810 --> 00:58:45,070 Een van de weinige momenten waarop de wereld daadwerkelijk heeft overeenstemming bereikt over een web-standaard, 991 00:58:45,070 --> 00:58:48,250 iedereen over de hele linie doodde de blink-tag een aantal jaren geleden. 992 00:58:48,250 --> 00:58:52,860 Maar we kunnen leven in te blazen met JavaScript als een demonstratie van de kracht die je hebt 993 00:58:52,860 --> 00:58:56,660 als je een programma schrijven binnen van een webpagina. 994 00:58:56,660 --> 00:59:00,240 Laten we eerst overslaan van de nieuwe dingen en richten zich alleen op de oude. 995 00:59:00,240 --> 00:59:01,780 >> Hier is het oude spul in dit voorbeeld. 996 00:59:01,780 --> 00:59:06,350 Ik heb een HTML-tag, een hoofd-tag, en een titel tag. 997 00:59:06,350 --> 00:59:11,210 Daarna heb ik een body-tag hebben hier met een div, die recall is gewoon een rechthoekige indeling van de pagina 998 00:59:11,210 --> 00:59:14,720 die ik heb gegeven een unieke ID willekeurig van "begroeting" op, 999 00:59:14,720 --> 00:59:18,320 zodat ik een manier uniek te verwijzen naar het hebben, dat heeft een aantal zeer eenvoudige tekst: 1000 00:59:18,320 --> 00:59:20,220 hello, wereld. 1001 00:59:20,220 --> 00:59:23,940 Laat me nu omhoog te scrollen naar de top van dit bestand en zien wat er nieuw is. 1002 00:59:23,940 --> 00:59:27,710 Het eerste ding dat is nieuw-up top is de script-tag, 1003 00:59:27,710 --> 00:59:31,280 en de binnenkant van het script tag aankondiging die ik heb verklaard een functie. 1004 00:59:31,280 --> 00:59:34,610 Om een ​​functie in JavaScript, redelijk vergelijkbaar met PHP te verklaren, 1005 00:59:34,610 --> 00:59:37,930 je letterlijk schrijft functie dan is de naam van de functie, haakjes, 1006 00:59:37,930 --> 00:59:40,400 en misschien wat argumenten als het duurt enige. 1007 00:59:40,400 --> 00:59:43,510 Dan heb ik mijn accolade zoals gewoonlijk, en nu hebben we een aantal enigszins nieuwe code, 1008 00:59:43,510 --> 00:59:45,230 maar laten we eens kijken wat dit betekent. 1009 00:59:45,230 --> 00:59:48,670 Dus var div, betekent dit dat geef me een variabele genaamd div. 1010 00:59:48,670 --> 00:59:50,530 Ik had noemde het foo, maar ik wilde dat het genoemd worden div 1011 00:59:50,530 --> 00:59:52,620 om redenen die duidelijk zijn in een tweede. 1012 00:59:52,620 --> 00:59:57,480 Dan blijkt in JavaScript - en dit is JavaScript code die is ingesloten in mijn web pagina - 1013 00:59:57,480 --> 01:00:01,760 is er een speciale globale variabele van soorten genoemd document. 1014 01:00:01,760 --> 01:00:04,780 JavaScript is in feite een object-georiënteerde taal. 1015 01:00:04,780 --> 01:00:07,230 We zullen niet in detail treden in 50 over wat dat betekent, 1016 01:00:07,230 --> 01:00:11,180 maar weet voor nu dat een object is vrij veel als een struct. 1017 01:00:11,180 --> 01:00:14,740 Zoals we zagen de weg terug toen in een van de vroegste probleem stelt 1018 01:00:14,740 --> 01:00:17,150 waar we veel informatie in een struct, 1019 01:00:17,150 --> 01:00:21,330 op gelijke wijze wordt gedocumenteerd een speciale struct die wordt geleverd met de browser, 1020 01:00:21,330 --> 01:00:24,810 wordt geleverd met een webpagina. Het is niet iets wat ik gemaakt. 1021 01:00:24,810 --> 01:00:28,210 Binnenkant van dit document structuur, hoewel, je hebt niet alleen gegevens 1022 01:00:28,210 --> 01:00:30,010 maar je hebt ook functies. 1023 01:00:30,010 --> 01:00:34,090 >> En elke keer dat je een functie binnen een structuur, binnenkant van een object, 1024 01:00:34,090 --> 01:00:36,490 het heet een methode. Maar het is hetzelfde. 1025 01:00:36,490 --> 01:00:40,110 Een methode is een functie die gewoon zo gebeurt te zijn binnenkant van iets anders. 1026 01:00:40,110 --> 01:00:42,990 Dit betekent dus dat deze speciale globale variabele document met de naam 1027 01:00:42,990 --> 01:00:47,690 heeft een functie genaamd getElementById dat letterlijk doet. 1028 01:00:47,690 --> 01:00:52,460 Het zal je een element uit de DOM, Document Object Model boom, 1029 01:00:52,460 --> 01:00:55,520 waarvan de ID is in dit geval begroeting. 1030 01:00:55,520 --> 01:00:59,200 Met andere woorden, al die tijd hebben we besteed aan datastructuren in het spel komt hier. 1031 01:00:59,200 --> 01:01:01,400 Deze foto van een DOM-dat we een moment geleden, 1032 01:01:01,400 --> 01:01:06,100 ook al is de pagina is een beetje anders, als ik een div op deze foto, 1033 01:01:06,100 --> 01:01:11,180 wat document.getElementById zouden terugkeren om me daadwerkelijk zal een pointer 1034 01:01:11,180 --> 01:01:15,440 aan de rechthoek in de boom, een verwijzing naar de rechthoek in de boom. 1035 01:01:15,440 --> 01:01:18,410 Dus dat is wat het betekent om daadwerkelijk op te roepen een van die functies. 1036 01:01:18,410 --> 01:01:21,960 Ook in dit geval is het een div. Het is niet een lichaam of een titel. 1037 01:01:21,960 --> 01:01:26,480 Dus laten we eens kijken wat ik dan doen met deze div nu dat ik het binnen heb van deze variabele genaamd div. 1038 01:01:26,480 --> 01:01:32,580 Het blijkt met JavaScript heeft u de mogelijkheid om de CSS van uw pagina dynamisch te veranderen. 1039 01:01:32,580 --> 01:01:39,060 Tot nu toe, alle van de CSS die we hebben, gedaan zij het beperkte, is in stijlkenmerken, 1040 01:01:39,060 --> 01:01:41,730 of waar anders hebben we CSS? 1041 01:01:42,730 --> 01:01:45,810 Ik soort van verwend die ene. In de stijl label aan het begin van het bestand. 1042 01:01:45,810 --> 01:01:49,180 Of derde plaats is in? 1043 01:01:50,710 --> 01:01:54,590 >> Een extern bestand, iets. Css. 1044 01:01:54,590 --> 01:01:56,730 Dus dat zijn de 3 plaatsen waar we CSS tot nu toe gedaan, 1045 01:01:56,730 --> 01:01:59,310 maar de vangst is dat we moeilijk het allemaal gecodeerd. 1046 01:01:59,310 --> 01:02:04,060 U beslist als je dook PSET 7, hebben we besloten voordat de les wat onze CSS zou zijn. 1047 01:02:04,060 --> 01:02:07,380 Maar als u wilt uw CSS te veranderen, kun je eigenlijk doen 1048 01:02:07,380 --> 01:02:09,370 als je eenmaal een echte programmeertaal. 1049 01:02:09,370 --> 01:02:13,910 CSS, HTML - niet programmeertalen. JavaScript is. 1050 01:02:13,910 --> 01:02:18,200 Dus het blijkt dat zodra je een van die rechthoeken hebben van de boom 1051 01:02:18,200 --> 01:02:23,050 genaamd de DOM, heeft zelf een aantal gegevens binnen van het. 1052 01:02:23,050 --> 01:02:27,820 Dus de div die ik net pakte uit de boom heeft wat we noemen een woning binnen van het 1053 01:02:27,820 --> 01:02:34,390 riep stijl en de stijl woning heeft zichzelf een eigenschap genaamd zichtbaarheid. 1054 01:02:34,390 --> 01:02:37,330 Ik zou weten dit alleen door het opzoeken van een CSS handleiding. 1055 01:02:37,330 --> 01:02:41,160 Het blijkt dat er een zicht CSS-eigenschap die doet wat het zegt. 1056 01:02:41,160 --> 01:02:44,530 Het maakt iets zichtbaar of niet, zichtbaar of niet. 1057 01:02:44,530 --> 01:02:46,810 En hoe je dat doet is het volgende. 1058 01:02:46,810 --> 01:02:50,510 Ik programmatisch vraag of de zichtbaarheid van deze div is verborgen, 1059 01:02:50,510 --> 01:02:53,390 wat moet ik veranderen in? Zichtbaar. 1060 01:02:53,390 --> 01:02:58,840 Else if de zichtbaarheid van deze pagina is niet verborgen, logisch ik maken het verborgen. 1061 01:02:58,840 --> 01:03:04,070 Ik heb geen idee waarom het zichtbare en verborgen en niet zichtbare en onzichtbare. 1062 01:03:04,070 --> 01:03:06,000 Dit was een slecht ontwerp besluit langs de weg. 1063 01:03:06,000 --> 01:03:09,530 Maar die zijn inderdaad tegenstellingen in CSS: zichtbare en verborgen. 1064 01:03:09,530 --> 01:03:15,520 Dit zorgt er alleen betekent wijzigt u de CSS van mijn dossier aan en uit, aan en uit 1065 01:03:15,520 --> 01:03:16,870 voor die div. 1066 01:03:16,870 --> 01:03:20,630 Maar nogmaals, dit is een functie genaamd knipperen. Wanneer is het knipperen functie genaamd? 1067 01:03:20,630 --> 01:03:24,080 Het blijkt dat er nog een speciale globale variabele genaamd venster, 1068 01:03:24,080 --> 01:03:28,220 in dezelfde geest te documenteren, maar dat dit document verwijst naar uw webpagina, 1069 01:03:28,220 --> 01:03:31,700 zoals de DOM-structuur, de HTML-u verzonden vanaf de server, 1070 01:03:31,700 --> 01:03:35,250 venster verwijst naar de chromen omheen, de adresbalk, de titelbalk, 1071 01:03:35,250 --> 01:03:37,880 en al dat spul rond uw webpagina. 1072 01:03:37,880 --> 01:03:42,800 >> En het blijkt dat het window-object een speciale functie binnen van het genoemd setInterval heeft 1073 01:03:42,800 --> 01:03:44,360 dat doet wat het zegt. 1074 01:03:44,360 --> 01:03:48,600 Zij zal een interval - in dit geval om de 500 milliseconden - 1075 01:03:48,600 --> 01:03:52,270 en, neem een ​​gok, wat gaat het om om de 500 milliseconden doen? 1076 01:03:52,270 --> 01:03:55,240 Het gaat om die functie uit te voeren knipperen. 1077 01:03:55,240 --> 01:03:58,560 En wat is leuk hier is dat we dit hebben gedaan in C ook al hebben we nooit gedaan. 1078 01:03:58,560 --> 01:04:01,580 C heeft wel iets te noemen functie pointers, waar u kunt functies pas rond 1079 01:04:01,580 --> 01:04:03,140 als argumenten. 1080 01:04:03,140 --> 01:04:07,620 Ook in JavaScript kan je langs de naam van een functie in een andere functie. 1081 01:04:07,620 --> 01:04:10,630 En let op wat ik doe. Ik doe dit niet. 1082 01:04:10,630 --> 01:04:14,380 Als ik tussen haakjes achter het knipperen, dan zou dat betekenen noemen het knipperen functie. 1083 01:04:14,380 --> 01:04:17,430 Als ik weglaten, dat betekent hier is het knipperen functie 1084 01:04:17,430 --> 01:04:21,330 zodat setInterval kunnen noemen om de 500 milliseconden. 1085 01:04:21,330 --> 01:04:28,200 Dus het eindresultaat, afschuwelijk het ook is, is dat als ik naar localhost en ga naar blink.html, 1086 01:04:28,200 --> 01:04:32,120 Ik heb nu dit gebeurt opnieuw en opnieuw. 1087 01:04:32,120 --> 01:04:34,950 En als ik eigenlijk Element inspecteren, laten we eens kijken of we kunnen dit zien. 1088 01:04:34,950 --> 01:04:38,550 Laat me Inspecteer element, laat me naar beneden scrollen een klein beetje, 1089 01:04:38,550 --> 01:04:44,320 ik bepaal Elements hier, en let op de DOM binnenkant van inspecteur Chrome. 1090 01:04:44,320 --> 01:04:48,840 Het is letterlijk het veranderen van heen en weer om de 500 milliseconden. 1091 01:04:48,840 --> 01:04:55,660 Als we naar onze vriend Nate, 1092 01:04:55,660 --> 01:05:00,020 Als je je ooit afgevraagd hoe dit werkt, vergelijkbaar idee met een interval, 1093 01:05:00,020 --> 01:05:04,810 maar Nate is eigenlijk het maken van een zeer effectief gebruik van kleur in dit specifieke geval. 1094 01:05:04,810 --> 01:05:07,350 Dus wat kunnen we nog meer eigenlijk doen met dit? 1095 01:05:07,350 --> 01:05:09,990 Laten we openen een ander voorbeeld en probeer iets 1096 01:05:09,990 --> 01:05:12,940 dat is programmatisch nog nuttiger dan het maken van dingen knipperen. 1097 01:05:12,940 --> 01:05:17,990 Laat me gaan in onze formulieren directory vandaag en gaan in form0. 1098 01:05:17,990 --> 01:05:20,820 Dit was de lelijkste mogelijke vorm die ik kon bedenken, 1099 01:05:20,820 --> 01:05:23,290 en laat me gewoon je te laten zien hoe het eruit ziet in een browser. 1100 01:05:23,290 --> 01:05:28,960 >> Laat me gaan in localhost / vormen, en dit is form0. 1101 01:05:28,960 --> 01:05:33,400 Dit is een super lelijke HTML-formulier dat een paar velden voor e-mail heeft, voor een password, 1102 01:05:33,400 --> 01:05:37,190 wachtwoord en dan een beetje selectievakje in te stemmen met een aantal voorwaarden. 1103 01:05:37,190 --> 01:05:41,350 De vangst is als ik naar dit formulier in en ik wil niet dat u mijn e-mail adres, 1104 01:05:41,350 --> 01:05:44,730 Ik wil niet misschien ga akkoord met de algemene voorwaarden, kan ik klik Registreer 1105 01:05:44,730 --> 01:05:46,920 en het laat me door hoe dan ook. 1106 01:05:46,920 --> 01:05:50,800 Dit gebeurt te onderwerpen aan een domme PHP bestand met de naam dump.php. 1107 01:05:50,800 --> 01:05:58,420 Alles wat het doet is het afdrukken van de inhoud van de $ _GET alleen voor diagnostische doeleinden. 1108 01:05:58,420 --> 01:06:01,580 Dat was wat werd ingediend door de gebruiker op dit moment. 1109 01:06:01,580 --> 01:06:05,010 Maar stel dat we eigenlijk willen de gebruiker het indienen van formulieren te valideren. 1110 01:06:05,010 --> 01:06:06,530 Laat me gaan in versie 1. 1111 01:06:06,530 --> 01:06:11,420 Dit is form1.html. Het ziet er esthetisch net zo slecht, maar merken hoe luxe het is. 1112 01:06:11,420 --> 01:06:15,450 Als ik klik op Registreer zonder samenwerking, word ik uitgescholden. 1113 01:06:15,450 --> 01:06:17,320 "U moet uw e-mailadres." 1114 01:06:17,320 --> 01:06:21,670 Oke. Dus laat me proberen. Dus malan@harvard.edu. Ik heb geen behoefte aan een wachtwoord. 1115 01:06:21,670 --> 01:06:25,100 Registreren. "Je moet een wachtwoord." Oke. 1116 01:06:25,100 --> 01:06:28,470 Dus ik zal een wachtwoord van karmozijnrood. Registreren. 1117 01:06:28,470 --> 01:06:32,300 "Wachtwoorden komen niet overeen." Ik moet nu typen in karmozijnrood hier. 1118 01:06:32,300 --> 01:06:35,710 Ik heb per ongeluk gecontroleerd dat. Registreren. 1119 01:06:35,710 --> 01:06:39,860 "Je moet akkoord gaan met de voorwaarden." Oke. Mee eens daar. Registreren. 1120 01:06:39,860 --> 01:06:43,700 En nu toont me de diagnostische uitvoer daar. 1121 01:06:43,700 --> 01:06:45,630 >> Dus wat is er gebeurd? 1122 01:06:45,630 --> 01:06:48,330 We hebben dit vermogen om formulierverzendingen valideren. 1123 01:06:48,330 --> 01:06:51,420 In feite, als je dat deed duik in PSET 7, er is een excuses functie 1124 01:06:51,420 --> 01:06:54,620 dat maakt het vrij makkelijk om schreeuwen tegen de gebruiker met een bericht op het scherm. 1125 01:06:54,620 --> 01:06:57,580 Ik ben met behulp van een iets ander mechanisme, de alert functie, 1126 01:06:57,580 --> 01:07:03,690 dat is niet een functie die is glimlachte op, omdat het maakt erg lelijk gebruiker berichten. 1127 01:07:03,690 --> 01:07:05,710 Maar laten we eens kijken wat ik hier doe. 1128 01:07:05,710 --> 01:07:09,620 Dit is form1.html, en merk dat ik een aantal mooie bekende syntax hebben: 1129 01:07:09,620 --> 01:07:12,920 body-tag, form-tag, action attribuut, methode attribuut. 1130 01:07:12,920 --> 01:07:17,050 Maar let op ik heb gezien mijn vorm een ​​unieke ID voor het gemak. 1131 01:07:17,050 --> 01:07:19,190 Dan heb ik een e-mail veld waarvan het type is tekst, 1132 01:07:19,190 --> 01:07:23,780 een wachtwoord veld waarvan het type is met een wachtwoord, bevestiging veld waarvan het type is met een wachtwoord, 1133 01:07:23,780 --> 01:07:28,070 en vervolgens een vakje waarvan de naam is akkoord hier, type checkbox. 1134 01:07:28,070 --> 01:07:30,380 En dan heb ik een submit knop. 1135 01:07:30,380 --> 01:07:33,050 Maar let op de top wat ik nog meer heb. 1136 01:07:33,050 --> 01:07:35,810 In de eerste plaats is er een ander gebruik van het script tag. 1137 01:07:35,810 --> 01:07:40,520 Als u een aantal JavaScript-code in een ander bestand, net als met CSS kun je opnemen. 1138 01:07:40,520 --> 01:07:44,530 En dat doe je met een script de bron, en dan merk ik blijkbaar het aansluiten van 1139 01:07:44,530 --> 01:07:50,349 om googleapis.com om een ​​zeer lange weg, maar waarvan de bestandsnaam eindigt in jquery.min 1140 01:07:50,349 --> 01:07:52,420 voor minimum. js. 1141 01:07:52,420 --> 01:07:55,969 jQuery is een super populaire bibliotheek voor JavaScript dat maakt JavaScript 1142 01:07:55,969 --> 01:07:58,230 des te meer gebruiksvriendelijke te gebruiken. 1143 01:07:58,230 --> 01:08:00,610 Het is effectief een de facto standaard. 1144 01:08:00,610 --> 01:08:04,090 Dus ook al wat je gaat zien is niet zuiver JavaScript op zich, 1145 01:08:04,090 --> 01:08:09,340 Het is een bibliotheek op de top van JavaScript net als de CS50 bibliotheek is een laag 1146 01:08:09,340 --> 01:08:13,670 op de top van low-level C-code, de realiteit is bijna iedereen op het internet het gebruikt. 1147 01:08:13,670 --> 01:08:18,030 Dus dit zijn geen zijwieltjes. Dit is gewoon de beste oefenen deze dagen. 1148 01:08:18,030 --> 01:08:22,830 Nu hieronder zien dat is mijn eigen script-tag, en let op wat ik hier heb gedaan. 1149 01:08:22,830 --> 01:08:27,450 Het blijkt dat jQuery doet iets speciaals. 1150 01:08:27,450 --> 01:08:29,660 JavaScript heeft dollartekens, maar ze zijn zinloos. 1151 01:08:29,660 --> 01:08:32,870 >> Zij zijn als de letter A of B of C. 1152 01:08:32,870 --> 01:08:36,670 jQuery is gewoon aangenomen conventie of soort van aanspraak op het feit 1153 01:08:36,670 --> 01:08:40,280 dat $ zullen hun speciale symbool. 1154 01:08:40,280 --> 01:08:44,950 Dus zodra het laden van deze wereldwijde JavaScript-bestand hier met de script-tag, 1155 01:08:44,950 --> 01:08:49,080 heeft u toegang tot een speciale globale variabele die heet $. 1156 01:08:49,080 --> 01:08:53,009 Het is meer behoorlijk heet jQuery, maar dat ziet er niet bijna net zo sexy als $. 1157 01:08:53,009 --> 01:08:56,250 Maar $ heeft geen speciale betekenis. In PHP had een speciale betekenis. 1158 01:08:56,250 --> 01:08:58,440 Je moest het hebben in de voorkant van een variabele. 1159 01:08:58,440 --> 01:09:01,670 Dit is gewoon een sexy ding dat ze nam. 1160 01:09:01,670 --> 01:09:03,389 Wat is hier aan de hand? 1161 01:09:03,389 --> 01:09:08,830 Merk op dat ik ben langs de jQuery functie mijn globale variabele document 1162 01:09:08,830 --> 01:09:10,860 en dan ga ik bellen. klaar. 1163 01:09:10,860 --> 01:09:15,480 Wat jQuery in wezen doet is het u toestaat om te nemen wat vanille JavaScript dingen 1164 01:09:15,480 --> 01:09:17,889 als het document object, het window-object, 1165 01:09:17,889 --> 01:09:20,790 en als je doorgeven in de jQuery functie - 1166 01:09:20,790 --> 01:09:24,429 en weer, om duidelijk te zijn, dit is een functie genaamd jQuery - 1167 01:09:24,429 --> 01:09:28,240 wat het doet is het weer bij u een speciale versie van het document 1168 01:09:28,240 --> 01:09:30,700 dat meer functionaliteit gekoppeld. 1169 01:09:30,700 --> 01:09:34,760 Dus in ruwe JavaScript is er geen klaar-functie, 1170 01:09:34,760 --> 01:09:37,810 maar als je langs document naar de jQuery functie eerst, 1171 01:09:37,810 --> 01:09:40,960 Het weer bij u een speciale versie van het document object 1172 01:09:40,960 --> 01:09:43,030 dat heeft meer fancy features. 1173 01:09:43,030 --> 01:09:48,230 En dat is waarom mensen het leuk vinden. Het maakt gewoon dingen makkelijker te doen, want we staan ​​op het punt om te zien. 1174 01:09:48,230 --> 01:09:49,820 Dus wat doet deze regel code bedoel je? 1175 01:09:49,820 --> 01:09:52,690 Deze regel code betekent hier wanneer het document klaar is - 1176 01:09:52,690 --> 01:09:56,830 Met andere woorden, zodra de browser wordt uitgevoerd lezen van dit bestand boven naar beneden - 1177 01:09:56,830 --> 01:09:59,200 ga je gang en voer de volgende functie. 1178 01:09:59,200 --> 01:10:03,540 Wat is echt interessant in JavaScript - en PHP heeft dit ook - 1179 01:10:03,540 --> 01:10:05,450 is anoniem functies. 1180 01:10:05,450 --> 01:10:10,560 In javascript kunt u verklaren functies die geen naam hebben, maar ze hebben wel een lichaam. 1181 01:10:10,560 --> 01:10:12,570 Let op wat hier gebeurt. 1182 01:10:12,570 --> 01:10:16,220 >> Dit is een functie genaamd klaar, en het betekent gewoon het volgende doen 1183 01:10:16,220 --> 01:10:20,220 wanneer de hele webpagina klaar is, als het allemaal is al lezen in van de server. 1184 01:10:20,220 --> 01:10:23,090 Wat wil je doen? Ik wil een stuk van code uit te voeren. 1185 01:10:23,090 --> 01:10:27,120 Merk op dat we niet willen deze code uit te voeren meteen. 1186 01:10:27,120 --> 01:10:34,350 Als ik weggelaten dit, zou dit onmiddellijk betekenen beginnen de uitvoering van deze regels code. 1187 01:10:34,350 --> 01:10:39,040 Maar het feit dat ik zeg nee, nee, nee, wikkel dit in een anonieme functie als deze 1188 01:10:39,040 --> 01:10:43,000 betekent nog niet uit te voeren is; uiteindelijk noemen. 1189 01:10:43,000 --> 01:10:45,430 We zagen dit een moment geleden in onze vorige vorm voorbeeld. 1190 01:10:45,430 --> 01:10:49,990 Welke functie hebben we uiteindelijk te bellen, 500 milliseconden later? Blink. 1191 01:10:49,990 --> 01:10:51,480 Dus hetzelfde idee. 1192 01:10:51,480 --> 01:10:53,950 Nogmaals, zelfs als dit ziet er een beetje raar, gewoon voor nu op het geloof 1193 01:10:53,950 --> 01:10:57,060 dat om een ​​anonieme functie die uiteindelijk heet verklaren, 1194 01:10:57,060 --> 01:11:01,720 je gewoon schrijft function () { 1195 01:11:01,720 --> 01:11:05,380 Dus wat code gaan we uiteindelijk uit te voeren? De volgende. 1196 01:11:05,380 --> 01:11:10,460 Dit ziet er ook een beetje nieuw, maar dit betekent hier is de jQuery functie, 1197 01:11:10,460 --> 01:11:13,430 en dit is nu een snelkoppeling. 1198 01:11:13,430 --> 01:11:18,830 Dit stukje HTML aan de onderkant van het scherm heeft natuurlijk een boom vertegenwoordiging. 1199 01:11:18,830 --> 01:11:21,730 Het is niet deze. Deze pagina is interessanter dan deze hello, world voorbeeld. 1200 01:11:21,730 --> 01:11:25,210 Maar er is een boom die overeenkomt met deze HTML. 1201 01:11:25,210 --> 01:11:28,910 Het zou een pijn in de nek te hebben om een ​​soort van recursieve functie te implementeren 1202 01:11:28,910 --> 01:11:34,380 om te beginnen bij de wortel knoop en zoek het knooppunt waarvan de ID is registratie. 1203 01:11:34,380 --> 01:11:38,340 Dus wat jQuery maakt super makkelijk voor ons is letterlijk dit. 1204 01:11:38,340 --> 01:11:43,000 Ga je gang en geef me alles wat div of welke vorm dan ook, wat dan ook HTML-element 1205 01:11:43,000 --> 01:11:45,820 heeft een ID van de registratie. 1206 01:11:45,820 --> 01:11:52,440 Dit komt overeen met document.getElementById ('registratie'). 1207 01:11:52,440 --> 01:11:54,170 >> Waarom doen mensen zoals jQuery? 1208 01:11:54,170 --> 01:12:00,110 Omdat het korter te typen. Maar dat is alles wat het is. Het is hetzelfde idee. 1209 01:12:00,110 --> 01:12:02,630 Geef me de tag waarvan het ID is registratie. 1210 01:12:02,630 --> 01:12:06,300 En als die tag, die toevallig ook een formulier, wordt ingediend, 1211 01:12:06,300 --> 01:12:08,300 ga je gang en voer deze code. 1212 01:12:08,300 --> 01:12:11,320 Dus laten we eens een nu kijken hoe we het doen formulier validatie. 1213 01:12:11,320 --> 01:12:15,950 De syntaxis is weliswaar cryptisch op het eerste, maar wat gebeurt er? 1214 01:12:15,950 --> 01:12:21,050 Als deze regel code waar is, ga ik schreeuwen tegen de gebruiker zijn of haar e-mailadres op te geven. 1215 01:12:21,050 --> 01:12:22,970 Dus wat is deze regel code? 1216 01:12:22,970 --> 01:12:25,560 $ Betekent jQuery. Nu merken. 1217 01:12:25,560 --> 01:12:27,920 Dit is een soort CSS. 1218 01:12:27,920 --> 01:12:33,370 Als je hebt gedoken in CSS nog, weet je dat dit het element waarvan de ID is registratie betekent. 1219 01:12:33,370 --> 01:12:39,840 De ruimte betekent vinden van een kind of een afstammeling van de registratie van wie de naam wordt ingevoerd. 1220 01:12:39,840 --> 01:12:42,970 En dan dit ding tussen vierkante haken is een beetje filter. 1221 01:12:42,970 --> 01:12:47,010 En zelfs als deze cryptische ziet, betekent dit dat ga je gewoon naar het formulier waarvan het ID is registratie, 1222 01:12:47,010 --> 01:12:51,230 ga naar het input element binnenkant van die waarvan de naam is e-mail, 1223 01:12:51,230 --> 01:12:55,440 en dan krijgt zijn waarde, ongeacht de waarde ervan ook mag zijn - 1224 01:12:55,440 --> 01:12:59,670 asdf als dat is alles wat ik getypt of malan@harvard.edu als dat is wat ik heb getypt. 1225 01:12:59,670 --> 01:13:05,250 Dus als de waarde van e-mail van het formulier veld == niets, schreeuwen tegen de gebruiker. 1226 01:13:05,250 --> 01:13:09,700 Anders als de waarde van het wachtwoord veld == niets, schreeuwen tegen de gebruiker. 1227 01:13:09,700 --> 01:13:19,520 >> Else if de waarde van het wachtwoordveld niet gelijk aan de waarde van de bevestigingsveld 1228 01:13:19,520 --> 01:13:22,850 dat was de andere vorm element, schreeuwen tegen de gebruiker. 1229 01:13:22,850 --> 01:13:25,680 En dan tot slot - en deze heeft ook een aantal nieuwe syntaxis van de eigen, 1230 01:13:25,680 --> 01:13:29,270 maar als je eenmaal hebt gezien, het is op zijn minst een beetje meer redelijk - 1231 01:13:29,270 --> 01:13:34,060 anders als het formulier waarvan het ID is registratie heeft een input element waarvan de naam is het erover eens 1232 01:13:34,060 --> 01:13:39,720 en het wordt gecontroleerd, ga je gang en schreeuwen tegen de gebruiker. 1233 01:13:39,720 --> 01:13:42,520 Dus ik ben het helemaal toegeven dat dit volledig overweldigend op het eerste gezicht. 1234 01:13:42,520 --> 01:13:46,530 Het is een stuk van de nieuwe syntax. Maar al jQuery volgt dit soort patronen. 1235 01:13:46,530 --> 01:13:49,880 En eerlijk gezegd, ik wist niet eens dat dit bestond tot een paar minuten geleden. 1236 01:13:49,880 --> 01:13:53,640 Ik googlede, "Hoe weet je controleren of een checkbox is aangevinkt in jQuery?" 1237 01:13:53,640 --> 01:13:55,680 en dit is de syntaxis, want er is op verschillende manieren om het te doen 1238 01:13:55,680 --> 01:13:58,010 met de werkelijke rauwe JavaScript-code. 1239 01:13:58,010 --> 01:14:01,030 Dus als de eerste pagina van het probleem Set 7 benadrukt, 1240 01:14:01,030 --> 01:14:04,500 PSET 7 is heel erg een oefening in bootstrapping jezelf 1241 01:14:04,500 --> 01:14:08,650 waar geven we, hopelijk, een conceptueel kader waarmee de PSET aan te pakken. 1242 01:14:08,650 --> 01:14:12,280 >> Maar zoals vaak het geval is met web design, het is aan jou echt rondneuzen, 1243 01:14:12,280 --> 01:14:16,680 nemen stukjes code en voorbeelden van het web zo lang als je daarnaar verwijzen 1244 01:14:16,680 --> 01:14:17,960 Volgens de voorwaarden op die eerste plaat, 1245 01:14:17,960 --> 01:14:21,460 en beseffen dat het leren van HTML, CSS, JavaScript en zelfs SQL 1246 01:14:21,460 --> 01:14:26,020 is echt bedoeld om dit thuis oefenen als we beginnen met deze opleiding wielen opstijgen zijn. 1247 01:14:26,020 --> 01:14:29,150 En beseffen ook dat er zo veel meer dingen die je kunt doen met een browser. 1248 01:14:29,150 --> 01:14:33,790 Binnenkant van de meeste van deze elementen zijn er andere dingen genoemd event handlers. 1249 01:14:33,790 --> 01:14:37,140 En hoewel we keek alleen maar naar degenen genoemd onsubmit en onready, 1250 01:14:37,140 --> 01:14:40,310 je kunt dingen doen als onkeydown, onkeyup, 1251 01:14:40,310 --> 01:14:43,410 zoals wanneer de gebruiker een toets aanraakt, kunt u luisteren naar dat en omhoog. 1252 01:14:43,410 --> 01:14:45,940 Gmail heeft sneltoetsen. 1253 01:14:45,940 --> 01:14:49,490 Hoe Google te implementeren sneltoetsen zoals C voor componeren? 1254 01:14:49,490 --> 01:14:54,120 Ze luisteren naar gebeurtenissen, zoals ze genoemd, zoals onkeypress of onkeyup en onkeydown. 1255 01:14:54,120 --> 01:14:56,360 Als je ooit zweefde de muis over een aantal menu-optie 1256 01:14:56,360 --> 01:15:00,180 en alle van een plotselinge, voila, verschijnt er een menu of de grafische verandert van kleur, 1257 01:15:00,180 --> 01:15:01,920 hoe doen ze dat? 1258 01:15:01,920 --> 01:15:06,940 In plaats van luisteren onready of onsubmit, je luistert naar onmouseover of onmouseout. 1259 01:15:06,940 --> 01:15:10,920 >> Dus in het kort, met deze zeer eenvoudige basics die we hebben begonnen met het oppervlak van vandaag krassen 1260 01:15:10,920 --> 01:15:13,940 en we zullen duiken verder naar op woensdag, je hebt, in toenemende mate, 1261 01:15:13,940 --> 01:15:17,530 macht om de dingen die je al bekend bent met implementeren. 1262 01:15:17,530 --> 01:15:21,620 Dus laten we daar een einde, en we zullen dit blijven op woensdag. 1263 01:15:22,690 --> 01:15:24,320 >> [CS50.TV]