[Speel van musiek] 

David Malan: Dit is CS 50, en dit is die begin van die week nege. En wat ons gedink het ons vandag wil doen nie slegs die hoofstuk oor verlede week se noue materiaal, waar ons fokus op die bediener kant web ontwikkeling met PHP en SQL, sommige databasis dinge. Ons sal praat oor 'n bietjie van sekuriteit vandag en dan oorgang na 'n kliënt-kant programmering taal bekend as JavaScript. Maar eers 'n paar verlossing. 

Jy kan onthou dat op Woensdag, het ek uiteengesit 'n webwerf te skryf wat het in die gebruiker se insette deur 'n HTML vorm wat dan gestoor dat die gebruiker se toevoer name, telefoon getalle en selfoon draers in die databasis. En dan het ek 'n bietjie command script geskryf in PHP wat veronderstel was om te Itereer oor die rye in die databasis en sms-boodskappe stuur. Ten spyte van verskeie, verskeie pogings, ons het nie dat werk aan die einde. 

So ek het hierdie hele week werk op daardie kode om ons te kry verby die punt waar ons opgehou het, waarvolgens alle Ek het teen die einde van Woensdag was hierdie teks boodskap uit Margo soos ek gesukkel, gevolg deur 'n SMS-boodskap van 'n ander klasmaat, Jy het hierdie David. Gevolg deur die een, wonderlik bemoedigend. Gehou op gaan, baie verblydend. Ek het amper het dit tot then-- en dit is die kennis wat ons het op Woensdag. En dan eintlik dalk my gunsteling, 'n oomblik later, het in. Damn lewende stroom. 

So vandag, het ons dit regmaak met 'n vinnige kyk na wat ek sedert gedoen het. So al hierdie kode is beskikbaar aanlyn vanaf verlede week se, week agt, bron-kode. En jy sal sien dat ek het deur, en Ek het eintlik skoongemaak dinge 'n bietjie. Ek het 'n paar ander kenmerke van 'n SQL databasis. Byvoorbeeld, eerder as om maak net draer van var kar as ek dink ek het op die vlieg verlede week. Ek plaas dit gedefinieer as wat genoem word 'n enum. 

En sommige van julle kan gesien het hierdie soos ons verken C. Enum is eintlik 'n kenmerk van C waar jy kan opsom 'n hele klomp van die konstantes en wys hulle outomatiese waardes, soos een, twee, drie, vier sonder om te hard kodenommers. So SQL ondersteun die dieselfde, waarvolgens, indien jy het 'n databasis veld dat jy net wil neem op een van beperkte waardes, kan jy letterlik spesifiseer dit as ek daar gedoen vir vier gewilde Amerikaanse selfoon draers. 

So ek het dit gedoen. En ek het 'n aantal veranderinge Wel, die belangrikste waarvan was om e-pos te werk, want onthou, dat hierdie program staatgemaak op wat algemeen bekend as 'n e-pos aan SMS gateway, wat net 'n fancy manier om te sê dat Verizon, en AT & T, en ander mense ondersteun 'n bediener, waardeur as dit ontvang e-pos, dit vat om dit te SMS en stuur 'n teks boodskap aan iemand se selfoon. So as ek dit gedoen het korrek, hier is 'n nuwe en verbeterde vorm wat gaan om te praat met nuwe en verbeterde kode, wat jy kan speel met aanlyn. En dit sal hopelik my selfoon biep in net 'n oomblik. 

So die eerste, ek gaan om te tik in my naam. Tweedens, ek gaan nie hierdie hierdie tyd te doen. Ek gaan nie Inspekteer element. En dit is net 'n dingetjie so ek doen nie skep uur van post-produksie werk soos ek gedoen het die afgelope tyd. Daar is nou my telefoonnommer. 

Ek sal kies Verizon. En hier, laat ons draai op die mikrofoon hier, en poog om dit op my selfoon hier. Ek gaan om te klik Register, wat hopelik sit dit in die databasis. Nou gaan ek om te gaan na die command line program wat Onthou genoem dot streep teks, en steek jou vingers. Hier gaan ons. 

[PHONE Dings] 

[Applous] David Malan: So meer pret as this-- dit is pret, natuurlik, as ek in dit. Maar dit is meer pret, het ek gedink, as ons geskep een van daardie film oomblikke waar soos iets werklik slegte gebeur het in die wêreld, en soos al die NSA mense se selfone begin piep met teks boodskappe waarskuwing hulle aan hierdie feit. So het ek gedink ons ​​sou probeer dieselfde te herskep hier waardeur nie die gebruik van 'n databasis, Ek plaas in vooraf het 'n program wat lyk soos hierdie. 

Dit is 'n index.php-- en ek het die kode aanlyn as well-- wat blykbaar net maak form.php, met behulp van 'n MVC styl paradigma dat ons praat oor in meer besonderhede in die probleem stel sewe. Dit vorm is eenvoudig. Dit gaan om aan 'n lêer genaamd here.php via post. En dit is blykbaar gaan om te vra 'n naam, en 'n telefoonnommer, en dan via sogenaamde Kies menu, dit is gaan gee jou ten minste vier gewilde Amerikaanse selfoon draers, en dan kan jy om doeltreffend te neem bywoning deur hier te klik. 

En hier, intussen, gaan leen sommige van die kode van die laaste tyd. En as jy net vlugtig hierdie, sal jy sien dat daar ' 'n hele klomp van die fout nagaan. Maar die skoonheid aan die einde is dat ons is nie die skryf van 'n databasis van vandag. Ons hou dit eenvoudig en net uit te stuur hopelik 'n SMS-boodskap via funksie ek geskryf het oor die afgelope paar dae oproep Teks, wat in funksies. PHP, wat weer aanlyn beskikbaar. 

So as jy wil om deel te neem in hierdie. Ons is nie van plan om te stoor nie. Gaan na hierdie URL hier in real time. Moenie stuur dit net nog nie, maar laat kyk of ons een van hierdie film kan hê oomblikke waar almal se selfoon begin piep, hopelik net keer vanjaar anders as in 2011 Waar dit gaan verskriklik mis. En as jy gaan na die adres, moet jy 'n super eenvoudige vorm sien dat as jy 'n naam, 'n selfoon nommer, en 'n selfoon draer wat ooreenstem met die lys is daar, gaan voort en vul die vorm in. Maar getref nie dien net nog nie. 

Die vorm gaan lyk. Gaan voort en tik jou naam, telefoonnommer. Oop, iemand se voor die kurwe gaan. Dit is OK. OK, almal is gevul uit die vorm. Dit behoort te werk op 'n telefoon, ook as jy wil. Alle reg, op jou merke, gereed, gaan. Getref hier. Wat? No. Ek sweer aan God, ek getoets hierdie verskeie kere vandag. Jy het dit? 

[INTERPOSING Voices] 

