>> DAVID MALAN: Greit.
Dette er CS50, og dette er utgangen av uke ni.
Det har vært en virvelvind i løpet de siste dagene.
Og problemet satt sju, hvis du er kneet dypt inn i det, skjønner det er litt av en
litt nytt som er der inne.
Men la oss se om vi ikke kan sette alt sammen her kort
før da oppbygning av i ennå en annen retning og seeing
hvor ellers vi kan gå.
>> Så så langt, har vi snakket om HTML.
Vi har snakket om CSS.
Vi har snakket om PHP.
Du har begynt å oppleve SQL.
I dag skal vi snakke litt om Javascript.
Men hvordan gjør alle disse uensartede språk passer sammen?
>> Så vi snakket i forrige uke om oppfatningen av å ha en server.
Så la oss bare tegne dette rektangelet som en web server her.
Og en web server serverer sikkert filer.
Og noen av disse filene kan være HTML-filer.
Så en av de tingene som en web-server kan spytte ut kan være en fil som
vi vil bare tegne som dette inneholder noen HTML.
Så i lekmann vilkår, hva betyr HTML lar deg gjøre?
>> PUBLIKUM: Page look fint.
>> DAVID MALAN: OK, lage en side ser fin, selv om jeg tror jeg har bevist
som ellers.
Så HTML lar deg legge ut sider strukturelt, og det gjør at du kan
slags estetisk markere opp en side, merke opp statisk innhold, slik at du
Deretter kan du se det med en nettleser.
>> Men det er nøkkelen.
Det er statisk innhold.
Du skriver det, lagrer du det, og deretter sende den.
Og webserveren deretter serverer det opp til de besøkende.
>> Men vi stilisere ting ved hjelp av en annen language helt.
Vi begynte å bruke en stil attributt på noen tagger.
Og stilen attributtet la oss sette ting som skriftstørrelse og farge.
Og du har sikkert begynt å oppdage, eller du snart vil for endelig
prosjekter potensielt, men likevel andre egenskaper som du kan bruke i CSS.
Og så i lekmann vilkår, hva egentlig så gjør CSS gjøre?
De er bare eksempler av disse.
Hva betyr det at du kan gjøre det HTML ser ikke ut til fra hva
vi har sett så langt?
>> PUBLIKUM: Definer stiler selv.
>> DAVID MALAN: Definer stiler selv.
Så definere ting som klasser som du kan ha oppstått, eller unikt
identifisere noder i et dokument slik at at du kan stilisere dem.
Men mer spesifikt, vil jeg si at CSS virkelig lar deg ta ting på
siste mil og lar deg spesifisere mye mer presist estetikk,
mens HTML for det meste lar du strukturere sidene dine.
>> Og selv om det er noen standard, som vi så tag for
en overskrift tag, som grovt sett gjort ting stor og fet.
Det er en ganske generisk definisjon av koden - stor og fet.
Hva skriftstørrelsen er det?
Hvilken farge er det?
Hvor fet er det?
Og CSS lar deg finere tune sånne ting.
I tillegg til layouten, som noen av dere har sett.
>> Og ærlig talt, er CSS litt av et rotete språk.
Det er veldig kraftig i at du kan gjøre bokstavelig talt hvilken som helst nettside som du har
sett på nettet i dag med det, men det er litt vondt i halsen.
Og noen av dere har slo hodet mot veggene som allerede er bare for å gjøre
noe dumt som sentrum en meny på Problemet satt syv hvis du har fått til
det punktet allerede.
>> Men skjønner, disse tingene bli lettere over tid.
Du begynner å legge merke til mønstre.
Og igjen, vil Google være din venn for de ulike måtene du kan
løse slike problemer.
>> Og jeg tør si med CSS og HTML mer generelt, kan du løse problemer i
mange flere måter, som alle kan meget godt være riktig, enn du kunne
i noe sånt som C, selv nå PHP, eller Javascript.
Det er bare mange forskjellige måter å legge ut ting.
>> Men dette begynte å bli rotete, sa vi.
Bare slags commingling HTML og CSS med stil attributt var
litt slurvete.
Og så vi i stedet sa, liksom abstrakt sett, at du bør
i det minste begynner å faktor ut din CSS sannsynligvis.
Ikke din stil attributter, men minst bruke stilen tag inni hva
del av web-side?
>> PUBLIKUM: Head.
>> DAVID MALAN: I hodet.
Frem til nå, vi bare hadde tittelen opp der, men du kan også legge til en stil
merke, og som du kan sette din CSS grovt snakker mot toppen av siden.
Men da vi tok ting et skritt videre og vi priset det ut mer
inn i en egen fil.
>> Og så disse to filene var en eller annen måte tilknyttet hverandre.
Og det var faktisk den kode som gjorde det.
Og hva var ett av de overordnede motivasjon for factoring ut våre CSS
alle mer?
>> PUBLIKUM: Gjenbruk.
>> DAVID MALAN: Reusability.
Høyre?
Du har kanskje sett i p-set syv allerede at mange av sidene, den
kjøpe side, salgssiden, portefølje side, er trolig
strukturert noe lignende.
Det er en CS50 finans logoen øverst med mindre du har bestemt deg for å endre det.
Det er en bunntekst på nederst på sidene.
Og CSS kan du deretter å faktor det ut det inn i en egen fil, slik at hvis
du ønsker å endre noe globalt over hele området, kan du virkelig
bare endre det på ett sted.
>> Men det er en pris du betaler potensielt etter å ha priset ut
CSS fra min HTML-fil i et eget filreferanser det med
tag, som vi så på mandag.
Hva kan nedsiden være på dette?
Tenker tilbake en uke siden til når vi er snakker om HTTP og TCP / IP og hvordan
Internett fungerer.
Noe over her?
>> PUBLIKUM: Det tar mer tid.
>> DAVID MALAN: Det tar mer tid.
Hvorfor?
>> PUBLIKUM: [uhørbart].
>> DAVID MALAN: Yeah.
Så det kanskje tar litt mer tid.
Fordi en, er CSS åpenbart ikke er i den samme filen.
Så nå må du gjøre ikke en, men to forespørsler.
Og hver av disse forespørslene som vi så i Chrome i den såkalte Inspector,
og vi så på fanen nettverk, hver av disse filene krever en HTTP
forespørsel, som vi så tar noen mengde tid.
Nå er det kanskje ikke mye.
Kanskje det er bare 20 millisekunder.
Kanskje det er 200 millisekunder.
>> Men tenk om en side som Facebook, eller CNN, eller Google, som er mye
større enn eksemplene vi ve sett på så langt.
Disse sidene kan ha dusinvis av filer, hvor hver av disse kan kreve en
nedlasting av en fil.
Så ting kan potensielt begynner å avta.
>> Og spesielt i disse dager da vi alle har mobiltelefoner i våre lommer og
tregere internettforbindelse, måtte vente noen millisekunder, noen
flere millisekunder for ytterligere filer kan faktisk være treg.
Ventetid er ordet som beskriver den slags venter på at du har det du
oppleve når du venter på noen del av informasjonen.
>> Men det er en oppside.
Så det er ikke alle slags -
det faktisk er litt av en seesaw her.
Ulemper nå, men hva nettlesere kan gjøre hvis de er smart for å unngå
å måtte be om det samme styles.css fil igjen kan være å gjøre hva?
>> Cache det.
Så caching -
C-A-C-H-E -
betyr vanligvis her bare for å redde fil du har bedt om det første gang, og
så sjekk bufferen for det.
Sjekk at du er liksom beholderen, og hvis du allerede har en
kopi av styles.css, selv om en annen side i p-set, eller hvilken som helst nettside,
ber om det igjen, bare for å gi den bruker den samme bufret kopi.
Ikke bry ber om det.
>> Ulemper det, skjønt, som noen av dere har snublet over på p-settet.
Hvis du gjør en endring på serveren og du gå tilbake til nettleseren, og du
reload, noen ganger nettleseren gjør deg en tjeneste og ikke bry
re-laste ned din styles.css fil fordi, kom igjen, hva er oddsen
at disse stilene som Facebook bruker kommer til å endre time til time eller
dag til dag?
Det er ganske lav.
De kan endre seg over tid, men ikke ved minutt eller per time.
>> Så et triks, bare så dere vet det når du gjør web utvikling, er ofte holder nede
skift-tasten for eksempel, og klikk deretter oppdater i nettleseren din, og at viljen
vanligvis fortelle leseren reload alt, selv om du allerede har
det i cachen.
Så igjen, oppsider og ulemper, men alle
slutt utforme beslutninger.
>> Så nå, gjorde vi ikke bare avslutte historien her.
Hvis jeg nå gå tilbake og tilbake og tilbake og tilbake, begynte vi å introdusere ikke bare
HTML, men PHP.
Så i lekmann vilkår, hva PHP ikke la oss gjøre?
>> PUBLIKUM: [uhørbart].
>> DAVID MALAN: Hva er det?
>> PUBLIKUM: Introduser logikk inn i koden.
>> DAVID MALAN: Yeah, introdusere logikken i koden din.
Så det er en sann programmeringsspråk med looper, og variabler, og
funksjoner og betingelser, og alle de tingene vi har fått hjelp vei tilbake
når siden scratch.
Og PHP, vi har sett, kan brukes enten på kommandolinjen - det
trenger ikke å ha noe å gjøre med web, selv om det er
egentlig sin opprinnelse og hva det har en tendens å være god på og bidrar til -
men du kan bruke PHP bare av natur av det faktum at den har et print ()
funksjon, og en printf ()-funksjonen, eller et ekko ()-funksjonen.
Det er bunter av måter du kan skrive ut tekst med PHP.
>> Derfor kan du bruke denne programmer språk til utgang nøyaktig
hva vi snakket om før.
Du kan dynamisk generere HTML.
Kanskje ikke alle av det.
Kanskje du hardkode ting, som header, og bunntekst, og logoen,
og dine stilark og alt dette.
Men for noe sånt som p-set syv, Ønsker du å manipulere bestandene og
viser brukerens portefølje, som er kommer til å dynamisk endre, kan du
sikkert bruke PHP og logikken det gir du som programmeringsspråk for å
utgang dynamisk undergrupper på siden.
>> Så når du snakker om dynamiske websider, eller web-programmering, det er
hva du egentlig snakker om.
Ved hjelp av et språk som PHP, eller ting heter Python eller Ruby, eller Java, eller
ennå andre språk, å spørre en database ofte, eller en annen server, og
så dynamisk spytte ut HTML.
>> Nå sluttresultatet, som en side, er at HTML av de fleste nettsteder,
inkludert p-satt syv, er trolig kommer til å bli et stort rot hvis
du ser på kilden kode i en nettleser.
Det er ikke en stor avtale.
På dette punktet, når vi bryr oss om stil, vi bryr oss om
ting som du skriver.
Vi vil ikke bry seg om ting at hva koden din utganger.
Så ikke bekymre deg for innrykk her hvis det er PHP som er
faktisk gi ut ting.
Tross alt, vil nettleseren ikke bryr seg, og en human vil ikke bli ute
ved kilden uansett.
Vi ansatte, for eksempel, ville være å se på din PHP.
>> Så la meg gi et raskt eksempel nå av hvorfor ellers dette kan være nyttig.
Så ærlig, jeg kan ikke huske sist gang jeg brukte C for å løse et problem i
den virkelige verden.
Det var trolig i gradsstudier når Jeg trengte å bruke et språk som
var ganske lavt nivå og ga meg mulighet til å gjøre noe veldig høyt
utfører å virkelig redde så mange CPU sykluser som jeg kunne, i stor grad
fordi jeg brukte store datasett, og hver CPU syklus telles.
Og ærlig talt, selv i ting som telefoner i disse dager og andre enheter
der du ikke helt har så mye minne og du ikke helt har som
mye CPU, hjelp raskere språk er fortsatt attraktivt.
>> Men i den virkelige verden, når du bare ønsker å kaste noe program sammen for å
analysere noen data, eller du har samlet en hel haug med registreringer for
noen studentgruppe og du vil veldig raskt automatisere sende e-post
en etter en til hver og en av dem registranter, du kommer til å strekke seg etter
et høyere nivå språk enn C så å si.
Noe som PHP eller Python, eller Ruby, eller et halvt dusin andre som eksisterer
disse dager.
Men de tre er trolig det mest trendy akkurat nå.
>> Og hva dette betyr er at du kan åpne opp en tekst editor som gedit eller
de fleste noe annet, og så bare begynne skrive kode uten å måtte bekymre seg
om kompilering, uten å måtte virkelig bekymre minnehåndtering,
husk skjønt at litt slurv vil etter hvert komme tilbake
til å bite deg hvis datasettet blir større eller problemet blir stort.
Men hva dette betyr for oss er følgende.
>> La meg gå videre og kjøre stavekontroll fra problem satt seks.
Så dette er min trie-basert gjennomføring som jeg brukte på den store
bord hvor jeg spilte ikke så godt.
Vi vil komme tilbake i en ukes tid og revidere de som ender opp på toppen av
stort bord på vår siste forelesning.
Men for nå, la meg gå videre og bare kjøre min løsning i teksten, og vi vil gjøre
King James Bible, og her vi går.
>> Så de er alle av den antatte feilstavede ord ut av
King James Bible.
Og min gjennomføringen tok et halvt sekund totalt.
Så ikke så ille på dette bestemt datamaskin.
Men tenk på hvor mye kode jeg måtte skrive.
Tenk hvor mye kode du måtte skrive.
Tenk hvor mange timer du har brukt i D-hall eller sovesal eller hvor
faktisk koding opp den løsningen.
>> Vel, hvis jeg faktisk har et høyere nivå språk som PHP, legg merke til
hva jeg kan gjøre her.
Først anta at dette er stedet distribusjonen din kode.
Dette er en fil som heter stavekontroll.
Den er tilgjengelig som en del av dagens fordeling kode.
Og jeg kommer til å vinke min hånd på de fleste av detaljene, men dette er faktisk
et interessant eksempel på hvordan du kan portere et språk
som C over til PHP.
Jeg bokstavelig talt åpnet to tekst vinduer, ett med min C-versjonen av speller.c,
og jeg bare begynte å oversette det i min hodet til PHP og skrive den ut ved hjelp
de nærmeste tilsvarende funksjoner.
>> Så noen av disse tingene er forskjellige.
Vi så sist gang at PHP ikke bruker inkludere i helt samme måte.
Den bruker krever vanligvis, selv om inkludere eksisterer.
Definer er litt forskjellig fra # Define i C, men det er
hvordan vi lager en konstant.
$ Argc det viser seg eksisterer i PHP, så vi har sett det før.
Disse er bare variabler, som alle som starter med dollartegn.
Recall dette er bare en gjeng av flytende poeng.
>> Så lang historie kort, du er velkommen til bla gjennom dette hvis nysgjerrig, er dette
nesten en linje-for-linje omdannelse av C-versjonen av speller.c i PHP.
Og du kan gjøre dette igjen for et halvt dusin andre språk.
>> Men det som er interessant er dette.
Eller hva er ærlig nedslående er dette.
La meg gå videre og skrive om dictionary.php, og hevder at jeg er
kommer til å gå videre og re-implementere Problemet satt seks her.
>> Så la oss foreslå første at i denne fil, som vil bli implementert i
PHP, så la meg åpne mine koder sånn.
La meg gi meg selv en global variable, får $ size zero.
Og jeg kommer til å gi meg selv en hash table.
Jeg skal bruke en hash tabell for denne tingen.
Hvordan erklærer jeg en hash table i PHP?
Ferdig.
OK.
>> Så åpen brakett tett brakett representerer hva i PHP, som vi har sett?
En matrise, men en matrise som kunne være en assosiativ array.
En assosiativ array er en datastruktur som
tilknyttede taster med verdier.
>> Nå i den enkleste numerisk indeksert array, disse nøklene er hva?
Null, én, to, tre, ikke sant?
Old school ting tilbake fra C. Men det kan også være strenger som foo og bar,
eller Maxwell, eller en hvilken som helst slik streng.
Slik at jeg kan utnytte at på bare et øyeblikk.
>> La meg gå videre og erklære en funksjon som -
la oss gjøre load () først.
Så funksjon belastning ().
Og PHP er litt annerledes ved at du bokstavelig talt skriver funksjon, men du
ikke skriv en retur type.
Jeg kommer til å gå foran og si at belastning ()-funksjonen bør ta i
argument $ ordbok, akkurat som C-versjonen gjorde.
Jeg gjør det fra hukommelsen.
>> Og jeg foreslår at jeg er kommer til å gjøre dette.
Jeg er rett og slett kommer til å gjøre foreach.
Jeg kommer til å kalle en funksjon kalt filen (), passerer i navnet at
fil, er der variabelen $ Ordbok som $ ord.
Og så innsiden av min for loop her, jeg kommer til å gå videre og lagre i min
$ Tabell som $ ordet kommer sant.
Ferdig.
Oh, vent.
Ferdig.
OK.
>> Det vil si at lasten ()-funksjonen si i PHP.
Nå, hvorfor det fungerer?
Og jeg er litt juks her.
>> Så, ett, foreach vi så kort sist.
Det betyr bare at du kan iterere over en matrise uten å bry seg med i
og n og pluss pluss, og alt det.
Ordbok er selvfølgelig filnavnet, noe som er store eller små, de to
ordbøker vi brukte forrige gang.
Filen er en funksjon som åpner opp tekst file, leser den i linje for linje, og
hender deg tilbake et stort utvalg, hver av med elementer som er en
linje fra den filen.
Så det er kombinasjonen av fopen, og fread, og mens loop, og fclose,
og alt dette.
Til slutt, som ordet betyr bare det er variable Jeg kommer til å ha tilgang til
på hver iterasjon i denne sløyfen.
>> Så kort sagt, dette en liner her betyr åpne opp filen hvis navn er i
ordbok, variabelen, iterere over det linje for linje, og hver gang du får
en linje, lagre i en variabel kalt ord, og deretter gjøre noe med ord.
Hva ønsker jeg å gjøre?
Jeg ønsker å sette ord i min hash table.
>> Vel, jeg kan sette noe i min hash table akkurat som i C
ved hjelp av hakeparenteser.
Dette er navnet på min hash table.
Jeg kommer til å indeksen inn at hasj bord på dette stedet.
Så ikke braketten null, ikke beslaget et.
Bracket quote unquote noe, hva det ordet er.
Og akkurat som du kan ha i din hash table arbeid trie, du bare butikken
effektivt en boolsk, implisitt eller eksplisitt.
Ferdig.
Jeg lagrer verdien true.
>> Nå er det et par ting Jeg kutter hjørner på her.
Teknisk sett, kommer det til å være en irriterende ny linje, / n, på slutten av
hvert av disse ord.
Så jeg bør nok ringe en PHP-funksjon kalt chop (), som vil
helt bokstavelig hugge det av.
Og jeg faktisk trenger å gjør en annen ting.
Jeg bør nok øke størrelsen på hver iterasjon, så jeg holder styr
globalt av hva det er.
Og ærlig talt, og dette er en av de dummere aspekter av PHP, hvis du er
ved hjelp av en global variabel, må du å eksplisitt si at du er.
Så jeg kommer til å faktisk skrive i global $ Størrelse, global $ tabellen, og nå
min funksjon er fullført.
>> Så ikke fullt så enkelt som før, men sannsynligvis tok mindre tid enn C
versjon, kanskje?
OK.
>> Så nå la oss gjøre sjekken ()-funksjonen.
La oss se om dette i det minste tok timevis at det tok oss i C. Så
la meg gå videre og erklære sjekk som en funksjon.
Tar i argumentet ord, som er kommer til å komme fra stavekontroll.
Og jeg skal bare sjekke om Følgende variable isset, bord
brakett strtolower av ordet -
la oss balansere alle mine parentes -
deretter returnere true.
Else -
det var virkelig hardt en del av dette program.
Else, return false.
Ferdig.
Det er sjekk ().
>> Nå, hvorfor ikke dette fungerer?
Vel, jeg gikk i et ord, som er en streng.
To, jeg sjekker innsiden av hasj tabell, som heter $ tabellen.
Jeg tvinger det til små bokstaver ved å ringe en funksjon ganske lik tolower () i
C, men dette gjør hele ordet, ikke en enkelt karakter.
Og hvis det er satt, med andre ord det er en verdisettet, med andre ord,
hvis det er sant, så ja, dette er et ord.
Fordi jeg setter det der med last ().
Og hvis ikke, kommer jeg til å returnere false.
>> Nå de andre er lette.
Funksjon størrelse (), hvordan gjør jeg dette?
Jeg hovedsak gjøre returnere $ størrelse.
Men jeg teknisk sett må gjøre dette irriterende ting.
Og faktisk opp høre, ble jeg kutte det ene hjørnet for mange.
Jeg trenger virkelig å gjøre global $ tabellen.
>> Men når det er sagt, losse).
Losse () er fantastisk.
Funksjon losse ().
Hvordan ønsker jeg å gjennomføre losse ()?
Ferdig.
OK.
>> Så losse (), er minnehåndtering helt tatt vare på for deg i
noe som PHP og mye av høyere nivå språk.
Så dette er fantastisk.
Som hvorfor i helvete gjorde vi brukt den siste åtte pluss uker på C skriving
tydeligvis veldig sakte, virkelig tid tidkrevende problemer med titalls timer
av arbeid under våre belter?
>> Vel, for en ting, dette kan fungere fint for små programmer.
Det absolutt sped opp min utviklingstid.
Men la oss se hva som skjer i den virkelige verden.
>> La meg gå inn i denne katalogen i en terminal vindu.
Det er stavekontroll.
Og legg merke til som en side, og du kan har støtt på dette i oppgavesettet
seks eller problem satt sju.
Du trenger strengt tatt ikke trenger å ende PHP-filer med. php.
Hvis du putter en linje som det første på Helt øverst, det er en spesiell linje
syntaks som i hovedsak betyr finne programmet heter PHP og bruke den til å
tolke denne filen.
Så nå er det ingen som egentlig vet at Jeg kjører et PHP program.
Jeg kan kjøre det akkurat som om det ble noe samlet i C.
>> Men her er tingen.
Egentlig, la oss gjøre dette igjen.
Dropbox/pset6 /.
Det er stavekontroll.
OK, 0,44 sekunder.
Det går raskere denne gangen.
>> Nå la oss gå inn i PHP-versjon.
Nice touch.
Men bare tenk hvor mye tid Jeg sparte på kontortid.
OK.
>> Så 3.59 sekunder, noe som faktisk høres ikke nøyaktig heller.
Men det er fordi lang historie kort, når du skriver ut et stort beløp
ting til skjermen, som selv bremser ting ned.
Hva det virkelig tok CPU i apparatet var 3,59 sekunder, i
kontrast til C, noe som tok 0.44 sekunder senest.
Det er virkelig en bestilling av magnitude annerledes.
>> Så hvor er at prisen kommer fra?
Hvorfor er det så mye tregere?
Hvorfor utfører PHP så dårlig?
Danielle?
>> PUBLIKUM: Du gjorde egentlig ikke bruke en hash table.
>> DAVID MALAN: Jeg gjorde egentlig ikke bruke en hash table.
Så jeg slags gjorde.
Så det er en assosiativ array.
Mest sannsynlig dersom personene i PHP er virkelig smart, de brukte under
hette en faktisk hash table implementert i noe sånt som C eller C + +.
Men.
Yeah.
>> PUBLIKUM: [uhørlig].
>> DAVID MALAN: Yeah.
Så hver av funksjonene jeg skrev nå - faktisk kan man si at når mer en
litt høyere?
>> PUBLIKUM: Hver av funksjonene som du inkluderte har mye mer full
kapasitet enn -
>> DAVID MALAN: Så det er veldig sant.
Det er mye mer overhead at vi er egentlig ikke se ved å fokusere bare på
dictionary.php, som jeg nettopp skrev.
Derimot, det er en hel tolk kommer i bakgrunnen.
Faktisk, når jeg kjørte dette programmet, det kjørte ikke utarbeidet nuller og enere
designet for min Intel CPU.
Snarere var det kjører linje for linje PHP-kode som ser akkurat ut
liker vi skrev den.
Og så når du bruker en tolket språk, du
faktisk må betale denne prisen.
Det kommer til å ta litt tid til å lese filen topp til bunn, fra venstre mot
høyre, og deretter utføre hver stille igjen og igjen.
>> Nå i virkeligheten, spesielt på nettet, du faktisk kan fremskynde denne prosessen
ved å mellomlagre resultatene av PHP-koden blir tolket.
Og det gir mening på nettet, fordi hvis du ikke har en bruker som
meg her, men 1000 eller 10.000 brukere, og deretter kanskje første gang filen er
vist det går sakte, men etterpå det er mye raskere.
>> Men også dette, igjen, er en trade off.
Og etter noe som en forskningsdata satt, eller noe stort som
dette, brukerne vil til slutt begynner å føle at nedgangen.
>> Så kort sagt, tolket språk er veldig mye på moten, veldig populært, og
ærlig er trolig de språkene du bør strekke seg etter når løse problemer
Etter CS50.
Men innser hvor mye du er virkelig tar for gitt under panseret
egentlig de siste ukene i hash tabeller, og trær, og prøver,
som blir brukt til slutt til faktisk implementere ting som åpen brakett,
hakeparentes, som vi kan nå takknemlig tar for gitt.
>> Så la oss ta en titt nå i denne web sammenheng.
Og jeg nevnte forrige gang at det er en haug med superglobals i PHP som
er egentlig ikke relevant på kommandolinjen.
De er mer relevant i sammenheng for å bruke PHP i en web-sammenheng.
Så kjører PHP på en web server for å generere ting som HTML.
>> Og vi kikket på $ _GET og $ _POST, og det er der automatisk brukernes
innspill ender opp bare hvis du sender en danne til en fil som slutter på. php på en nettside
server som apparatet.
Men la oss se litt på $ _COOKIE Og $ _SESSION.
>> I lekmann vilkår, er hva en cookie som du forstår det i sammenheng med
ved hjelp av web?
>> PUBLIKUM: File på datamaskinen.
>> DAVID MALAN: Yeah.
Det er en fil på brukerens datamaskin plantet av hva nettstedet
du kommer til å besøke.
Så når du går til Facebook, når du går til bankofamerica.com, når du går
til google.com, når du går til nesten alle nettsiden i verden i disse dager,
inkludert cs50.net, er en cookie plantet på datamaskinen, er som
enten en verdi som er lagret i RAM i din datamaskin i nettleserens minne, eller
noen ganger faktisk en fil lagret på harddisken.
>> Og hva som er typisk lagret i denne filen er ikke ditt brukernavn, ikke din
passord, vanligvis ikke noe sensitive mindre nettstedet er ikke så
bra med deres sikkerhet, men heller det er en stor unik identifikator blant
andre ting.
Det er en stor tilfeldig nummer plantet på datamaskinen, men du kan tenke på som
liksom en virtuell hånd stempel som fra en klubb eller noen fornøyelsespark som
lar de ansatte, eierne av at service, å huske hvem du er.
Så hvis det store tilfeldige tall er som 12345678, selv om det er åpenbart
ikke så tilfeldig, tenk på at etter hvert som hånd stempel som når du besøker
facebook.com for første gang, de stemple det nummeret på hånden din.
Og da fordi du snakker HTTP, du å være en nettleser, og fordi Facebook
åpenbart snakker samme som en web server, sier protokollen HTTP at
når du senere gå facebook.com, enten det er en andre
senere, en time senere, selv neste dag, så lenge du har ikke eksplisitt
logget ut, som effektivt er som å vaske hendene.
HTTP sier at du bør presentere din hånd-stempel hver gang du
tilbake til det nettstedet.
>> Hva Facebook da gjør er at de se på den hånden stempel og
de sier, oh, 123456789.
Jeg vet ikke ved første øyekast at dette er David Malan i Cambridge,
Massachusetts, men de kan sjekke deres database og si, oh, den personen
på hvis datamaskinen plantet vi 123456789 er David Malan fra Cambridge,
Massachusetts.
La oss vise at brukeren deretter sin profil side eller hans News Feed.
>> Men det er et problem her hvis dette er hvordan nettet faktisk fungerer.
La oss ta en titt på en rask eksempel.
La oss faktisk gå å si facebook.com.
Men før vi kunne gå dit, la meg gå videre og åpne opp Chrome
Inspektør ned her.
La meg se på fanen nettverk.
Og nå la oss gå videre og skriver i https://facebook.com.
Og jeg gjør det slik at vi ikke ser alle disse viderekoblinger og avfall
tid på å se gjennom dem.
La meg trykk enter.
>> OK.
Vi ser en hel haug med forespørsler.
Det kommer Facebook.
Det er en hel haug med filer.
Og her, per min omtale av latency siste gang, det er
mye av HTTP-forespørsler.
Men den første er trolig den mest interessante.
>> Så la oss bla nedover her, og Jeg vil zoome inn på et sekund.
Dette kommer til å være slags et rot, men la oss se.
Facebook er å sende oss en hel haug med ting.
>> Men whoa, interessant.
De er å plante ikke bare én, men fire hånd frimerker på min hånd her.
Set-cookie, Set-cookie, set-cookie, set-cookie.
Og er det noen funksjoner her.
Alle av dem nevne noen slags utløp.
Og det ser ut som Facebook er håp å huske meg før 2015.
Så det er antagelig den tiden der Jeg må logge ut, eller de vil bare
automatisk anta jeg er ikke kommer tilbake.
Så det er faktisk en anstendig tidsperiode.
>> Og er det noen andre ting som skjer her.
Denne informasjonskapselen ser ut til å være tvangs slettes ved å si det utløpt i 1970
før cookies eksisterte.
Så nettleser er bare kommer å anta OK, er sånn
vaske hendene stempel.
>> Men nå når nettleseren min gjør en etterfølgende forespørsel -
la meg gå videre og gjøre dette igjen og reload.
Nå la meg bla tilbake til topp forespørsel og gå ned
her, be om overskrifter.
Legg merke til dette.
Så nå jeg er under ikke respons overskrifter, men merker det sier forespørselshodene.
Og legg merke til at nettleseren min som en del av sin forespørsel etter trykket reload har
sendes i det minste følgende informasjon.
Ikke sett-cookie, men cookie.
Så dette er linjen, HTTP header så å snakke, der nettleseren min er liksom
av uten at jeg vet det presentere min hånd for Facebooks inspeksjon.
>> Så disse informasjonskapslene kan være brukes deretter for hva?
Å huske hvem du er, eller huske hvordan mange ganger du har vært der, eller
virkelig noe.
>> Så her er counter.php.
Og la meg zoome inn på skriften.
Og hver gang jeg laster denne siden, varsel det er å huske hvor mange ganger
Jeg har vært der.
Vel, det er ikke alle som imponerende.
La oss bare lukke den fanen, og nå la oss gå tilbake til
http://localhost/counter.php.
>> Å, det er interessant.
Det fortsatt husket, selv om jeg lukket fanen.
Og ærlig talt, hvis jeg lukker nettleseren, hvis implementert på riktig måte, jeg
kan fortsatt huske at denne brukeren er hvem han eller hun var den første gangen, og
bare en gang jeg går inn i Chrome-menyen, som over her er her, og gå til
Historie, og klikk Fjern søkedata som noen av dere kan ha i
siste, først da vil dine cookies faktisk bli slettet i løpet av web
utvikling.
>> Så, hvis vi går -
La oss lukke opp gedit her.
Og hvis vi går nå til denne filen.
La meg gå inn i vår vhosts / localhost / public, og la meg gjøre
counter.php.
Legg merke til at dette er en ganske enkelt program.
Det er en ganske enkel nettside.
>> Så toppen av filen er bare kommentarer.
Men her er en ny linje som du kan har sett allerede i p-set syv,
session_start ().
Dette er en linje av PHP-kode som hovedsak forteller webserveren, gjør
Husk å stemple hender og gjøre Husk å sjekke hånd frimerker.
Det er alt som linjen gjør, og det gjør alt for at prosessen for oss.
Da merker jeg har nettopp fått to grener her.
Hvis disken nøkkelen innsiden av dette spesiell global variabel kalt
$ _SESSION Er satt - med andre ord, hvis det er noen verdi der -
la oss få det og lagre det i en lokal variabel kalt $ teller.
Else, la oss tildele $ teller standardverdien på 0.
>> Nå her er ett aspekt av PHP som er både en velsignelse og en forbannelse.
PHP er litt slurvete.
Så mens i C, hva ville det Omfanget av disken har vært
enten her eller her?
>> Det ville ha vært begrenset til disse klammeparentes.
Gjett hva?
I PHP, finnes det også utenfor de klammeparentes, her, og her,
og her, og her, og selv ned nedenfor.
Så jeg sier dette er en velsignelse i den forstand at du ikke trenger å tenke som
hardt som vi gjorde uker siden.
Men det er også litt av en forbannelse i den uansett hvor du bruker en variabel i
PHP, i hvert fall i et program som dette, det er globalt tilgjengelig for
bedre eller verre.
Så du må huske på nå som variablene kan ikke være udefinert.
Du har kanskje definert dem andre steder.
>> Men hva skal jeg gjøre slutt?
Jeg kommer til å lagre innsiden av det globale variabel som en verdi av
Counter et resultat av gjør teller pluss en.
Så dette er bare den aritmetiske som gjør
incrementation av at telleren.
Og det faktum at jeg er lagring som verdi tilbake i her er betyr å
hovedsak oppdatere databasen til Husk at bruker 123456789 har vært
her to ganger.
Og når jeg gjør det igjen neste gang jeg oppdater siden, kommer det til å sjekke
min hånd stempel og si, oh, bruker 123456789 har nå
vært her tre ganger.
>> Og så hva PHP og lignende språk gjør for oss er at de er å finne
ut hvordan og hvor og hvor lenge å lagre verdier i denne spesielle
superglobal.
Og dette superglobal neste gang jeg besøke siden er liksom magisk
forhåndsutfylt, fylt med verdier som var der forrige gang du besøkte,
om det var en andre siden, en uke siden, eller i 2013, og vi snakker nå
ca 2015.
PHP og webserveren ta vare av alt dette for deg.
>> PUBLIKUM: [uhørlig].
>> DAVID MALAN: Variabler i PHP er egentlig alltid global mindre du
erklære dem inne i en funksjon, og da de er lokale for
funksjonen bare.
Men fordi jeg ikke har skrevet noen funksjoner, er de nå effektivt
global hele mitt hele fil her.
>> PUBLIKUM: Er det en måte for å gjøre dem lokalt?
>> DAVID MALAN: Er det noen måte å gjøre dem lokalt?
Bare ved å pakke dem inn i funksjoner.
Som i den nyeste versjonen av PHP, kan du gjøre dette med
en anonym funksjon.
Men mer om det i sammenheng med JavaScript.
Men det korte svaret er nei.
En lengre svaret er ja.
Nice.
Bra quiz spørsmål.
OK.
>> Så til slutt, er selve siden faktisk ganske enkelt.
Legg merke til at når jeg går ut av PHP-modus, husker at alt dette ting ned
Nedenfor er bare kommer til å få spytte ut rå til nettleseren.
Som er greit, fordi jeg ønsker å sende brukeren litt HTML, men jeg ønsker ikke
å dynamisk oppdatere som HTML.
Og en måte jeg kan gjøre dette på er å sortere av svært raskt falle tilbake i PHP
modus og bruk av åpen brakett spørsmålstegn likhetstegn, og deretter utgang verdien
av disken.
>> Eller hvis dette ser litt kryptisk, dette likhetstegnet er faktisk bare noen
syntaktisk sukker for dette printf ($ teller).
Men ærlig talt, det er bare litt stygg og litt irriterende å skrive.
Så PHP meget pent tilbyr denne funksjonen hvor du kan bare si det mer
konsist på samme måte.
>> Så hva som skjer under panseret?
La oss raskt se på nettverket tab her for counter.php.
Og la meg gå videre og første la oss slette informasjonskapslene.
La oss klare logg siden begynnelsen av tid.
Nå la oss gå tilbake hit.
Nå la oss oppdater siden.
Og jeg er tilbake på null.
Fordi min hånd stempel har blitt vasket, Jeg får nå en ny cookie.
>> Faktisk hvis jeg ser på nettverket fanen og se på respons overskrifter, merker
at apparatet sender meg en cookie som heter noe
vilkårlig, men slags rimelig, PHPSESSID.
Og det er å sende meg dette virkelig stort tilfeldig tall.
Det er ikke helt et tall.
Det er ikke helt heksadesimal.
Det er en slags alfanumerisk streng, men antagelig er det tilfeldig.
Og det er hånden stempel så å taler det jeg henviser til.
>> I mellomtiden hvis jeg klikker på nytt og deretter se på denne andre linjen for min andre
forespørsel, merker nå at min forespørsel overskrifter inkluderer PHPSESSID lik denne,
ikke set-cookie, men bare cookie.
Og det er nettleseren min presentasjon av min hånd stempel.
>> Så nå som en teaser, og vi skal snakke mer om dette i en uke eller så, men
på hvilken måte gjør dette deg sårbare, Facebook-kontoen
sårbare, og andre slike kontoer sårbare?
>> PUBLIKUM: Hvis noen har en cookie.
>> DAVID MALAN: Ja, hvis noen har din cookie.
Jeg mener virkelig, mye som noen av dere kanskje har prøvd på som en klubb eller en
fornøyelsespark, hvis du prøver noe som dette for å kopiere stempel, om enn
bakover på en annen persons hånd, og så han eller hun presenterer det som
sine egne, hvis det faktisk ser identiske, 123456789, så web
Serveren er tilsynelatende bare kommer til å stoler på at brukeren er deg.
>> Og dette er faktisk en fundamental trussel som helst du bruker cookies
fordi hvis noen etterligner bare så å snakke informasjonskapselen, tallene ut hva det
er, enten ved virkelig å kopiere den ved å se på datamaskinen
og å være som, OK.
Davids cookie er JJ3JIK og så videre, og da de er smart nok til å vite
hvordan å sortere manuelt sende som cookie fra en nettleser eller fra en
program skriver de, kunne de helt logger på en nettside som deg.
Det er ikke så vanskelig å late som å være noen andre med mindre vi besøker p-set
to, som introduserte hva?
>> PUBLIKUM: Cryptography.
>> DAVID MALAN: En liten bit av kryptografi.
Enkel kryptografi, i hvert fall i standard utgave, men krypto
likevel.
mindre.
Så det viser seg hvis du krypterer alle disse overskrifter ved å bruke noe som du
kan nå vite mer fortrolig som SSL, secure socket layer, eller https:// webadresser,
så alle disse tingene vi har vært skotter på er faktisk kryptert,
noe som betyr at det er som du kan ikke lese hånd stempel.
Bare facebook.com kan, eller google.com, eller i dette tilfellet, apparatet kan
lest at hånd-stempel.
>> Tragisk skjønt, og igjen, dette er altfor hensiktsmessig med NSA ting
i det siste, er enda SSL knuselig.
Og det er faktisk ikke så vanskelig å selv knekke krypteringen.
Ikke så mye ved å knekke krypteringen, men ved å lure
leseren inn dekryptering dataene for tidlig.
Men igjen, vi vil erte deg med det før lenge.
For nå, bare være redd.
Det er tragisk slags sant.
>> OK.
Så, hvor kommer dette nå forlate oss?
Vel, la oss gjøre dette.
La oss gå videre og ta en rask teaser før vi tar en pause.
Og jeg tror vi vil somle litt lenger i dag, men vi kommer til å dykke inn
noe helt nytt og sexy, noe som vil skjerpe appetitten for enda mer.
Så det er den teaseren.
>> Så SQL, begynte vi å snakke om aldri så kort sist.
Du vil virkelig få hendene skitne med noe av det i p-set syv.
Og i lekmann vilkår, gjør SQL hva -
S-Q-L -
gjøre for deg?
Hva er det?
Yeah.
>> PUBLIKUM: lar deg få tilgang til data.
>> DAVID MALAN: Yeah.
Det lar deg få tilgang til data i en database.
Structured Query Language.
Og dette er i hovedsak en programmeringsspråk.
Det er trekk ved det som vi vil ikke engang bruke i klassen.
Men du kan effektivt definere funksjoner.
De kalles lagret prosedyrer i SQL.
Men vi vil holde det ganske enkelt og bare bruke den for noen grunnleggende operasjoner
som å velge data, sette inn data, oppdatere data, og sletting av data.
>> Og du kan egentlig tenke på en database, som en SQL-database, som bare
å være Microsoft Excel.
Fordi SQL refererer til en relasjons database, der
forhold betyr bare tabeller.
Rader og kolonner.
Så alt du kan putte i et regneark som dette eller Google Docs,
du kan sette inn i en SQL-database ved å erklære et bord.
>> Nå, hvordan kan du faktisk få tilgang denne informasjonen?
Vel, med kommandoer eller spørsmål som dette.
SELECT, INSERT, UPDATE og DELETE.
Og for det meste, de er fire eneste ingrediensene du trenger for å
gjøre noe ganske kraftig i oppgavesettet syv.
>> Nå tilbake i dag, ville du faktisk samhandle med en database i en
svart og hvit terminalvindu på en blinkende meldingen som dette.
Og databasen vi kjører på Apparatet kalles MySQL, som er
gratis og åpen kildekode-databasemotor.
Hvis du Google og lese Wikipedia artikkelen, vil du vite at navnet er
litt overgang for noen versjoner av Linux.
Maria database er faktisk en gaffel så å si av MySQL.
>> Lang historie kort, kjøpte Oracle MySQL.
Oracle er et stort selskap.
Folk har blitt bekymret for at det ville ikke lenger forbli ganske så åpen kildekode,
så dette er bare en kopi av MySQL som er fortsatt gratis, fremdeles åpen kildekode, og
installert i Fedora Linux som standard.
>> Men dette er en slags smerte i hals for å bli kjent med en
database på denne måten.
Så vi inkluderer i CS50 apparatet en gratis open source verktøy kalt
phpMyAdmin.
Bare en tilfeldighet at det er skrevet i PHP.
Det er ingen fundamental trenger for PHP her.
Men dette er bare et web-basert verktøy som vi lastet ned gratis, installert i
apparatet, som gjør det mulig for oss å ha en grafisk brukergrensesnitt som
å utforske p-set syv database med som å opprette nye databaser,
si for din egen endelige prosjektet hvis du hadde lignende, og derved skape
dynamiske websider som CS50 Finance som gjør at du kan spørre data og
oppdatere data dynamisk.
>> Du er ikke nødt til å bruke bare en enkel tekstfil eller CSV.
Du kan faktisk bruke en smart database program slik at du kan utføre mer
avanserte søk enn bare å lese gjennom alt lineært.
>> Så for eksempel, er dette det vi gir deg ut av boksen for p-set syv.
Dette er en tabell med tilsynelatende minst tre kolonner, hvorav den ene er
brukernavn, hvorav den ene er hasj, og den andre av hvilke er ID.
>> Men det interessante, og bare for å erte ut en tanke her, brukernavn
er formodentlig allerede unikt, ikke sant?
Jeg mener, de fleste hvilken som helst nettside, hvis du har et brukernavn, det
kan ikke være to Cæsars.
Det kan ikke være to Malans.
Det kan ikke være to jharvards.
Dens unike.
Ellers har de ikke vet hvilke jharvard det faktisk er.
Så hva som kan være motivasjonen for også har en tredje kolonne på venstre
det kalles ID, som ser ut som en tall som er på samme måte unik?
Det føles litt overflødig til meg ved første øyekast.
Hvorfor kan det være attraktivt å ha ikke bare unike brukernavn,
men også unike numre?
>> PUBLIKUM: De kunne ha det samme passordet.
>> DAVID MALAN: Folk kan ha det samme passordet, sikkert.
Det kan absolutt skje.
Men hvis de har denne unike brukernavn, jeg vil hevde at det ikke egentlig
saken, fordi hvis de skriver i sitt brukernavn, jeg trenger bare å sjekke deres
passord, deres hash av disse.
Hvorfor ellers?
>> PUBLIKUM: Raskere søker.
>> DAVID MALAN: Raskere søker.
Hvorfor?
>> PUBLIKUM: ID er bare en.
>> DAVID MALAN: ID er bare ett tegn, eller for å være mer presis, det er et tall,
så det er nok 32 bits eller noe sånt.
Mens brukernavn, tilsynelatende Jason Hirschhorn er der oppe er liksom
latterlig lang, og det kommer til å tar meg mye mer tid til streng
sammenlign H-I-R-S-C-H-H-O-R-N, og kanskje a / 0 eller noe sånt, for
å slå opp Jason, i motsetning til bare sa gi meg bruker nummer to.
Det er 32 bits.
Det er et enkelt INT som du har å sammenligne.
Og ja, det er akkurat hvorfor databaser en tendens til å tilordne unike IDer til
rader i dem.
>> Nå hva andre datatyper er det foruten INT og tilsynelatende
strenger som dette?
Vel, for å være mer korrekt, SQL databaser, som
MySQL, har CHAR felt.
Og røye litt villedende er ikke en eneste CHAR.
En CHAR felt i en MySQL database er ett eller flere tegn, men det er en
fast antall tegn.
>> Så for eksempel, hvis jeg går over til phpMyAdmin som du kanskje allerede har, eller
snart vil et problem satt syv, og jeg går til min database, og bare for moro skyld,
la oss lage en ny tabell kalt teste med bare to kolonner.
Jeg vil deretter Start.
Og dette vil bli ganske kjent, særlig ettersom du tinker
rundt på egen hånd.
Her kan jeg skrive ID for å skape en ny tabell av type int.
Men her jeg kan skrive brukernavn til gjenskape den tidligere tabellen.
Og legg merke til jeg har en hel haug av typer å velge mellom.
>> Og dette er også grunnen til at phpMyAdmin er litt fint.
Det er en slags selv undervisning i at du kan bare slags punkt, og klikk, og
se på rullegardinmenyer, og slutte fra at hva krefter SQL gir deg.
>> Og ja, hvis jeg velger CHAR, jeg da må spesifisere lengden, eller hvordan
mange verdier, hvor mange tegn.
Så veldig felles verdier er ting som 255, men det er litt lang.
Vanligvis er åtte for et brukernavn.
Men det er litt lite i disse dager.
Så dette er et design beslutning.
Er det 8 tegn maks, 32, 255, 1000?
Det er egentlig opp til deg.
Men en CHAR feltet er et fast antall.
Så velger for få og du er slags skrudd hvis du ønsker en lengre brukernavn.
Velg for mange, og hva som er nedsiden?
>> PUBLIKUM: [uhørbart].
>> DAVID MALAN: Det er sløsing.
Akkurat som i C, hvis du har en større del av minnet enn du trenger, er du
bare å kaste bort tid og kaste bort plass.
Så som et alternativ, det finnes VARCHAR, som løser dette problemet ved å
behandling av lengden ikke som en fast lengde, men som en maksimal lengde, og ved hjelp av en
variabelt antall tegn, som deretter har en tendens til å bare bruke så mange tegn som du
faktisk trenger.
Det høres perfekt.
>> Hvorfor kan ikke vi bli kvitt den Char-datatype da?
Hva kan være nedsiden av bruker VARCHARs, som lyder
som det er en fin seier?
Yeah?
>> PUBLIKUM: [uhørbart].
>> DAVID MALAN: OK, bra.
Så hvis alle dine data er det samme lengde, hva er bekymring?
>> PUBLIKUM: Fordi du kaster bort data ved å fortelle dem alle.
>> DAVID MALAN: Så hvis alle dine data er samme lengde, skjønt, vil jeg hevde
som spesifiserer en maksimal lengde på VARCHAR er ikke forskjellig fra
spesifisere en fast lengde på CHAR hvis du vet at antall på forhånd.
Men det er faktisk, og jeg skal liksom trekke ut fra det svaret virkeligheten
at det fortsatt er en max, som kunne være irriterende, spesielt hvis du
støter på en persons navn som er uvanlig lang at du ikke gjorde det
forutse.
Og det er også en litt mindre effektiv å faktisk søke på VARCHARs som
motsetning til søker tegn, spesielt for langbord som har mye og
mye data.
Så også her, er tematisk igjen ingen opplagte valget.
>> Så bare for å gi deg en følelse av andre datatyper som kan være av interesse
enten for p-set syv eller i fremtiden, er det INT.
Det er BIGINT, som er som lang lang.
Det har en tendens til å være 64 biter.
Det er DESIMAL, som du vil se i problemet set, som er en mye
renere svar på de problemene vi oppstått med flottør og flytende
peke imprecision.
Og så er det DATETIME.
Det er bokstavelig talt en datatype som har å se ut som et år, en måned, en dag,
og en time, minutt og sekund.
>> Men SQL databaser har også ting vi kaller indekser.
Og en indeks er noe som du angir når du oppretter tabellen til
foreta søk og andre operasjoner mer effektiv.
Nærmere bestemt, er det noe som heter primærindeksen som du kunne
erklære som følger.
>> Vi gjorde dette for deg med brukere tabellen gir vi deg.
Men legg merke til hvis jeg var manuelt gjenskape bruker tabell her gi
det et navn på brukere.
Jeg har allerede angitt ID.
Jeg anga INT.
Jeg spesifiserte brukernavn med maksimum 32 tegn.
Men hvis vi holder rulle i denne ganske stort vindu, merker det er en
haug med andre ting jeg kan angi.
>> One, kan jeg spesifisere attributter lignende, vet du hva, dette
INT bør være UNSIGNED.
Jeg ønsker ikke negative tall, så la oss gjøre det UNSIGNED.
Null er ikke relevant her fordi Jeg ønsker alle brukere til
har et unikt nummer.
Jeg vil ikke at det skal være null.
>> Men dette er interessant.
Jeg kan spesifisere at ID er enten primærnøkkel av denne databasen, eller det er
unik, eller det er indeksert, eller fulltekst.
Så for dagens formål, lang historie Kort sagt betyr PRIMÆR at dette skal
være både konseptuelt og teknisk feltet som vi bruker til å unikt
identifisere brukerne.
>> Så når vi ser opp brukere, er denne typen av et løfte om å slå dem opp det meste av
som unik identifikator.
Og databasen vil sikre at hvis du har en bruker nummer tre, kan du ikke
fysisk sette inn en annen bruker med det samme tallet 3.
Databasen vil bare nekte for å lagre endringene.
Som er en god ting, fordi du kan beskytte deg mot deg selv. selv
>> Alternativt, for brukernavn.
Så den andre raden, husker, er brukernavnet feltet.
Så den andre raden her er brukernavn, som vi gjorde helt til venstre der.
>> Så hva annet kan jeg ønsker å spesifisere?
Jeg får ikke lov, ifølge SQL, å spesifisere to primærnøkler.
du kan spesifisere en felles nøkkel der du se på begge felt, men de kan ikke
enkeltvis være primærnøkler.
Så det er uaktuelt.
Så hvilke kanskje jeg vil velge?
>> Vel, er UNIK ligner i ånden til en primærnøkkel der du angir denne
Feltet skal være unikt, men det er ikke kommer til å være den
Jeg bruker hele tiden.
Og vi kommer til å bruke denne en alle tiden for hva grunnen igjen?
Det er tregere potensielt hvis det er en lang brukernavn.
Det er bare bortkastet tid.
>> INDEX, i mellomtiden, presiserer at det er ikke kommer til å være unik, men jeg vil gjerne
du å jobbe din magi under panseret for å gjøre det raskere for meg å
søke på dette feltet.
Så dette er trolig ikke relevant her.
For brukernavn, vil jeg hevde at UNIK er et godt svar.
Men anta at vi har gjort brukerne mer interessant enn bare brukernavn,
hashes, og ID-numre.
Hva om vi ga folk fulle navn?
Hva om vi ga dem adresser og andre data om dem?
>> Vel, hvis du angir at en kolonne i et database er indeksert, det betyr at
MySQL, eller Oracle, eller hva database du bruker, bør arbeide sin magi
og bruke noen form for fancy data struktur som et tre, eller en trie, eller en
hash table, eller noe å garantere at når du søke etter data ved hjelp
velge på det aktuelle feltet -
som viser meg alle at bor på Oxford Street.
En spørring sånn.
Hvis du har spesifisert på forhånd at du vil ha en indeks på dette feltet, det
søkene vil være mye, mye raskere.
>> Hvis du ikke angir en indeks, den beste du kan gjøre er en lineær søk hvis
det er ikke sortert.
Men hvis du angir INDEX, smart folk som har gjort databasen -
folk som deg som nå kjenner trær og prøver og hash tabeller -
vil automatisk bygge en slik data struktur i RAM for å sørge for at
disse søkene er mye raskere.
>> FULLTEXT er i mellomtiden lik i ånden, men lar deg gjøre wildcard
søk, som viser meg alle at bor på gatene som begynner med
bokstaven O uansett grunn.
Du kan gjøre jokertegnsøk sånn.
Eller, mer overbevisende ting som showet meg alle som har ordet -
Vis meg alle med navn som starter med en bestemt bokstav.
Du kan søke etter nøkkelord på denne måten.
OK.
>> Så, design muligheter det potensielt.
Det er andre som jeg vil vinke hendene mine på.
Det viser seg at du kan ha ulike lagrings motorer.
Og dette er mer uforståelige enn vi trenger sikkert for oppgavesettet sju.
Som standard er det dere bruker noe som kalles InnoDB.
Du vil se omtale av dette et sted i phpMyAdmin grensesnitt mest sannsynlig.
Men vet at det er andre design beslutninger som er av potensiell
interessen kommer endelig prosjekter hvis du gjør noe web-basert.
>> Men la oss gjøre dette.
La oss gå videre og sette dette på skjermen som en teaser for en historie
involverer deg, en samboer, og et glass melk.
La oss ta en to minutters eller så bryte her.
Og hvis du kan holde rundt, la oss komme tilbake, se litt mer på SQL, og
deretter en bit av Javascript med p-satt åtte i tankene.
>> OK.
Så, la oss få deg å tenke på en hjørne saken som svært lett kan oppstå
i sammenheng med bruk av en database, eller ærlig, selv ved hjelp av reelle ting
som minibanker for å få penger.
Så her er et kjøleskap.
Anta at du har en også i dorm eller huset ditt.
Og du har en romkamerat, og begge du virkelig liker melk for eksempel.
>> Så du kommer hjem fra klassen en dag.
Han eller hun er ennå ikke tilbake.
Du åpner kjøleskapet.
Vil du virkelig ha et stort glass melk.
Det er ikke noe melk.
Så hva gjør du da?
Du lukker kjøleskapet.
Du hente nøklene.
Du går ut til torget.
Og du får i kø på CVS på de selv kassa ting, som alltid
ta lengre tid enn faktisk ha kasser.
Anyhow.
>> Så da, i mellomtiden, dot dot dot, din romkamerat kommer hjem, og han eller hun
Tilsvarende har en hankering for litt melk.
Så han eller hun åpner kjøleskapet, ser inne, og oh, jævla.
Ingen melk.
Så han eller hun hodet ut, skjer for å gå til den andre CVS, som var bare en
sperre bort av en eller annen grunn, og han eller hun får i kø for å kjøpe melk.
>> I mellomtiden, kommer du hjem, han eller hun kommer hjem, og hva gjør
du til slutt ha?
Dobbelt så mye melk.
Men du egentlig ikke liker melk så mye.
Så nå har du så mye melk som nå en av dem er bare kommer til å gå sure
slutt.
Så dette er en veldig dårlig problem.
Høyre?
>> Så hva har skjedd?
Så fundamentalt, er denne typen av en latterlig eksempel.
Men under panseret, hva vi har hatt skje her er dere begge sjekket
tilstanden for et visst stykke hukommelse, kjøleskapet.
Begge du sjekket staten av noen variable.
Dere begge trakk en konklusjon at du da handlet på.
Men dessverre, mens romkameraten var i butikken, staten som
variabel forandret, han eller hun kom tilbake og nå ønsker å endre tilstanden, men
det er allerede blitt endret på ham eller henne.
Og selvfølgelig, vil han eller hun ikke har gått til butikken om de visste
at du allerede var underveis.
>> Så i den virkelige verden, hvordan kunne du unngå dette problemet, forutsatt at du har
et kjøleskap, har du en samboer, og du faktisk liker melk?
>> PUBLIKUM: Å kommunisere.
>> DAVID MALAN: Å kommunisere.
OK.
Men hvordan kan du kommunisere?
>> PUBLIKUM: Legg igjen en lapp.
>> DAVID MALAN: Legg igjen en kommentar, ikke sant?
Alltid forlate et notat, for fans av showet.
Ok, så du alltid la et notat, eller satt virkelig som en hengelås eller noe
på kjøleskapet som holder romkamerat fra inspisere tilstanden til
den variabelen.
>> Nå, hvorfor kan dette være viktig til Problemet satt syv, eller minibanker.
Vel, tenk en verden i en minibank der du kan være i stand til å gå opp til en minibank
maskin her, og en annen minibank her.
Og dette skjer ganske ofte.
Og anta at du hadde to ATM-kort, som er mulig å oppnå.
Og du logger inn begge maskinene effektivt samtidig, forhåpentligvis
mens ingen ser.
Og så du skriver inn PIN-koden omtrent samtidig.
Og så gjør du en balanse spørring for å se hvor mye penger du har.
Og la oss si at du har $ 100 igjen på kontoen din.
Så egentlig samtidig, du sier en, null, null, skriv.
Og du forhåpentligvis få tilbake noen penger.
>> Men hvor mye penger kan du komme tilbake?
Nå datamaskiner på slutten av dagen, spesielt hvis de snakker med
servere, ikke nødvendigvis gjør ting i den rekkefølgen som er forventet.
>> Så vel hva som skjer på grunn av uansett nettverk hastighet problemer der
er, eller CPU problemer er det, eller noe sånt, antar at
første ATM sjekker saldoen og ser, oh, har denne personen 100 kr.
Men så blir distrahert fordi kanskje en backup som skjer, og slik at det er
bremse ned.
Eller kanskje mens du sjekker, nettverket forbindelse fikk en litt tregere fordi
dette bare skjer.
De er fysiske enheter.
Så i mellomtiden, er den andre ATM spør det samme spørsmålet.
Hvor mye penger har David? $ 100 er svaret.
Men fordi den første ATM har ennå ikke sendte meldingen trekke fra $ 100, begge
Minibanker har inspisert hvelvet bankens, se det er $ 100 der, og nå
begge maskinene potensielt er kommer til å spytte ut et svar.
>> Nå, dette er flott for deg i en viss forstand hvis hva banken gjør slutt
er å endre beløpet til minus 100 ved sette variabelen lik din
bankkonto lik 0, i motsetning å gjøre minus 100.
Nå i verste fall for banken -
eller i det beste for banken, i mellomtiden, de gir deg $ 200, og
bankkontoen viser nå negativ $ 100, noe som egentlig ikke
til nytte for deg i det hele tatt.
Men poenget er at dette løpet betingelse for to romkamerater får
melk, eller for to minibanker prøver å få penger og endre status for et hvelv
Samtidig eksisterer noen gang du har en database.
>> Nå i oppgavesettet syv, dette problemet oppstår i den forstand at hvis du kjøper en
andel av Facebook lager, og deretter for eksempel du kjøper en andre del av
Facebook lager, må du gjøre en beslutning som programmerer.
For å bestemme hvordan du oppdaterer database, oddsen er at du kommer til å
har en rad for det lager, og denne er en måte å gjennomføre det.
Og du kommer til å ha en andel av FB, som er deres børssymbol
for dette brukernavnet, eller denne brukeren ID, den unike identifikator.
>> Men den samme historien kan skje her.
Hvis du gjør en SELECT i SQL, som du vil se i oppgavesettet syv når du ser,
oh, har David en aksje av Facebook lager.
La meg nå endre dette til å være to aksjer, fordi han ønsker å kjøpe en
andre aksje.
Men antar at David hadde faktisk to nettleservinduer åpne, eller anta at
det er en felles konto med to ektefeller, og begge forsøker å utføre
samme operasjon, er det også, i potensial for en beslutning om å være
gjort basert på den forrige tilstanden i verden -
kontoen har én aksje -
og både mennesker, eller begge serverne, nå prøv å si øke det til to aksjer.
Men i dette tilfellet, kan du ha belastet meg penger for både aksjer, men
økes bare at en gang.
>> Så kort sagt, den grunnleggende problem her, som med spøk om å forlate en
oppmerksom på, eller å sette en hengelås på det, er Hvis to personer, eller to tråder -
tenker tilbake til scratch -
kan sjekke status på noen variable og deretter prøve å endre den variabelen,
men de to tingene ikke skjer på samme tid, men kan bli avbrutt
av andre ting som skjer, data kan komme inn i en veldig merkelig tilstand.
Og du kan ha nytte eller du kan lide som omhandlet i eksempel penger.
>> Så i oppgavesettet syv, gir vi deg dette en kodelinje, som lenge
historie kort, løser dette problem i MySQL.
Denne svært lang opplæring som ikke selv plass på én linje på
skjermen her sikrer at driften er det som kalles atom.
Det skjer alt på en gang, eller det skjer ikke i det hele tatt.
Denne svært lang setning kan ikke bli avbrutt delvis.
>> Og hva den gjør er bokstavelig talt hva den sier.
Sett inn noen tabell følgende tre felt de bestemte verdier,
men på like nøkler, ikke gjør en innsats.
Gjør en oppdatering.
Så dette er som å gjøre en SELECT og en SETT så å si på samme tid.
Og hva er nøkkelen det er sannsynligvis blir referert til her?
>> Det viser seg, og du vil se dette i Problemet satt syv sin spec, fordi
vi har erklært at det skal være en unik nøkkel på denne tabellen slik at
du kan ikke ha flere rader for samme bruker med
samme penny stock symbol -
i dette eksempelet her, er DVN.V en dum penny stock at vi
se i spec.
Fordi vi har erklært det å være unik, hva dette betyr er at hvis du
prøver å sette inn en kopi rad, er du i stedet kommer til å oppdatere den uten
noen andre som har en sjanse til å snu tilstanden av verden heller.
Så kort sagt, sikrer dette ting er atom.
>> Mer generelt skjønt, databaser som MySQL -
og du ikke trenger denne funksjonen for p-satt sju, men holde det i tankene for
fremtiden -
støtter det som kalles transaksjoner, der du kan si
START TRANS bokstavelig.
Du kan deretter utføre to SQL-setninger.
Og en SQL-setning, som du vil se ip-satt sju, ser litt
noe sånt som dette.
Oppdatere en tabell kalt konto.
Innstill balansen kolonnen lik uansett balansen kolonnen for tiden
er minus 1000 hvor tallet, den kontonummer, som bruker-ID,
lik 2, og deretter oppdatere konto dot dot dot.
>> Så i lekmann vilkår, hva gjør disse to spørsmål synes å være å gjøre i
virkelige verden følelse av bank?
>> PUBLIKUM: Overføring til besparelser.
>> DAVID MALAN: Nettopp.
Overføre penger fra en kontoen til den andre.
Og dette er et annet eksempel hvor du virkelig ønsker disse to ting til å skje
eller ikke skje.
Du ønsker ikke noe å komme i midten av disse, og potensielt rote
regnestykket, eller rote opp hvor mye penger du har, eller hvor mye
pengene i banken har.
Så hva er egentlig fint om transaksjoner i MySQL er det, og
databaser mer generelt, er at de og smarte folk som har implementert
disse funksjonene finne ut hvordan de skal gjøre sikker på at begge disse tingene skje
eller ikke i det hele tatt.
>> Og hvis du er virkelig håper å gjøre et nettsted som brukes av folk på
campus, folk i den virkelige verden, gjør noe i oppstarts forstand,
disse er de typer design beslutninger som
blitt aldri så viktig.
Ellers begynner du å miste data, mister brukere, eller i verste fall i
vi har sett her, potensielt tape penger.
Så igjen, mer om det i oppgavesettet syv, samt kanskje for noen av
du i slutt prosjekter.
>> Så la oss endre det bildet vi hadde et øyeblikk siden bare på enda en måte.
Så la meg faktisk se om jeg kan -
nope, det er borte.
Det er det.
>> Så det er her vi igjen sist.
Og det viser seg at vi kommer til å kaste en ting inn i miksen her -
et språk som heter Javascript.
Så Java faktisk passer inn i dette stykket -
og jeg visste ikke helt forlate nok plass, så dette er ikke nå å skalere.
OK, dette er virkelig patetisk.
OK, så det er Script.
OK.
Jeg er virkelig gjør det en bjørnetjeneste.
OK.
>> Så Javascript er et annet programmerings språk, og vår siste, hvis det hjelper
berolige at det er ikke mye mer av brannhydranter her.
Så Javascript er også en tolket språk, noe som betyr at du ikke
kompilere den inn nuller og enere.
Du bare kjøre den.
Men hva er fundamentalt annerledes med Java regel er at du
ikke kjøre den på webserveren din.
Det blir ikke kjørt i Apparatet per se.
Snarere blir det lastet ned av en bruker via HTTP i nettleseren -
Chrome, Safari, Internet Explorer, Firefox, uansett -
og det er nettleseren som utfører dette bestemt programmeringsspråk.
>> Så for å være klar, PHP hittil har vært utføres enten på kommandolinjen i
vår svarte og hvite vinduet, på en server ut av apparatet, en datamaskin
liker apparatet, eller det har vært henrettet av en web-server
kjører på en datamaskin.
Men temaet her er at PHP hittil har blitt utført på serversiden, så
brukeren og brukerens nettleser aldri ser en linje av PHP-kode.
>> Faktisk, hvis du noen gang åpne en nettleser for din nettside eller en annen, og du
faktisk se PHP-kode i vinduet, noen har skrudd opp.
Fordi det ikke er ment å være sendes til en browser direkte.
Det er ment å bli henrettet og slått til noe som HTML.
>> Men Javascript er egentlig motsatt.
Det er ment for å kjøres vanligvis inne av en brukers nettleser vindu.
Og hva slags nettsteder bruker Java deretter i disse dager?
>> Som bokstavelig talt hver populære nettsiden.
Hver nettside som dere sannsynligvis bruker daglig bruker Javascript for at den
enkleste og selv sexiest funksjoner.
>> Så noe sånt som Facebook Chat hvis du bruker det.
Hvordan det faktisk fungerer?
Vel så langt, alle de ting vi har gjøres med HTML og PHP forutsetter at
du trekker opp en URL, og du trykker på Enter, og du se noen HTML-innhold.
Og du klikker på linken, som endrer URL, endrer siden, og laster
noe nytt innhold.
Klikk på en annen URL eller sende inn et skjema, du bli tatt til en annen side og
du se noe nytt innhold.
>> Men å bruke noe sånt som Facebook Chat, eller Gchat eller Google Maps, sjelden
ikke hele siden oppdatere slik at du ser en hvit skjerm øyeblikk og
deretter nytt innhold.
Snarere nettsider i dag er dynamisk å bli oppdatert igjen og
igjen og igjen alle slags av bak kulissene.
Og det viser seg at når du går til noe sånt som Facebook, eller Gchat,
eller Gmail, og oppdateres siden automatisk uten å laste
hele skjermen, hva som har skjedd, er at nettleseren har gjort slags hemmelighet
flere HTTP-forespørsler -
ikke for hele nettsider, men bare for små biter av data, som
direktemelding at vennen din bare sendte deg, eller statusoppdateringen som
noen har akkurat sendt deg, eller tweet at noen bare sendt.
Det er bare å lage små forespørsler om data, og deretter bruke JavaScript, dette
programmeringsspråk, for å endre det web-siden ser ut uten
Serveren hjelpende, uten at serveren genererer som HTML.
>> Så kort sagt, kan JavaScript brukes deretter å ikke bare hente nye data fra
serveren uten omlasting helhet side eller sende inn et skjema.
Den kan også brukes til å endre den såkalte DOM -
Document Object Model -
som er akkurat den fancy måte for sier tre av HTML
som vi så forrige gang.
>> Så for å berolige, er JavaScript syntaktisk så lik C også.
Det er ingen hovedfunksjon.
Du bare begynne å skrive koden og det vil bli utført, eller
tolkes mer riktig.
Forholdene vil se slik ut.
Ikke forskjellig fra C eller PHP for den saks skyld.
Boolske uttrykk eller-ed sammen vil se slik ut.
Anded sammen se slik ut.
>> Brytere vil se slik ut.
For løkker vil se slik ut.
Mens løkker vil se slik ut.
Gjøre mens loops vil se slik ut.
>> Dette er nytt.
Så JavaScript har ikke en foreach konstruere per se, men denne konstruere
for variabel i i array, og jeg i dette saken blir en indeksverdi.
Så det er litt forskjellig fra det foreach, men nye versjoner av
JavaScript kommer ut hele tiden, så selv disse språk har
er i utvikling.
>> Og som en digresjon, JavaScript disse dager kan også brukes på en server i likhet
PHP bruker et rammeverk kalt node.js.
En av CS50 er TFS, Kevin, har ledet en seminar om Node.js som er tilgjengelig på
cs50.net/seminars.
Så hvis du er nysgjerrig, vet at du kan bruke denne på serversiden som
vel, men det er en ganske nylig trend, men en kraftig en på det.
>> Dette er litt annerledes.
Dette er en array i JavaScript.
Og det som slår deg som annerledes versus C eller PHP?
Det er noen raske historier vi kan si her.
Hva mangler versus PHP?
>> PUBLIKUM: [uhørlig].
>> DAVID MALAN: Ja?
Beklager, si igjen?
>> PUBLIKUM: Ikke erklære variabeltypen.
>> DAVID MALAN: Vi er ikke erklære variabeltypen.
Så egentlig helt som PHP, vi er ikke spesifisere hvilke typer denne variabelen.
Snarere er vi mer generelt sier Div. for variabel.
Vi har ikke PHP ordensforstyrrelser av dollartegn, som samtidig kjedelig å
type, gjør mer klart at noe er en variabel.
Mens her er vi liksom tilbake til C tilnærming ved bare å ringe en
variabel ved navn vi ønsker for å gi den, som tall.
Og også som PHP, har vi klammer for
verdier inne denne matrisen.
>> Så variabler i JavaScript også kan se slik ut.
Legg merke til her dette er en streng som heter s, men på samme måte har vi ikke spesifisert
at det er en streng.
Her er skjønt en funksjon som ikke eksistere på nøyaktig samme måte i PHP,
men litt på samme måte.
Dette er et objekt i JavaScript.
Og objekter er liksom den sveitsiske hæren Kniv av en datastruktur i at du
kan bruke dem for en rekke ting.
>> Her, for eksempel, vi erklære en variabel kalt sitat.
Typen av den variabel er et objekt.
Du kan tenke på dette som en C struct som har nøkler og verdier.
Symbol er en nøkkel.
FB er en verdi, tilsynelatende en aksje symbol.
Komma.
Prisen er en annen tast, og verdien er tilsynelatende et flyttall, eller en
nummer mer generelt i JavaScript, for $ 49,26.
>> Så PHP ikke har -
vi ikke har sett i PHP gjenstander ganske som dette, men vi fikk se en analog,
som var det?
>> PUBLIKUM: [uhørlig].
>> DAVID MALAN: assosiative arrays.
Så mens PHP har assosiative matriser hvis syntaks er alltid litt slik
annerledes -
vi så hakeparenteser.
Vi så de rare piler symboler.
JavaScript har gjenstander, men dette er det meste en semantisk forskjell og en
annet synonym for nå.
Men som en digresjon, har PHP også gjenstander på en måte som Java og annen
språk har objekter i objektorientert programmering.
Men vi vil bruke disse bare for datatyper for nå.
Objekter og assosiative matriser.
>> Dette kan gjøre det litt mer tydelig.
Her er hvorfor et objekt er nyttig.
Når du ønsker å erklære en student, som Zamyla, kan vi faktisk
kapsle så å si inne i det objekt med klammeparentesene akkurat som
før en hel haug med nøkler og verdier i her.
Vi har en ID, et hus, og et navn Zamyla, etterfulgt av et semikolon som
vanlig ved slutten.
>> Ned her også, er dette litt forskjellig, men også meget kraftig
disse dager.
Her er en matrise, og jeg vet at fordi det er en hakeparentes opp
topp og en firkantet brakett nederst.
Og dette er et utvalg av hva data skriver tilsynelatende i Javascript?
Dette er et utvalg av det ser ut som tre stedene.
Og jeg vet det er et objekt bare på grunn av de klammeparentes.
Og legg merke til det er åpent klammeparentes, noen ting, tett krøllete brace, komma,
deretter litt mer, komma, og deretter litt mer.
Så det er tre argumenter atskilt med to komma.
>> Så dette er en rekke tre stedene.
Og hver av disse objektene ser ut til å være en student eller ansatt av noen
sortere, hver med en ID, huset, og navn.
Men jeg har kalt dette noe kalt JSON -
Javascript Object Notation.
Og dette er et dataformat som faktisk er så veldig populær og i
moten i disse dager at hvis du skriver en program som bruker Facebook
API, Twitter API, egentlig nesten noen API ute i disse dager,
inkludert noen av CS50 sin egen, den data du får tilbake er ikke i
gamle skolen CSV-format.
>> Fordi tilbakekalling som CSV er super enkelt.
Det er bare kolonner adskilt med komma.
JSON data gir deg flere metadata.
Det knytter en nøkkel med hver verdi så de trenger ikke å bare anta at
zeroth kolonnen er en verdi, kolonne en er et annet, to kolonne er en annen.
Alt i en JSON objekt her er liksom av selvbeskrivende, fordi hver
ett av navnene i denne filen har bokstavelig talt navn foran det som en
sitert streng.
>> Så la oss ta en titt på en par eksempler her.
La meg gå inn i apparatet.
Og la meg gå inn i vår vhost katalog i offentligheten.
Og la meg gå inn i Java katalogen.
Og la oss gå videre og åpne opp dom-0.html, hvor DOM betyr bare
Document Object Model.
Det er tre ting som Jeg refererte til tidligere.
>> Og la meg foreslå følgende.
Her er en nettside som har Kroppen er ganske enkel.
Så her nede på bunnen, merker jeg har et skjema.
Vi har sett dem før.
Den har to innganger, hvorav den ene har en ID av navnet, hvorav den ene har en type
sende, og den første ens typen er tekst.
Så dette faktisk høres ganske enkel.
>> La oss gå her.
La oss gå tilbake til denne siden her.
La oss gå inn localhost, og gå inn i vår Java katalogen, og gå til
dom-0, og her har vi dette skjemaet.
Så det er tydeligvis all denne siden gjør.
Den har en navnefeltet med en Send-knappen.
Men jeg har ikke tenkt å bruke PHP her.
Jeg kommer til å gjøre alt klientsiden så å si i Javascript som følger.
>> Legg merke til at jeg har faktisk gitt navnet felt av denne inngangen en unik
identifikator, som faktisk vil spare meg litt tid i et øyeblikk.
Og legg merke til jeg har introdusert en annen tag i hodet av min webside,
tag.
>> Så det er i denne forstand at Javascript er en klient-side programmeringsspråk.
I dette tilfellet, akkurat som CSS, har jeg satt det rett på innsiden av min HTML.
Men merker jeg har erklært en funksjon som ser litt ut som PHP
syntaktisk, men dette er egentlig Javascript, fordi igjen, er det
klientsiden i nettleseren.
Og ta en gjetning på hva dette kommer til å do, selv om noen av syntaksen
her er nye.
>> PUBLIKUM: Si hei til den som.
>> DAVID MALAN: Det kommer til å si hei til den som besøker denne siden.
Så hvordan?
>> Så legger merke til, det viser seg i Javascript det er et varsel ()-funksjonen.
Dette er en meget slags trist funksjon som egentlig bare har en tendens til å irritere brukerne.
Det er ikke en du bør virkelig bruke typisk, men det er en rask og skitten
måte å liksom skrive noe til et grafisk brukergrensesnitt
grensesnitt, som en nettleser.
Legg merke til her at jeg har fått en streng i enkle anførselstegn.
Det viser seg at i motsetning til C, Java kan faktisk ha du bruke singel
sitater, og ærlig talt det er bare snill av den stilistiske konvensjonen blant
Javascript programmerere å bruke apostrof.
PHP, de faktisk har litt annen betydning.
Men for nå, bare vet at det er den eneste grunnen.
Konvensjonen i Javascript er ofte å bruke apostrof, men vi kunne bruke
doble anførselstegn i begge steder også.
>> Så dette er interessant.
Husker sist gang at vi hadde som bilde på skjermen som trakk et tre
hvor du hadde HTML-noden, og hodet node, og legemet node,
og litt tekst.
Men det var en spesiell node på Helt øverst på at jeg kalte dokumentet.
Vel, det viser seg i Javascript, noe gang du skriver et program i Javascript
i en nettleser, har du tilgang til en spesiell global variabel.
Lignende i ånden til PHPs superglobals, dette kalles i
små bokstaver dokument.
>> Det er som en struct, men dette struct har også funksjoner inne for det.
Så en C struct bare har data typisk.
Men en Javascript-objekt som dette teknisk er også har funksjoner,
ellers kjent som fremgangsmåter, på innsiden av den.
Og du kan kalle en funksjon innsiden av dette objektet bokstavelig talt gjør sitt
navn, prikk, og deretter navnet på funksjon, eller igjen metode.
Det er bare et synonym, egentlig.
>> Og hva gjør denne funksjonen gjør?
Du kan slags gjette fra navnet.
Få element av ID.
Så dette kommer til å søke på nettsiden, søke det treet, på jakt etter
uansett node, AKA element, har en unik ID sitat unquote navn.
Og hva skal jeg gjøre?
Jeg kommer til å få verdien på innsiden av at node i treet, og jeg kommer
å liksom si hei til det navnet.
>> Så ta en gjetning, selv om vi har ikke sett denne ennå, hva gjør pluss
symbolene betyr her og her trolig?
>> PUBLIKUM: Slå sammen.
>> DAVID MALAN: Slå sammen.
Høyre, og disse er bare slags utforme beslutninger
folk gjorde år siden.
I PHP, sette sammen du ting med prikker.
I C, hoppe deg gjennom flere hoops og kaller funksjoner som strCopy () eller
strcat () eller andre slike funksjoner.
Men i Javascript, bruker du plusser.
Så dette er bare lenke sammen tre strenger -
hei, et navn, og deretter et utropstegn.
>> Så når og hvorfor er denne funksjonen heter skjønt?
Vel, ta en gjetning fra HTML nederst.
Hvorfor er hilse () kalt, eller når?
>> Angivelig, som best kan jeg fortelle, på sende, når dette skjemaet er sendt,
Jeg kommer til å gjøre det som er innsiden av disse sitatene.
Og spesielt, jeg kommer til å ringe hilse () og deretter returnere false.
>> Vel, la oss se hva netto Effekten her er først.
Så la meg gå videre og skriver i, sier Loren, Submit.
Hei Loren.
La oss se om kanskje dette var bare en heldig gjennomføring.
Nope.
Så det å skrive ut uansett nevne jeg faktisk satt der.
>> Men legg merke til hva som ikke forandrer seg.
Webadressen er fortsatt dom-0.html.
Det er ingen register.php.
Det er ingen andre filen.
Det er ingen handling attributt.
Så hva er denne avkastningen falsk antagelig gjør?
Hvorfor kaller Jeg hilser () og deretter returnere falsk trolig?
Hva vanligvis skjer når du klikker Send inn på et skjema at selv vi har
sett i den siste uken?
>> PUBLIKUM: [uhørbart].
>> DAVID MALAN: Det går et sted, ikke sant?
Det går til noen URL destinasjon.
Men jeg ønsker ikke at det skal skje her.
Jeg vil ha min webside for å være helt dynamisk som Gmail, der når du er
der, holde deg der.
Nettadressen endrer ikke på en måte som indikerer hele siden er omlasting.
Snarere, jeg bare ønsker å endre noe liker å skrive ut noe
her på skjermen.
>> Vel la meg rense dette opp en liten bit.
La meg åpne opp ikke dom-0, men la meg åpne opp dom-2.
Bare så du har sett noen syntaks her.
>> Det viser seg at det vi bare gjorde bruker rå Javascript.
Så dette er virkelig språket Javascript.
Noen av dere kanskje vet om et bibliotek kalt jQuery.
>> Så jQuery er ikke det samme ting som Javascript.
Det er bare et bibliotek som en virkelig smart fyren skrev og popularisert slik
at nesten alle i verden nå bruker jQuery ved bruk av Javascript.
Og ved første øyekast ærlig, det ser litt mer kryptisk.
Men du vil finne, særlig hvis du går der for det endelige prosjektet med web
utvikling, vil du finne at dette renser ting opp og sparer deg ganske
få linjer med kode.
>> Så la oss bare se på hvordan denne formen fungerer.
Legg merke til hva jeg fjerne tilsynelatende fra min HTML?
Det er ingen på sende til behandleren så å si.
Det er ingen attributt.
Fordi du vet, hva Jeg gjorde egentlig ikke liker?
Jeg følte at vi holdt på å falle i gamle vaner der.
Akkurat som det var begynt å føle slurvete å blander både CSS med
HTML, fordi du er slags kaste forskjellige språk over hele
sted, på samme måte gjorde dette begynner å føle som en dårlig vei å gå ned der
Jeg setter Javascript-kode på innsiden av min HTML snarere enn facto det ut.
>> Så det er lærdommen her.
I dom-2.html, jeg facto det ut.
Og jeg gjør ting litt en annen måte.
For nå, kommer jeg til å vifte med hendene på hva dette egentlig gjør
under panseret.
Men bare for nå antar at den første linje med kode i dette biblioteket
kalt jQuery betyr bare når Dokumentet er klar, gjør følgende.
>> Fordi websider kan ta litt tid å laste.
Du kan være på et tregt internett tilkobling, og det kan bli spinning
og spinne, og til slutt er det lastet.
At linje med kode bare sier vente til hele siden er klar, dokumentet
er klar, før du utfører denne koden.
>> Og nå legger merke til, er dette trolig den mest nyttige først
ta bort fra jQuery.
Denne linjen her er veldig lik i ånden til dette mye lengre linje her.
Mens det i rå Javascript-kode, det Det finnes en global objekt dokument som
har en funksjon som heter getElementById (), folk som skrev
jQuery forenklet som å bare si dollartegn, og deretter innsiden av
parentes sette to sitater, og deretter sette en firkantsymbol etterfulgt av
unik ID du ønsker å ta.
Så dette tilsvarer document.getElementById.
>> I mellomtiden. Sende betyr bare på innsending av hvilken form du er
henviser til venstre, gå videre og gjennomføre dette.
Men dette er nå nysgjerrighet også.
Hva er rart om hva Jeg har fremhevet her?
Ikke bare er det slags syntaktisk nytt, det er også noe som mangler.
>> PUBLIKUM: Det er bare kalt funksjon?
Det er ikke kalt varsling?
>> DAVID MALAN: Yeah.
Vel, så alert () er nede her, for å være rettferdig.
Men det er ingen omtale av en navn, som du vet, foo eller
noe opp her.
Og ja, dette er en av de funksjonene av Javascript som er ganske
kraftig, men også ganske ny.
Og PHP faktisk har dette også.
>> La meg gå videre og gjøre noe virkelig rask.
La meg gå videre og sette dette ut her.
La meg gjøre dette.
Funksjon.
La oss kalle denne behandleren ().
En hundefører funksjon så å si.
Noe som håndterer noen operasjon.
La meg rydde opp min innrykk.
Og sette dette her.
Og sette det her.
Jepp.
OK.
>> Så nå har jeg en funksjon som heter behandleren () at jeg egentlig ikke vet
hva det gjør ennå.
Den har bare fortsatt at ting.
Whoops.
Tok for mye.
La oss gjøre dette.
OK.
Unnskyld.
OK.
La meg gjøre dette.
OK.
Som ser fin og rett fremover nå.
La meg gjøre dette.
Gjør dette.
Og OK.
Så nå, la oss sette dette over her.
Ingen flere programmering på fly.
OK.
>> Så nå, la oss gå tilbake til der historien begynte.
Tidligere sa jeg at denne linjen her betyr når dokumentet er ferdig, gå
videre og gjøre dette.
Hva ønsker jeg å gjøre?
Vel spesifikt, ønsker jeg å gå videre og gjøre følgende.
Utfør denne linjen med kode, og deretter hva jeg vil du skal gjøre er å ringe dette
fungere når skjemaet er sendt.
>> Nå er dette hva som er interessant.
Dette er i seg selv ikke er en funksjon.
Legg merke til at jeg ikke setter parentes her på vanlig måte.
Jeg er bokstavelig talt passerer en funksjon som heter håndterer () til en annen funksjon
kalt sende () som et argument som selv om det er som en variabel.
Og dette er en av funksjonene i Javascript er funksjoner selv
er egentlig bare objekter.
Faktisk, de er egentlig bare variabler av noe slag.
Og hvis navnet på funksjonen er behandleren (), er det ingen grunn til at jeg ikke kan
passere den inn som et argument her.
Og dette betyr da form med ID-demo er
innlevert, kaller denne funksjonen.
>> Men nå hvis jeg angre alt dette, hvorfor da gjorde jeg kanskje gjøre
dette en stund siden?
Vel, dette er en anonym funksjon.
Fordi ærlig, skjønte jeg hvorfor jeg gidde å kaste bort tid på å erklære en
Funksjonen kalles handler () bare å ringe det i ett og bare ett sted?
Hvis jeg ikke trenger navnet, og jeg gjør ikke trenger å kalle det mer enn ett sted,
la oss bare implementere funksjonen akkurat der jeg trenger det.
Og så Javascript og PHP støtte det kalles anonyme funksjoner som
tillate meg å gjøre akkurat det her.
>> Men vi er bare toppen av isfjellet.
La oss erte med bare et par endelige eksempler her.
>> Hvis jeg går inn quote.php.
Legg merke til at dette er faktisk en PHP funksjon, et PHP-program, som jeg skrev
som forventer en HTTP-parameter som heter symbol, og jeg kan passere i
en verdi som FB.
Og hvis vi faktisk se på kilden kode, er dette spørring en gratis nettside
heter Yahoo Finance, akkurat som p-sett sju, og det er tilbake til meg
noe i tilsynelatende format kjent er JSON -
Javascript Object Notation.
Det er bare et objekt.
Legg merke til de klammeparentes, sitater, tykktarmen, og komma.
>> Nå i mellomtiden, er dette ganske kult.
Fordi jeg kan sikkert bruke et programmerings språk å generere webadresser
som ser ut som dette dynamisk, ikke sant?
Jeg kan endre dette til Google og komme tilbake Googles
aksjekursen på $ 1,017.55.
Så la oss se om vi ikke kan bruke denne nå.
>> La meg gå til ajax-0 her, som ser slik ut.
Det er bare en nettside som har et skjema med en knapp.
La meg her gå videre og skriver i YHOO for Yahoo-aksjen symbol, klikker du på Hent
Quote, og nå merker jeg har fått et varsel med 32.86.
>> La meg faktisk gå til en mer avansert versjon på denne siden, versjon to, og
skriver i la oss si Microsoft, MSFT.
Get Quote.
Og nå legger merke til, ikke noe varsel.
Legg merke til hvor det står pris skal fastsettes?
Det er den enkleste av eksempler som hint på hva Gchat, og Facebook
Chat og Gmail, og andre slike nettsteder gjør ved faktisk
endre nettsiden.
>> Legg merke til dette.
La meg oppdater siden.
La meg åpne opp Chrome Inspector.
La meg gå til elementene tappen ned her.
Nå merke hvis jeg zoomer inn her nede, og åpner dette opp, legge merke til at dette er min
HTML DOM - min dokumentobjekt modell.
Dette er min HTML.
Men nå legger merke til, selv om det kommer å være litt vanskelig å se det i både
steder på en gang, hvis jeg skriver i FB opp her, se nederst
av skjermen bare.
>> Det er faktisk skiftende min HTML på fly.
Og det gjør dette ganske enkelt ved å gjøre noe som dette.
Hvis jeg åpner opp ajax-2, varsel implementere noe så sexy som
at selv om det er ganske stygg, men så avansert som det
funksjonelt, har det noen HTML nederst.
Men merker jeg pleide å tagge.
Vi har ikke brukt dette før, men dette er som en, men det betyr ikke tvinge
alt på en ny linje.
Det gjør bare en rektangulær region på samme linje hovedsak.
>> Legg merke til at jeg ga det en ID på pris.
Og det viser seg ved å bruke samme Javascript-bibliotek, jeg har en funksjon
kalt quote () som kalles når skjemaet er sendt.
Og det jeg gjør er dette.
Jeg erklære en variabel i Javascript kalt url, sparer verdi
quote.php? symbol =.
Med andre ord, jeg meg selv begynner å utarbeide en HTTP-forespørsel, og deretter
Jeg concatenating på at med en pluss uansett elementet med ID
av symbol er, som varsel er at tekstfeltet rett ned her.
Så akkurat som vi hadde formene i det siste.
>> Og så viser det seg i jQuery, hvis du ringe. val (), som kaller for en val
funksjon, en verdi funksjon, blir den hva brukeren har skrevet i.
Og så all nettverkstrafikk som skjer er dette.
$. GetJSON.
>> Og som en side, er dollartegn bare en kortform.
Det er virkelig jQuery.getJSON.
Få meg til JSON fra denne nettadressen, og når forespørselen kommer tilbake, kaller dette
funksjon og pass på så det argumentet hva kom tilbake fra serveren.
>> Så med andre ord, hvis jeg går tilbake til den leseren, og jeg går tilbake til quote.php,
hva nettleseren min gjør er å få denne mengde data.
Og når jeg går til denne nettsiden her, merke hvis vi i stedet gå til nettverket
tab og klare det, og skriv deretter inn noe som GOOG for Google og Get
Quote, merke siden ble ikke endret.
Men en HTTP-forespørsel ble gjort, og hva kom tilbake hit hvis vi ser på
respons er en hel haug med JSON at vi får tilgang til slutt med
denne enkle linje her.
>> Data er det som ble fått fra serveren.
Prisen er navnet på Nøkkelen jeg bryr meg om.
Så data.price gir meg det.
>> Nå i mellomtiden, og denne er det siste eksempel.
Du kan gjøre enda mer med den siden.
En faktisk, vel to.
Vi kan bringe tilbake tagge, hvis du husker dette.
Det er Script.
Vi kan gjøre det.
Veldig spennende.
Vi vil forlate det som en cliffhanger.
>> Men mer spennende, kan du gjøre ting som dette.
Hvis jeg går til geolocation-en, viser det seg at Chrome vet at vi er på
lengde-/breiddegrad 42.37. -71,10.
Så det er enda mer der til din disposisjon.
Men mer om det i neste uke.
Se deg mandag.