David Malan: OK, gebruiker fout miskien. Dit is twee. Dit het gewerk vir twee uit 'n paar honderd, drie, vier. OK, dit is goed. Vier van die vyf vir korrektheid hoe oor. 

So wat nou net gebeur? So vermoedelik, sonder om jou skerms, hoekom dit dalk errored het? Dit is waarskynlik dat ons net probeer te veel verbindings te maak Harvard se e-pos bediener al by keer van dieselfde IP-adres. Ek is net raai, want ek het nie het die luukse van die toets hierdie kode met 'n paar 300 mense in advance maar vir nou besef dat dat ten minste het die werk gedoen hierdie tyd gekry. 

Alle reg, so hoekom is dit al die meer related aan wat gaan aan? Wel in die eerste, 'n vinnige paar aankondigings. So een, as jy wil Chang aan te sluit, en Nick, en ander by die middagete hierdie Vrydag, doen RSVP by die gewone URL daar. As jy dink van die konsentreer in of doen 'n sekondêre in CS, of jy 'n stage, of eerstejaars, of selfs junior of senior op hierdie punt en kan nog steeds druk in die kursusse, besef dat die ingenieurswese skool word versamel gratis Ben en Jerry se roomys en advies hierdie Woensdag kort ná die klas by 04:00 in die CS-gebou by Maxwell Dworkin. As dit te vinnig op die skerm, net gaan te cs50.harvard.edu vir 'n skakel na die Facebook gebeurtenis waar jy kan sien meer besonderhede. 

Intussen het ek gedink ek sou regstel een ander ding wat ek goofed op Woensdag. Blyk dat Mark se ID op Facebook was nie drie nie. Dit was vier. Blyk hy meer toets rekeninge as wat ek onthou. Maar wat hierdie gevoel soos 'n geleentheid om te doen, is om te trek 'n URL soos hierdie. 

So dit blyk dat Facebook het 'n API, Application Programming Interface, Dit is 'n meganisme waardeur jy kan data programmaties versoek op Facebook en masjien terug te kry leesbare inligting, nie web bladsye maar net rou teks, iets genoem JavaScript Object notasie. En in die feit, as ek na hierdie URL, en Zoom in, by verstek, dit is Mark se publiek toeganklike inligting. 

En die interessante detail hier is net dat sy ID inderdaad, nommer vier, wat ek besef so gou as ek dit gedoen het. Jy kan dit doen jouself as jy weet Facebook rekening as jy een het. Tik dit net tot bo daar. En nie een van hierdie is privaat. Ek is net om dit te doen, selfs in die incognito af. So ek is nie eens aangemeld. En jy sien dat ek was blykbaar gebruikers nommer 6454 op Facebook, wat nie te sleg hierdie dae. So in elk geval, sal jy ook sien bykomende inligting daar. 

En die nuttige aspek daarvan is dat jy kan jou eie sagteware te skryf wat integreer data soos hierdie een of ander manier in jou eie toepassing. Jy kan gebruikers te bemagtig teken in jou webwerf, nie die gebruik van hul eie persoonlike gebruikersnaam en wagwoord nie, maar miskien hul Facebook login en inligting te kry, selfs oor hul vriende, indien hulle keur sulke of soortgelyke. So daarop dat CS50 ook het 'n paar van sy eie API's, een vir die kursus katalogus data, sommige vir die drukkies spyskaarte in die eetkamer sale, al die geboue en plekke op die kampus ons het 'n API vir sowel dat jy ook so kan bevraagteken en kry terug tekstuele data wat jy kan integreer in 'n PHP, of JavaScript, of selfs, al minder algemeen, 'n C gebaseer finale projek. 

Inderdaad voor vir die finale projek is 'n paar mylpale. Jy het 'n e-pos van ons die ander dag. Besef dat die voorstel is as gevolg van eerskomende Maandag. Dit is nie noodwendig bindend, maar jy hoef jou onderrig genote te ontvang goedkeuring voordat enige veranderinge daarna. En dan voor 'n aantal ander mylpale. 

So om jou te terg, te, met 'n paar moontlikhede, ons het 'n klomp van die hierdie kleur gloeilampe. En sommige van julle ouens nou 'n paar van hierdie in jou koshuiskamer as well. En hulle het ook 'n API. So onthou die binêre bolle weke gelede dat Dan Bradley en Ansel Duff geskep vir ons. Hulle gebruik 'n sagteware koppelvlak hierdie gloeilamp, wat op die oomblik ingeprop in elektrisiteit en dan via draadlose verbind is tot 'n klein ding genoem die brug af hier, soos 'n klein router eiendom hierdie spesifieke toestel. 

Maar dit blyk of ek weet hoe om te stuur HTTP-boodskappe, soos ons almal nou te doen, Ek kan 'n boodskap stuur soos hierdie hierdie gloeilamp dit op of af te skakel of enige aantal ander bedrywighede op dit. Let daarop dat dit nie ons kry, is dit nie plaas. Daar is 'n ander een wat geroep is beklee. Daar is eintlik 'n paar ander sulke werkwoorde. Maar let op daar is 'n pad daar, streep API, streep nuwe ontwikkelaar, streep lig, streep een, streep staat. 

Dit is blykbaar net die pad wat die maatskappy Philips, besluit wat jy hoef te tref met 'n HTTP-versoek As jy wil hê dat die staat te verander van die gloeilamp met behulp van HTTP 1.1. Toe sien die leë lyn. En dan laastens wat lyk soos soort van 'n verskeidenheid van 'n soort, dit weer gaan genoem word JavaScript Object notasie, of Jason. En wat jy hier sien, is dat daar is drie sleutel waarde pare. 

Een van die belangrikste is 'n beroep op. En die waarde daarvan glo gaan om waar te wees. Helderheid is 128, wat is 'n soort van int. En dan oorgang tyd nul, wat blykbaar hoe lank dit gaan neem hierdie ding om te draai op. 

So nou hierdie gloeilamp is af. Maar as ek doen presies this-- laat my gaan 'n bietjie oneerlik blad dat Dan opgestel in advance-- en ek gaan om voort te gaan en te kopieer die volgende opdrag. Krul, soos sommige van julle kan verkry het op CS50 Bespreek is 'n program soos Telnet soos wat jy kan simuleer HTTP versoeke, spesifiek sit. Ek kan hierdie data te stuur, spesifiek wat ons nou net sien 'n oomblik gelede spesifiek hierdie URL hier. En dan Curl gaan hanteer al die nodige opskrifte en die ontleding van daar van. 

So al wat ek hoef te doen is kopieer dit in 'n terminale venster en dan druk Enter. En die gloeilamp gaan aan. En dit is al wat gaan deur my rekenaar draadloos een of ander manier na die brug, wat dan praat hierdie gloeilamp. Ek kan iets anders doen. Ek kan hierdie ding maak gaan rooi byvoorbeeld. Ek kan byvoorbeeld ' hierdie ding gaan groen. Ek kan dit gaan blou. 

En let op in elk van hierdie gevalle, al wat ek verander is die sogenaamde kleur waarde eintlik gee dit 'n bietjie kleur. So laat my plak hierdie een in sowel. Nou is dit blou. 

En jy kan selfs liefhebber doen dinge where-- laat ons gaan na groen. En ek kan dit van doen Natuurlik met my eie kode. Maar selfs die API self ondersteun funky bedrywighede soos hierdie, wat sal nou pla ons vir die volgende 30 sekondes. 

So dit is een voorsmakie van wat jy dalk doen met 'n API, hierdie een wat gloeilampe. Let daarop dat CS50 het 'n paar pare Google Glass As jy wil iets om saam te pak die lyne, Arduino unos, wat is klein bietjie rekenaars, wese, op 'n klein kring raad wat jy kan koppel drade en ander dinge te en eintlik beheer jou werklike wêreld omgewing. En dan is daar 'n paar van die nuwe speelgoed wat ons het. Hierdie een letterlik net aangekom die dag per e-pos, 'n Myo Armband. En ek het gedink dit is 'n manier om te kry jy opgewonde oor projekte wat jy kan gebruik met hierdie hardeware sou wees hierdie kort clip te speel wat hulle gebruik mense om te pla dat ons nou die lewe in die toekoms. 

[Speel van musiek] 

David Malan: So in net 'n paar weke, het jy te kan wees dat koel by die CS50 regverdig. Nog 'n toestel wat ons 'n klomp van ons is bly om te leen vir projekte word 'n beweging kontroleerder. Dit is 'n bietjie USB-toestel jy toegang tot 'n rekenaar wat laat jou interaksie met jou laptop, Mac of PC, asof jy het soos 'n Xbox Kinect en eintlik maak fisiese bewegings veel soos ons sien in hierdie visie van die toekoms. 

[Speel van musiek] 

David Malan: So selfs as jy ' geen idee hoe so iets moontlik uitgevind word of werk op 'n hardeware vlak, maak nie saak. Selfs na 'n paar maande van CS50, en 'n begrip van die ontwikkeling meer in die algemeen, en web ontwikkeling meer onlangs, en dan ook API's en HTTP, jy sal toegang hê via sagteware APIs as jy wil een van hierdie te leen toestelle te eintlik praat dit en nie hoef te bekommer oor die onderliggende implementering besonderhede, wat heeltemal ooreenstemming met hierdie idee van lae 'n abstraksie wat ons het gesien deur die semester. 

So ook oor die naweek, het 'n paar stukkies van die nuus. Gaan eers na seminare as jy iets wil leer meer oor enige aantal onderwerpe. Sien die URL daar. En hierdie een is gestuur my deur Chang, wat jy weet, wie die druk van ons weermag van olifante. En dit was 'n kop soos volg. Ek is bang vir my nuwe TV. Hoekom ek is bang om dit te draai ding op en jy wil te wees. So ons is nou op die punt in die semester, Ook waar selfs as jy ' die geringste van begrip van hoe die web werk, en HTTP, en sekuriteit, dinge soos hierdie moet begin om jou oog te vang. Maar ook, sal jy verstaan of hierdie dinge is of nie werklike bedreigings. 

Toe het ek 'n paar uittreksels van hierdie artikel hier. En die storie is soos volg. Ek is nou die eienaar van 'n nuwe smart TV, wat beloof streaming te lewer multimedia-inhoud, speletjies, inligting, sosiale media, en internet blaai, o en TV ook. Die enigste probleem is dat ek nou bang om dit te gebruik nie, sê die skrywer. Jy sal ook, as jy deur te lees die 46 page privaatheid beleid vir jou TV. Die bedrag van data van hierdie ding versamel is verbysterend. Dit logs waar, wanneer, hoe en vir hoe lank jy die TV. Dit stel die dop koekies, as ons bespreek het, en bakens ontwerp op te spoor wanneer jy beskou spesifieke inhoud of 'n spesifieke e-pos As jy wil e-pos om te kyk op jou TV. Dit rekords van die programme wat jy gebruik, die webwerwe wat jy besoek, en hoe jy interaksie met die inhoud, doen dit alles deur jou smart TV. Dit is ook, Creepier yet-- dit is my addition-- het 'n ingeboude in die kamera met gesig erkenning. 

Die doel is om voorsiening te gebaar beheer vir die TV en in staat stel om aan te meld by persoonlike rekening met jou gesig. Aan die positiewe kant, die beelde gestoor word op die TV in plaas van die foto's 'n korporatiewe bediener. Aan die negatiewe kant, die internet verband maak die hele TV kwesbaar vir hackers wat het getoon die vermoë volle beheer van die masjien te neem. 

Meer verneder, asof dit was nie slim genoeg, is die mikrofoon. Die TV spog met 'n stem funksie erkenning waarmee kykers te beheer die skerm met die stem bevele. Maar die diens kom met 'n taamlik onheilspellende waarskuwing. Wees asseblief bewus daarvan dat indien jou gesproke woorde insluit persoonlike of ander sensitiewe inligting, wat inligting sal wees onder die data vasgevang en aan 'n derde party. Het dit? Moenie persoonlike of sensitiewe sê dinge in die voorkant van jou TV. 

So dit is eintlik vir die ware. En dit is moeilik om nie te sien as jy gaan na Best Buy of die wil vir TV hierdie dae. Hulle is almal slim in een of ander manier. En hulle kry slimmer en Creepier. En hulle is eenvoudig die versameling van data op maniere wat ons gepraat het oor en dan oplaai via HTTP of 'n ander protokol sommige bediener. 

So dit was 'n lekker artikel in hierdie aanlyn-webwerf hier, wat gepraat het oor 'n spesifieke fout of verkeerde kode dat ons eintlik kan bind in verlede week se bespreking. So hierdie kop was as volg die storie gaan hier, Josh Breckman gewerk vir 'n maatskappy wat 'n kontrak geland 'n content management te ontwikkel stelsel, of CMS as hulle geroep het, vir 'n redelike groot regering webwerf. Baie van die betrokke projek ontwikkeling van 'n content management system sodat werknemers sou wees staat om te bou en in stand te hou die steeds veranderende inhoud vir hul webwerf. Dinge het baie goed vir 'n Paar dae na gaan live. Maar op die dag ses, dinge so goed gegaan het nie. Al die inhoud van die webwerf het heeltemal verdwyn. En al die bladsye het gelei tot die standaard, Tik inhoud webblad. Oeps. Josh is ingeroep om ondersoek en opgemerk dat 'n mens besonder lastig eksterne IP-adres het gegaan in en verwyder al Die inhoud van die stelsel. 

Die IP adres het nie behoort sommige oorsese hacker gebuig oor die vernietiging van nuttige regering inligting. Dit besluit om googlebot.com, Google se eie web kruip spin. Oeps. Na 'n bietjie van navorsing en die skommeling rondom 'n noncorrupt Friends te vind, Josh het gevind dat die probleem. 

'N gebruiker het kopieer en geplak inhoud van een na 'n ander, insluitend 'n wysig Hyperlink Die inhoud van die bladsy te wysig. Normaalweg sou dit nie wees om 'n kwessie, aangesien 'n buite gebruiker sou 'n naam en wagwoord in te voer, maar die CMS verifikasie stelsel, die aanmelding stelsel, het nie in ag neem gesofistikeerde inbraak tegnieke van Google Spider. Oeps. 

Soos dit blyk, Google Spider gebruik nie koekies, wat beteken dat dit kan maklik omseil 'n tjek vir die is aangeteken op koekie stel vals is. Dit is ook nie aandag te gee aan JavaScript, wat normaalweg vinnige en lei gebruikers wat nie aangemeld is nie. Dit beteken egter volg elke skakel op elke bladsy vind dit, insluitend diegene wat met Verwyder Page in die titel. Oeps. 

So wat beteken dit in meer tegniese, maar redelik toeganklik terme? Dit beteken net dat regdeur hul webwerf, hulle het URLs nie in teenstelling met die een wat jy kan sien in die probleem stel sewe. Onthou in die probleem stel sewe of weet probleem die sewe wat jy uitgedaag, onder andere, aandele namens gebruikers te verkoop. Maar die uitvoering van die funksie by wyse van kry via skakels in jou gebruiker koppelvlak, waarskynlik nie die slimste idee want as jou site is een of ander manier toeganklik óf deur 'n mens wie om te klik of koop 'n bot soos Google of 'n Spider as hulle genoem dat net kruip die web probeer indeks die web as 'n soektog, hulle kon baie maklik getref deur hierdie soort van URL. En dit is funksioneel gelykstaande aan, in hierdie geval, verkoop van alle aandele van Google. 

Nou eerlik, dit is heeltemal asinine dat die CMS gebruik JavaScript en koekies sy aanmelding stelsel te implementeer en nie doen wat die bediener kant, as julle doen en ook sal in PSet 7-- daar is 'n login.php file-- altyd, altyd, altyd sekuriteit moet wees gedoen op die bediener kant, nie op die kliënt se kant, want as dit artikel stel en jy kan jouself sien op 'n sekere punt, is dit triviaal vir 'n gebruiker, goed of sleg, om net af JavaScript nie koekies te noem. So dit is jou daaglikse WTF. 

Daar is nog een, wat is net 'n soort van scary, so ek sal noem dit as slegs as 'n lewe les. Wanneer jy 'n aansoek gebruik genoem soos Snapchat of die soos wat sê hierdie foto's slegs vir vyf sekondes, tien sekondes, of iets anders. Hulle is kortstondig Dit is absoluut nie die geval nie. Soos daar is geen manier, digitaal, 'n vorm van video te implementeer, of beeld of teks deel soos dat 'n ontvanger aan die ander kant kan nie een of ander manier red die data. 

In die mees naïewe manier, iemand kon sy selfoon neem. En hulle het 'n 10 sekonde venster terwyl op soek na 'n paar snap om net te neem 'n paar ander selfoon en foto dit, natuurlik. Sodat jy kan bewaar iets digitaal dat die pad. Sommige van julle weet hoe om te neem screenshots op jou selfoon. In werklikheid, as jy dit nie weet nie, besef dat ten minste Snapchat, en ek dink ander aansoeke om hierdie dae, ten minste jou vertel as die ontvanger het eintlik geneem om 'n kiekie van jou beeld. 

Maar erger nog, dit was die snappening, as iemand dit geskep het onlangs, waar sommige 100,000 breek vrygelaat in wat genoem word 'n stortvloed lêer op verskeie webwerwe uiteindelik. En dit bevat 'n hele klomp van private boodskappe en boodskappe. Dit blyk uit die meeste van hulle goed, so nie wat jy kan verwag. Maar omdat die mense gehad het gebruik om 'n derde party webwerf, teken met hul Snapchat gebruikersnaam en wagwoord en dan spaar al hul breek op die derde party webwerf. En dit was die derde party webwerf wat gekap is, wat net bedoel om iemand uitgepluis het hoe al 100,000 plus van die beelde te kry in hul eie hardeskyf vir die daaropvolgende deel. Eerlik, ook hier, dit is soort van asinine dat Snapchat is in so 'n wyse geïmplementeer wat 'n derde party kan sorteer van onderskep die data en dat dit nie gekoppel is aan jou eie toepassing wat uitgevoer word op die telefoon. Maar ook hier, besef dat hierdie dinge moet nie verrassend, of ten minste moet daar wees om 'n lewe les hier. As jy wil die tegniese besonderhede, gaan na hierdie URL is daar dit is in vandag se skyfies. Alle reg, enige vrae oor vandag se lewe lesse in CS? Draai dit af. Enigiets? Enigiets? Ek het 'n klomp mense te keur hul Snapchat of iets nou. 

Alle reg, sodat SQL, Structured Query Language. Kom ons draai hierdie. En ook, selfs al ons net krap die oppervlak van hierdie taal, sal ons gee jou genoeg van die taal in die vorm van PSet 7 sodat jy kan 'n paar te pak redelik algemene funksies. Maar besef daar is 'n paar dinge wat ons nie van julle nie, maar hulle gaan wees belangrik kom finale projekte en sekerlik kom maak werklike webwerwe met werklike gebruikers is hierdie ontwerp besluit. 

Dit blyk dat in 'n MySQL databasis, jy het trosse van keuses soos die data tipes vir jou kolomme en ander dinge, maar jy moet ook Die keuse van 'n sogenaamde stoor enjin vir al jou data, die soort van lêer stelsel, As jy vertroud is, vir al jou data. Watter formaat is dit uiteindelik gestoor in? En die mees algemene, miskien, is MyiSAM en InnoDB, tegniese terme dat ons net sal omgee tot die mate dat 'n mens en een het nie die volgende funksie. 

Veronderstel dat jy 'n bietjie dorm yskas. En veronderstel dat jy en jou kamermaat, wat hierdie yskas deel, is regtig lief sê melk. En dit is, in werklikheid, hoe die storie pad terug aan my vertel in die dag wanneer Ek het 'n kursus genoem CS 161 Bedryfstelsels, wat insgelyks ondersoek hierdie onderwerp. So jy het die yskas. Jy is uit die melk. En jy by die huis kom, jou kamermaat se nog op die klas of wat ook al, en jy besluit ek gaan gaan uit en kry 'n paar melk. So jy naby die yskas, toesluit die koshuiskamer, gaan oorkant die straat te CVS of waar ook al, en kry in lyn melk te koop. 

Intussen het jou kamermaat by die huis uit die klas, kry in die koshuiskamer, maak die yskas, ook besef ooph, ons is uit melk. Sodat hy of sy sluit die yskas en dan gebeur om te gaan na die ander CVS, wat gebeur om te wees een blok weg van die ander CVS in die vierkante, en kry in lyn daar 'n paar melk te kry. Nou, natuurlik, 'n paar minute later, julle albei terug te kry, en die ergste van alle moontlike uitkomste gebeur het. Beide van julle het melk. En jy nie regtig soos melk wat veel. So een van hulle is net gaan versuur op 'n sekere punt. So nou het jy 'n oormatige hoeveelheid melk in die yskas omdat hoekom? 

[Onhoorbaar] David Malan: Ja, jy het nie een of ander manier met mekaar kommunikeer dat jy besig was om melk. So in die eenvoudigste maniere in die menslike wêreld, Hoe kan jy verhoed dat hierdie simpel scenario gebeur soos dat jy net eindig met een. Teks om dit, ja goed. Maar hoe anders? Post-it notas. David Malan: 'n Post-it nota. Enige vorm van kommunikasie wat vertel jou kamermaat gaan nie in die yskas vir melk. Ek gaan om te gaan vaccin op my eie. So jy een of ander manier moet hierdie hulpbron te sluit. Sodat ons kan maak this-- ons kan soort ruïneer die storie en verander in 'n CS storie waardeur dink van hierdie as net soos 'n veranderlike, wat die stoor van waarde. En nou, die waarde van melk is nul, wat jy nie wil hê om jou kamermaat daardie veranderlike te inspekteer en dan 'n besluit neem om hom of haarself gebaseer op die toestand van daardie veranderlike As jy in die proses van die verandering van die toestand van daardie veranderlike. 

So een van die lyne van SQL dat ons gee jou in PSet 7 spesifikasie is hierdie een hier. En ons spandeer nie 'n groot bedrag van die tyd om daaroor te praat. Maar dit blyk, as jy probeer sommige voorraad te koop in CS50 Finansies dat jy reeds sommige aandele van u wil in staat wees om 'n nommer te doen van die dinge wat dadelik saam. Jy wil in staat wees om effektief, op 'n hoë vlak, check alles reg, as ek wil meer aandele van Free te koop, die pennie voorraad ons praat oor in die spec, Ek wil eerste tjek hoeveel aandele ek het. En dink dit is vyf. En dink ek wil koop 10 meer, ek uiteindelik wil 15 aandele van voorraad te hê. So ek het twee vrae te vra. Wat is die toestand van die veranderlike? Wat is die toestand van die ry? Hoeveel aandele het ek op die oomblik? Dan moet jy wil om voort te gaan en werk dit. So wat is die analoog aan die melk in dat u die ry, en dan moet jy wil hê om dit op te dateer want as jy wil 10 aandele te koop, jy nie wil hê om te verander die ry tot 10, kan jy wil dit verander na 5 plus 10 of, natuurlik, 15. 

Hierdie lyn van die kode te verseker dat die twee konseptuele idees gebeur saam of glad nie. Niemand, insluitend 'n paar ander gebruiker wie aangeteken in die dieselfde webblad, kan een of ander manier onderbreek die nagaan van die ry en die opdatering van die ry, die kies en die werk as jy wil. En die sintaksis is nie super duidelik, maar hierdie een lyn, lank is dit is, verseker dat die twee operasies Gaan die veranderlike of check die ry en werk die ry gebeur atomies. 

Ag hier gaan ons weer. SMS-boodskap op my selfoon. So kom ons maak dit 'n bietjie meer beton. Veronderstel dat jy nie implementering van 'n yskas, en jy nie die implementering PSet 7 maar 'n werklike bank, of 'n OTM, 'n outomatiese teller Masjien, waardeur jy een of ander manier wil in staat wees om te bemagtig gebruikers geld oor te dra van een rekening na 'n ander. OK, hang. Ek gaan dit nou stom, dankie. So wil ons geld te beweeg van een rekening nommer in 'n ander rekening nommer, spesifiek $ 100. So dit is soort van 'n arbitrêre Byvoorbeeld, waarop jy die OTM, dalk wil twee SQL te voer navrae, trek van een rekening, en voeg by die ander rekening. Maar jy wil om te verseker dat hierdie twee lyne beide gebeur, of glad nie. Jy iets nie wil nie om onderbreek. Jy doen nie 'n paar slim slegte man een of ander manier staan ​​by die Bank van Amerika met twee kitsbanke in die voorkant van hom en een of ander manier soort van tik in die beveel op dieselfde tyd, hopelik probeer $ 200 in plaas af te trek van $ 100 en slegs met $ 100 gekrediteer. In kort, jy wil om dit te optree presies soos jy verwag. 

En die manier wat jy doen hierdie in SQL databasis jy draai in wat bekend as 'n transaksie. Letterlik in SQL, kan jy bel CS50 se navraag funksie met quote unquote begin transaksie. Dan kan jy enige aantal voer daaropvolgende SQL navrae, maar nie een van hulle te neem bring op die databasis totdat jy noem navraag quote unquote pleeg, as weer met behulp van PHP. En op hierdie wyse kan u verseker dat selfs as jy het 1000 gebruikers slaan jou databasis op dieselfde tyd, SQL belowe dat hierdie twee navrae sal wees geïmplementeer een reg na die ander. Sodat jy nie eindig met 'n oormaat van melk of die verkeerde bedrag, uiteindelik, geld. 

So hou dit in gedagte, nie soseer vir PSet 7 maar vir die finale projekte as jy eintlik probeer data om rond te beweeg oor tafels as jy dalk hier. Maar selfs eenvoudiger en meer voor die hand liggend om te verstaan ​​met 'n voorbeeld is hierdie een hier. En iemand per e-pos ons oor dit net die ander dag toe hy sien iets soortgelyks aanlyn. 

So na my wete, die pen stelsel is nie kwesbaar vir hierdie aanval. En ek het geen idee of dit selfs gebruike die SQL databasis onder die kap. Maar laat ons dit gebruik vir ter wille van die bespreking. Hier is die skerm wat Harvard mense geneig om te sien wanneer te teken met hul Harvard ID-nommer en hul pen. En veronderstel dat die pen stelsel was in PHP en met 'n MySQL geïmplementeer databasis, die kode dat iemand kan geskryf het jare gelede mag lyk. Eerstens, verklaar 'n veranderlike genoem rekening. En net kry wat uit die NA superglobal. Dan kry 'n ander veranderlike genoem wagwoord en dieselfde doen. En dan net uit te voer hierdie lang navraag hier Kies ster van die gebruikers waar gebruikersnaam gelyk aan sulke wagwoord gelyk aan sulke. 

Let daarop dat die krullerige draadjies wat ek hier gebruik net beteken om PHP, gaan voor en plaasvervanger die waarde van die twee veranderlikes reg daar. Hulle is nie streng noodsaaklik is, maar hulle is geneig om subtiele sintaksfoute te vermy. So dit lyk heeltemal korrekte met die eerste oogopslag. En dit is. Jy kan implementeer om die pen stelsel in hierdie manier. 

Maar veronderstel dat 'n super slim en kwaadwillige student insette dit as sy of haar pen. So ek het die koeël verwyder tekens hier in die spot het, en ek het eintlik aan die lig gebring wat hy of sy tik kan wees. En dit is 'n bietjie vreemd. Maar wat spring uit by jou op potensieel kommerwekkende oor die gebruiker se insette, selfs as jy het geen idee wat 'n SQL-inspuiting aanval beteken. Waarom het hierdie kyk 'n bietjie fishy? Wat is dit? [Onhoorbaar] David Malan: Die of 'n bietjie verdag. In werklikheid, dit is 'n navraag van SQL. Sodat voorspel niks goeds. Die feit dat daar al hierdie enkele aanhalings there-- in werklikheid, een van die maklikste maniere sommige databasisse te breek is deur te tik in 'n naam soos O'Reilly wat 'n toespraak in dit want as die mens wat geskryf die kode agter die skerms nie in ag neem dat daar dalk enkele aanhalings in 'n gebruiker se insette, en hy of sy gebruik enkele aanhalings in hulle kode, slegte dinge kan gebeur. 

In werklikheid, erger nog, oorweeg dit. As dit was weer die kode dat iemand by Harvard jaar gelede geskryf het vir die pen stelsel, let op wat is oor te vervang raak vir gebruikersnaam en wagwoord As die gebruiker weer skroob as hul gebruikersnaam en dan een, twee, drie, vier, vyf, kwotasie of kwotasie unquote een gelykes Haal EEN. En sien wat is die sleutel hier is die gebruiker het nie begin om hul wagwoord of hul pen met 'n kwotasie. En hulle het nie geëindig dit met 'n aanhaling omdat hy of sy is die veronderstelling dat indien die programmeerder was nie so skerp, hulle gaan diegene te hê enkele aanhalings in hulle kode. 

So hier is die kode. En die vervanging van die nou kan gebeur, is hierdie. En ek het onderstreep wat die gebruiker getik. So voor, na. En sien wat is effens kommerwekkend nou oor die regter helfte van die SQL-kode? Dit is 'n bietjie meer kompleks, weliswaar, as die navrae wat ons gesien het. Maar dit kan nie moontlik 'n goeie ding as jy sê kies ster, wat kies alles van die gebruiker se tafel waar gebruikersnaam gelyk skroob en wagwoord is gelyk aan een, twee, drie, vier, vyf of een is gelyk aan een. Wat is die logiese implikasie van daardie laaste klousule vermoedelik? Dis net altyd waar nie. 

En omdat ons soort raai of uitgepluis deur trial en error dat die programmeerder wat het hierdie kode het nie verwag 'n mens of slegte persoon tik in aanhalingstekens so goed, ons kan sintakties voltooi die SQL navraag met iets nonsens maar iets wat is sintakties korrek wat altyd evalueer waar. So as hierdie kode gebruik word, te beantwoord Die vraag waar of vals moet hierdie gebruiker toegelaat word om die te slaag antwoord is altyd blykbaar gaan om waar te wees, want dit is altyd iets iets uit die databasis te kies want 'n mens natuurlik altyd gelyk is een. 

So, wat is die oplossing? Wel in PSet 7, het ons eintlik vermy alles saam. Ons gee jou 'n navraag funksie, en ons moedig jou vraagtekens te gebruik as plekhouers, soortgelyk in die gees te printf se% s, maar wat is die sleutel van die vraagtekens hier is as jy eintlik lees functions.php, waar ons navraag funksie geïmplementeer word, diegene vraagtekens is ontsnap, waardeur iets potensieel gevaarlike soos 'n enkele aanhaling is aangeskakel in 'n enkele aanhaling ontsnap. 

So dit is wat werklik gebeur as jy gebruik CS50 se navraag funksie of enige aantal van die derde party gratis biblioteke wat doen dieselfde. Maak nie saak nie in hierdie geval, in die groen, indien die gebruiker in 'n enkele aanhaling getik omdat die navraag funksie wat ons geskryf is gaan skuinsstrepe te voeg voor enige sodanige gevaarlike kwotasie. So dit is nie, in Trouens, gaan wettig wees. Dit is soos tik in 'n gek soek wagwoord wat is, natuurlik, gaan nie skroob se werklike wagwoord te wees. 

So het die afhaal vir CS50 is een, absoluut altyd iets gebruik soos CS50 se navraag funksie of die onderliggende biblioteek, wat gebeur genoem te word BOB. Maar nooit, nooit, nooit-kode doen soos hierdie sonder ontsnap of skrop soos hulle sê jou insette. En jy sal op 'n stadium waarskynlik kom oor 'n paar webwerf soos hierdie. Trouens, dit blyk die geval te wees soos by lughawens en hotelle in plekke waar hulle gratis Wi-Fi toegang wat jy hoef te meld by, hierdie webtuistes is altyd verskriklik geïmplementeer. En so 'n soort van pret by die huis oefening, nie vir kwaadwillige doeleindes of meer 'n pret op die pad oefening, is om te tik 'n toespraak, 'n enkele aanhaling, in 'n vorm op 'n webwerf en kyk wat gebeur. En as die bediener ineenstortings of gee jy 'n soort van fout boodskap, Dit kan baie goed wees dat iemand het nie verwag dit. En dan moet jy waarsku die behoorlike owerhede en gaan nie verder nie. 

So nou Julle moet hopelik hier verstaan ​​'n bietjie meer geek humor. 

[Gelag] David Malan: Jy weet jy is 'n geek. Vir die volgende paar jaar, sal jy onthou wat min Bobby tabelle As gevolg van hierdie spotprent hier. So hou dit in gedagte as ons konteks skakelaar 'n laaste keer vandag JavaScript. Ons het relatief min bestee tyd op die sintaks van PHP want dit is eintlik super soortgelyk aan C. En mooi genoeg, JavaScript te super soortgelyk aan C se sintaksis so goed soos ons sal sien in net 'n oomblik en as ons sal sien later vandeesweek in die besonder. Wat jy kan doen met hierdie taal, al is, is al hoe meer kragtige, veral met die API's. 

Maar eers 'n vinnige toer. So een, in JavaScript, daar is geen hoof funksie, wat is lekker. Soos met PHP, kan jy net skryf kode. Toestande lyk. En Boolse uitdrukkings mag lyk dit of soos hierdie. Skakelaars bestaan ​​nie, en hulle mag lyk. Vier sirkelroetes lyk. Terwyl sirkelroetes lyk. Doen genot lyk. En dan skikkings lyk hierdie, baie soortgelyk aan PHP. Maar let dat in JavaScript jy verklaar 'n veranderlike nie met 'n dollar teken nie met 'n data tipe, maar letterlik deur te sê var vir veranderlike voor dit. Dit word ook losweg getik in dat dit tipes, maar jy uitdruklik verklaar hulle nie. En dan 'n string, vir Byvoorbeeld, kan kyk soos hierdie, wat string geroep is in hierdie geval. En dan 'n voorwerp. En dit sal ons sien meer voor lank. En 'n voorwerp is dalk een van die mees algemeen gesien data strukture in 'n JavaScript gebaseer program, want dit kan om jou te assosieer arbitrêre sleutel waarde pare net soos PHP se assosiatiewe skikkings en net soos jou eie hash tafel of probeer as ons ' 'n paar weke terug. So laat ons eintlik sien wat ons kan doen met JavaScript. En in die besonder, is dit 'n wassery lys van eienskappe dat blaaiers het dat toelaat dat ons JavaScript te haak in 'n webwerf in die volgende manier. JavaScript word dikwels gebruik as 'n kliënt kant script taal. Dit is nie saamgestel. Dit is ook vertolk word. Maar in teenstelling met PHP, wat nou al op die bediener, in die web-bediener, of diep binnekant van die kliënte, JavaScript is anders in dat dit gewoonlik loop in die leser. 

So 'n JavaScript-kode wat jy begin skryf vir PSet 8, of jou finale projek of in die werklike wêreld is oor die algemeen gaan om gered te word op die bediener, absoluut in 'n dot HTML of dot JS vir JavaScript-lêer. Maar die leser gaan om af te laai wat JavaScript kode na jou eie voorbeeld van Chrome, of Internet Explorer, of Firefox, of wat ook al. En die kode is eintlik die gang te kry uitgevoer binnekant van jou eie leser. Net hierdie meer werklik te maak, laat ons sien dit in konkrete vorm. 

Ons het geen idee wat hierdie kode nie sonder om werklik deur te lees nie. Maar laat my gaan na Facebook.com sonder meld. Laat my gaan Element te inspekteer en gaan na, kom ons sê, Network en die bladsy te herlaai. En ons sal see-- laat my skuif herlaai die Page al die versoeke vir nuwe te kry. En die heel eerste lêer wat ek sien is CSS, CSS. Hier is die eerste JavaScript-lêer, en ek het geen idee wat dit doen nie, maar hier is 'n paar van die JavaScript-kode wat dryf Facebook. Dit is nie eens regtig dat openbaar om te vergroot. Dit is nog steeds net so nonsens. 

Maar jy sal nog daar onder sien, is daar selfs meer van hierdie JavaScript-lêers. Oeps. Dit is 'n ping. Kom ons gaan af 'n bietjie verder, verder, verder. Daar is een. Daar is een. Daar is een. 

So selfs al is Facebook, agter die tonele, is gedeeltelik in PHP geskryf en Facebook se eie weergawe daarvan, daar is 'n groot hoeveelheid van die JavaScript. Trouens, enige van die gesels wat jy doen op Facebook, enige van die inline tydlyn updates dit gebeur in real time, al wat word aangedryf deur JavaScript. Ja? 

Publiek: Ek is nie seker As dit is Facebook, maar ek het gedink dat Facebook ontwikkel hul eie in-huis-kode taal? David Malan: Hulle het. So dit is hoekom ek sê dat 'n afwyking van PHP genoem Hip Hop dat hulle eintlik meer funksies te sodanig dat wanneer Mark eerste geïmplementeer Facebook, dit is in PHP geskryf is. En dat die soort van het gebly die soort voorkant taal wat hulle gebruik vir veel van hul kodering, maar dit is nie 'n taal wat skale besonder goed miljarde mense. En so het hulle hul eie bygevoeg verbeterings agter die skerms. En hulle gebruik 'n aantal van ander tale vir verskeie stukke hul infrastruktuur. So ja, dit is 'n afwyking van wat ons nou ken as PHP. 

So laat ons neem 'n blik by 'n paar voorbeelde hoe kan ons JavaScript hier gebruik. In vandag se bron-kode, ons het 'n n klomp van die lêers, waarvan die eerste, laat ons genoem DOM nul. So DOM nul lyk soos volg. Laat my gaan in hierdie gids en maak domzero.html, die top van wat 'n doc tipe verklaring gesê hier kom HTML 5. En nou hier is 'n HTML tag. Hier is die hoof tag. En hier is wat nuut is vandag. 

Ons het nou 'n script tag binnekant van die hoof van die bladsy. En dit blykbaar nie baie min, maar kennisgewing wat ek gedefinieer n script, 'n JavaScript. En as 'n eenkant, aangesien dit is 'n algemene wanopvatting, JavaScript het absoluut niks te doen met Java, die taal dat sommige van julle dalk het in APCS geleer. Dit was meer van 'n bemarking ding as enigiets, ry die coattails Java jaar gelede. Maar JavaScript, niks te doen met Java, net so, en so lastig, verwarrend naam. 

So hier is hoe jy 'n funksie te verklaar in JavaScript, letterlik sê funksie, dan is die naam van die funksie, dan is enige argumente dit kon neem, net soos in PHP. Blyk in JavaScript, een van die mees irriterende funksies wat bestaan ​​is Alert. Dit is 'n klein venster wat sal pop-up en jy waarsku om 'n stuk van inligting. Dit is oor die algemeen afgekeur. Maar ons sal dit gebruik as ons eerste oefening hier. 

Let 'n paar kenmerke van JavaScript. Enkele aanhalings en dubbel aanhalings nie eintlik saak nie. Enkele aanhalings en dubbel aanhalings kan omgeruil word, terwyl dit in C, jy het om te gebruik dubbel aanhalings vir Strykers, en jy het twee enkel kwotasies vir karakters. In die JavaScript wêreld, baie mense, die meeste mense Gebruik aanhalingstekens rondom snare net omdat dit 'n stilistiese ding. Maar wat is die plus operateur hier wat ons nie gesien het nie voor? 

Publiek: concatenatie. David Malan: concatenatie. So C het nie eens hierdie. PHP het die dot-operateur, wat dit doen. JavaScript het die plus-operateur, wat verwarrend is net soos Java. Nou wat gaan hier aan? 

So hier is waar 'n basiese begrip van die foto Ons gooi 'n paar dae gelede kom in die spel. Onthou wanneer ons 'n eenvoudige weergawe van 'n HTML page-- dit het net gesê, hello wêreld. En dan het ons 'n boom het aan die regterkant, wat het 'n klomp van die reghoeke en lyne verbind hulle soos 'n stamboom. So wat is die sogenaamde DOM of Document Object Model. En dit blyk dat jy kan toegang reghoeke in die boom met sintaksis soos die volgende. Jy sê letterlik dokument, wat 'n spesiale globale veranderlike in 'n JavaScript program wat 'n funksie wat verband hou met dit wat jy kan toegang soortgelyk aan 'n struct, maar jy eenvoudig sê dot en dan die funksie se naam, kry element deur ID. 

Die element wat ek wil kry, is blykbaar haal unquote naam. En dan wil ek die waarde daarvan te kry. Nou kan ons onsself voor om. Ek is nie eens seker wat dit alles is oor. Kom ons vinnig uit na die HTML op die bladsy, wat is super eenvoudig. 

Kennis dat ek gedefinieer 'n vorm hier. KENNISGEWING Ek het dit gegee om 'n unieke ID, selfs al het ons nie gebruik hierdie kenmerk nie. Maar dit bestaan ​​in HTML. Jy kan uniek paar stuk identifiseer van HTML met 'n identifikasie soos hierdie. 

Kennis nou this-- blyk HTML ondersteun, per dat wasgoed lys 'n oomblik gelede, 'n hele n klomp van die event handlers. En hierdie gebeurtenis hanteerder sê op dien. Op die gebruiker voorlegging van hierdie vorm, bel die volgende kode. En die kode wat gaan genoem word of uitgevoer word is presies dit, die Griekse funksie gevolg deur terugkeer vals. Alles anders moet redelik bekend is. 

Hier is 'n invoer van die tipe teks, wie se ID, in hierdie geval, gaan die naam wees. Ons het nie 'n werklike naam kenmerk nie hierdie time-- en 'n stuur-knoppie. So die bladsy lyk. En die gevolglike gedrag, Jy sal sien, lyk soos volg. Die bladsy is dit die plaaslike gasheer sê, hello David, skaars 'n mooi, manier om 'n gebruiker te groet. Maar wat eintlik aan die gang? 

Wel, kyk wat dit is. Dit is 'n teks veld. En volgens die HTML hier, het ek dit gegee om 'n unieke identifikasie genoem quote unquote naam. Intussen, het ek gesê toe die gebruiker tik hierdie vorm deur slaan Tik of klik op die Stuur knoppie, skakel die funksie genoem Groet en dan terug Vals. Kom ons kyk na wat in trurat. Sien wanneer ek klik op stuur, die URL van die bladsy verander nie. Ikoon om die leser se het nie begin draai. Ek het nie iewers heen te gaan, en dit is letterlik, want ek het gesê terugkeer Vals. Terug Vals kortsluitings of stop die verstek gedrag van 'n vorm. Sodat dan laat ons met hierdie een laaste vraag. Wat beteken Groet doen? Wel, Groet glo noem 'n funksie genoem Alert, gaan in een lang argument wat die gevolg van concatenating saam om 'n n klomp van die substrings, hello komma ruimte, dan wat hierdie terugkeer. So dokument is soos 'n globale veranderlike wat die wortel van die boom, roep 'n spesiale funksie, anders nou bekend as 'n metode. 'N funksie wat binnekant van 'n veranderlike is bekend as 'n metode in plaas van 'n funksie. 

So kry element deur ID. Wat element doen jy wil te kry deur sy ID? Haal unquote naam en dan spesifiek waardeer. So met ander woorde, wat die kode eenvoudig bevind dat die teks veld wie ID is die naam en dan kry sy waarde. So as ek dit te verander en sê Davin plaas van Dawid, en klik op stuur, nou is ons 'n groet vir Davin. 

Alle reg, sodat alles goed en wel. Maar laat ons kyk of ons kan maak dit 'n bietjie skoner aangesien net kode skryf soos dit is algemeen gaan frons word op. Dit gaan lyk vreesaanjaend. Maar wat is die eerste verskil wat jy hier kennis in hierdie weergawe, behalwe die naam verander in DOM een? Wat struktureel anders lyk oor hierdie teenoor die ander? Ja? Publiek: Is die vorm op top van die script nou? David Malan: Ja, die vorm is op die top van die script vir 'n paar snaakse rede. So wat is die eerste ding wat wat spring uit by my ook. En gelukkig ten minste, hierdie deel is identies. Dus is die enigste ding wat lyk om anders te wees is dit. 

So hier is wat netjies oor JavaScript 2. En dit maak dit moeilik om te verstaan ​​met die eerste oogopslag, veral vir finale projekte indien jy kyk na voorbeeld kode online, maar dit kom neer op 'n paar basiese sintaktiese funksies. Hier is weer eens dat globale veranderlike dokument. Hier is weer daardie metode of funksie wat sê jy die element deur ID. Hierdie keer het ek wil kry die ID genoem demo. Waar is dit? Dit is blykbaar reg Hier is die vorm self. 

En nou sien dat glo as ek terug te kry wat knoop van die boom wat verteenwoordig die vorm self, nie 'n teks veld, dit blyk dat vorm, wat knoop of reghoek van die boom, het wat ons sal 'n eiendom noem, baie, baie, baie soortgelyk in die gees van 'n struct in C. Dis net 'n lid data binnekant van die reghoek. 

So ek het die vorm hier, en ek heg, of ek toeken, sy op submit hanteerder of eerder op Stuur eiendom die volgende funksie. En dit is by verre die gekste ding tot dusver sintakties. Dit blyk in JavaScript en in PHP, en eerlik vir die saak in C, selfs al het ons dit nie doen nie, kan jy voeg naamlose, anonieme, of AKA lambda funksies wat nie 'n naam maar kan tog genoem word. 

So wat ek hier doen, is ek toeken hierdie On Stuur eiendom, wat is die binnekant van die node van my DOM boom, 'n funksie, funksie wyser as jy wil. Dit funksie het geen noem, maar dit beteken nie saak nie, want ons sal sien in 'n oomblik hoe om dit te noem. Wanneer hierdie funksie geroep word, hierdie kode sal uitgevoer word, dan valse teruggestuur, net soos voorheen. 

Maar let op wat ek gedoen het. Op hierdie punt in die storie, ek het 'n vorm. Dit het 'n unieke ID genoem demo. Hier het ek 'n script tag wat voer die volgende kode. Dit heg aan daardie knoop in die boom is dit op submit eiendom om hierdie funksie hier. En net uit die aard van hoe blaaiers werk, toe ek kliek nou dien of druk Enter, daardie funksie gaan genoem te raak. Dit maak nie 'n naam, want wat dit nodig het die klink omgee wat dit genoem. Die enigste keer dat dit ooit gaan kry genoem is toe ek stuur die vorm. Daar is geen rede vir my, die menslike ontwikkelaar, eintlik noem dit elders. 

Nou net as 'n teaser, asof dit nie omgee buig genoeg, Ons kan selfs maak hierdie lyk meer kriptiese behulp 'n super gewilde biblioteek genoem jQuery. In werklikheid jQuery en JavaScript dikwels conflated. En wat ons gaan doen op Woensdag is begin die gebruik van hierdie taal en die biblioteke toenemend asynchrone te bou en dinamiese programme soos kaart kry aansoeke, aansoeke dat die webblad in die werklike werk tyd, baie soos Facebook of Gchat doen, en nie meer beperk om onsself te slaan Stuur 'n get of net post alleen. So ek sal jy sien op Woensdag. 

[Speel van musiek]