HANNAH Blumberg: Hi everyone. Vi kommer til å komme i gang bare et par minutter for tidlig siden vi har en hel masse materiale for å komme gjennom. Jeg er Hannah. Jeg er en TF. Maria kommer til å bli med oss i bare et par minutter. Hun underviser delen rett før. Jeg underviser delen rett etter, så vi kommer å holde det til og en halv time. Så som du ser her oppe, har vi ganske noen emner vi trenger for å komme gjennom, så vi kommer litt fort. Men hvis vi på noe tidspunkt si noe for fort, eller du ikke forstår, gjerne avbryte med spørsmål. Vi ønsker å være i stand til å gjøre dette til en anmeldelse av økten som nyttig for alle dere som mulig. Awesome. Så la oss hoppe rett inn med noen temaer som vi faktisk veldig, veldig kort dekket for quiz 0 i quizen 0 anmeldelse økt. Så starter med koblede lister. Så bare sørg for at du har noen grunnleggende kunnskap om lenkede lister og er komfortabel med å gjøre noen av de grunnleggende operasjoner. Så bare en anmeldelse, koblet lister er bedre enn arrays fordi de kan vokse dynamisk. Så vi har den store fordelen. Vi har sett dem brukt i hash tabeller når vi vet ikke nøyaktig hvor mange tingene vi kommer til å ønske for å sette inn i vårt datastruktur. Dessverre har vi biter av den lenket liste over minne, så vi vil ikke nødvendigvis være i stand til å gjøre konstant tid adgang et hvilket som helst element i lenket liste. For å finne en bestemt element, vi har å veksle alle helt fra begynnelsen. Så husk at mesteparten av grunnleggende operasjoner er omega for en. Så innsatsen er bare kommer til å ta en. Slett kommer til å ta n siden vi må gå finne det fra listen. Og søk kan ta, i verste fall, n. Vi kan ikke gjøre noe sånt binære søk på en lenket liste siden vi kan ikke bare tilfeldig hoppe til midten. Kjølig. Awesome. En liten bit av stabler. Dette, igjen, kom opp på quiz 0, slik at du bør være super komfortabel med det. Men for stabler, ber vi deg å huske en stabel med skuffer. Og det kommer til å være først i, sist ut. Så vi stable ting opp i bunken, og deretter hvis vi prøver å ta noe off-- som vi kaller dukker av den stack-- vi kommer på toppen. Og hvis vi ønsker å sette noe i bunken, vi kaller det presser. Så det er alltid kommer til å være økende opp fra bunnen som en stabel med skuffer. Awesome. Vi har sett stabler implementert med både koblede lister og matriser. Hvis du implementere med matriser, vil du å sørge for å holde styr på både størrelse og kapasitet. Slik størrelse kommer til å være den aktuelle rekke ting i stabelen din, mens kapasiteten er det totale antall ting du kan lagre i bunken. Kjølig. Svært likt, har vi køer. I dette tilfellet, i stedet for å tenke på en stabel med skuffer, tenk på en linje. Dette kommer til å være først inn, først ut. Så hvis du er i kø for noe på butikken, Vi håper at den personen først i linjen kommer til å bli hjulpet først. I stedet for å si push og pop som vi gjør for stack, vi bare si enqueue og dequeue. Og igjen, hvis du er implementere dette med en matrise, vi trenger å holde styr av ikke bare størrelsen og kapasitet, men også hodet, hvilken kommer til å være den foran våre køen. Kjølig. Eventuelle spørsmål om noe av det? Awesome. Flytte rett sammen. OK, hash tabeller. Her er der det begynner å bli virkelig interessant. Så en hash table er en implementering av en assosiativ array. Så i utgangspunktet hva som skjedde er vi har all denne inngangen, og vi gir den til en hash funksjon som sier: OK, dette er hvor i hash table det hører hjemme. Så den enkleste hash-funksjon som vi har sett er bare å si: OK, antar vi ønsker å sette strenger i vår hash table. Og en veldig enkel idé kan være å si, OK, la oss bare sortere etter første bokstaven i ordet. Så du kan se her, tar vi banan, vi sette det gjennom en hash-funksjon, og det sier hei, som bør gå på indeks 1. Så vi kan egentlig tenke på en hash tabell som en haug med forskjellige skuffer. Og hver av disse bøtter går å holde hodet på en lenket liste. Og i det lenket liste er der vi kan faktisk sette forskjellige biter av data. Så dykking litt mer inn i en hash-funksjon, her eksempelet jeg bare beskrevet der vi bare si: OK, ta første bokstav av ordet, og vi er kommer til å sortere det inn i bøtter. Så antagelig vil det være 26 bøtter, en for hver bokstav i alfabetet. Hvorfor er ikke dette en god hash-funksjon? Hva gjør denne ikke-ideal? Yeah. PUBLIKUM: Du kommer å ha kollisjoner. HANNAH Blumberg: Ja, akkurat. Du er nødt til kollisjoner. Så det er en ting. Og vi skal snakke om hvordan vi kan fikse kollisjoner i løpet av et sekund. Et annet problem med dette Særlig hash-funksjon er at vår annerledes bøtter kommer til å være av ganske drastisk forskjellige størrelser. Vi vet at det er en hel masse flere ord som begynner med A enn X, så vi kommer til å ha svært ubalanserte bøtter i vår hash table. Kjølig. Så ja, la oss komme tilbake til poenget med kollisjoner. Hva gjør vi hvis det er en kollisjon? Vi har et par forskjellige alternativer. Så en, så antar vi prøver å sette bær i vår hash table. Og vi ser, oh, vi ønsker å sette den i indeks 1, men banan bor der allerede. Hva skal vi gjøre? Vi har to hovedalternativer. Nummer én er vi kan si, OK, det er ikke plass i indeks 1, men la oss bare holde utkikk gjennom før vi kan finne en annen åpen plass. Så vi vil si, OK, la oss sette det på plass 3. Det er ett alternativ. Det kalles lineær sondering. Og en andre alternativet er å si, OK, vel, la oss bare gjøre hver av disse bøtter være hoder av lenkede lister. Og det er OK hvis det er mer enn én ting i en bøtte. Vi skal bare legge det på forsiden. Så her kan du se, OK, når vi satt inn bær, vi bare tok banan, type dyttet den over en liten bit og kastet et bær der inne. Og det er også helt greit. Dette kalles separat kjeding. Du kan tenke på dette som typen som en rekke hoder til lenkede lister. Eventuelle spørsmål om hasj tabeller, hash funksjoner? Awesome. Trær og prøver. Så et tre er noen form av datastrukturen hvor det er en slags hierarki eller en slags av rangeringen til de ulike stedene. Og dette vil bli super tydelig når vi ser et eksempel. Og vi så prøver, sammen med hash tabeller, i pset5-- som igjen helt fritt vilt for denne quiz-- som en annen data strukturer som vi kan lagre forskjellige ting. I tilfelle av ordbok, vi lagret en haug med ord. Så la oss ta en titt på noen trær. Slik at dette er et eksempel på et tre. Den har en slags struktur, at hierarkisk struktur, hvor du kan se at dette en node på toppen har en slags rang ovenfor 2 og 3, som er høyere enn 4, 5, og 6 og 7, som er høyere enn 8 og 9. Så det er alt mener vi med et treet, så du kan bare snill av bilde dette i hodet ditt. Nå har vi et par mer spesialiserte trær. Slik at man eksempelvis er et binært tre. Og et binærtre er, igjen, bare kommer til å være en datastruktur med en slags hierarki, men hver av nodene kan ha høyst to barn. Det er der ordet binære kommer fra. Slik at dette er et eksempel på et binært tre. Så det er en mindre kategori av trær. La oss nå få enda mer spesifikk og snakke om binære trees-- binære søk trær, heller. Så her ideen er ikke bare gjør hver node har høyst to barn, men alle barna til venstre kommer til å være mindre og alle barna til retten kommer til å bli større. Så varsel bare vår binærtre, det er ingen sammenheng mellom tallene. Men i vårt binære søk treet, vi ser, OK, her er 44. Og hvert nummer til venstre for 44 er mindre og alt til høyre er større. Og som holder på hver nivå i treet. Så her, er denne mindre enn 22, og denne er større enn 22. Og det er binært søketre. Hvorfor tror vi det heter et binært søketre? Hva algoritme gjør minner det deg om? PUBLIKUM: Binary søk. HANNAH Blumberg: Binary søk. Fordi hvis du leter etter en bestemt nummer i dette treet, på hvert punkt, kan du bare banke av halvparten av treet, som er flott. Og så det kommer til å gi oss noe som ser mye som binære søk. Noen spørsmål? Greit, kult. Prøver alt rett. Alles favoritt. Så dette er et eksempel på at vi har sett en gjeng i klassen. Og igjen, dette er bare en annen måte at vi kan lagre data. I tilfellet med ordbok, igjen, dette er bare kommer til å være strenger. Så la oss se hva dette faktisk ser ut på et litt lavere nivå. Så la oss ta en titt ved en node i et trie. Og vi ser, OK, det kommer å være en Boolsk og en node, en peker til en node. Og vi ser at Boolsk kalles is_word. Så egentlig, det er kommer til å tilsvare til disse små trekanter som sier, hvis du har fått her, du har funnet en komplett ord. Vi vet at "turing" over her er en komplett ord, mens bare T-U-R ikke er et ord fordi vi ikke ser den lille delta. Og det lille delta igjen, tilsvarer dette is_word, dette boolsk is_word. Og så har vi en rekke barn. Så på hvert nivå, du har en bestemt node, og at knutepunkter til en matrise av hele alfabetet. Så du kan se, igjen, i denne picture-- jeg er kommer til å holde hoppe tilbake og forth-- at denne matrisen på toppen har en haug med forskjellige noder som kommer ut av det. Den har 26, eller 27 hvis du vil til å omfatte en ekstra karakter. Og dette gir oss en måte å lagre data på en måte som kan bli sett på at du kan slå opp super rask. Hva er oppslags tid for en trie? PUBLIKUM: [uhørlig]. HANNAH Blumberg: Yeah. I teorien er det konstant tid. Det er bare kommer til å være på størrelse med ordet du vil slå opp. Selv om vi legger en zillion flere ord til vår trie, det er ikke til å ta oss lenger for å avgjøre hvis et gitt ord er i trie. Så det er veldig fint. PUBLIKUM: Visste du bare initial at array? Du gikk glipp av et poeng eller to. Kan du bare snakke om at for en andre? HANNAH Blumberg: Jada, absolutt. Godt spørsmål. Spørsmålet var, vi har en matrise som er nødt til node stjerne som motsetning til bare node, ikke sant? Kjølig. Så her er hva vi sier er vår matrise er bare kommer til å være pekere til andre arrays. Så det er essentially-- den slags føles som en lenket liste på denne måten hvor hver av disse barna bare peke til neste node. Og måten vi faktisk bestemme, hey, OK, vi har iterated gjennom en hel ord, er dette ordet i ordboka, vi bare sjekke dette is_word. Stort spørsmål. Yeah. PUBLIKUM: OK. Så hva var runtime for trie? HANNAH Blumberg: Sure. Så runtime for en trie for lookup kommer til å være konstant tid. Så det er bare kommer til å være den antall bokstaver i ordet. Det er ikke avhengig Størrelsen av ordlisten eller størrelsen på datastrukturen. Så her er en litt enklere eksempel. I dette tilfellet, kan du se at ordet balltre er i ordlisten og du har zoom, men du har ikke noe sånt zoo. Hvordan ville vi lage dyrehage? Hvordan legger vi zoo til vår ordbok, til vår trie? Yeah. PUBLIKUM: Gjør is_word sant for [uhørbart]. HANNAH Blumberg: Good. Så vi vil si Z-O-O, og da ville vi ønsker å sjekke ut den boksen også. Flott. La oss sammenligne svært kort forsøker versus hash tabeller. Prøver er virkelig flott fordi, som vi sa, de gir konstant-tid oppslag. Men den store ulempen er at de er enorme. Du kan få den forstand, selv ved å se på det, at det kommer til å ta en enorm mengde minne. Så de kommer til å være mye større enn hash tabeller, men de kommer til å gi oss mye raskere oppslags ganger. Så det er på en måte din kompromisset, hva du bryr deg om, enten det er fart eller minne. Eventuelle spørsmål om noe av det, alle de C-datastrukturer. Vakker. OK. Vi kommer til å flytte til en liten litt av webutvikling med Maria. MARIA ZLATKOVA: Lovely. OK. HANNAH Blumberg: Du kan bruke min laptop. MARIA ZLATKOVA: Nice. Ok kult. Ettersom vi flytter nå til web utvikling, vi snakket litt om endrede tillatelser av filer og kataloger slik at de kan være tilgjengelige til andre brukere, til verden, og slik at vi kan se hvordan utgangspunktet vi kan formidle dem når vi utvikler ting som nettsteder at vi har stort sett gjort. Så vi så chmod kommandoen, som er endringsmodus, i utgangspunktet. Det er en Linux-kommando og det endrer tilgangstillatelser av filsystem stedene. Og et filsystem objekt er bare en katalog, en fil, noe som du kan endre rettighetene på. Så for å se filrettigheter, vi skriver kommandoen ls, en liste -l. Og når vi skriver at vi vanligvis ser noen tillatelser som ser liksom som dette foran et katalognavn. Så d refererer til katalogen. Og så har vi tre triader som i utgangspunktet refererer til de tillatelsene til enten en bruker, en gruppe, eller hele verden. De typer tillatelser som vi kan har for disse tre grupper av mennesker er enten r for lese, w for skrive, og x for å gjennomføre. Og vi kan ha dem for gruppen og verden også. Den vanskelige ting er at noen ganger når vi skriver chmod kommandoen, vi ville skrive noen nummer som besto av tre bits. Slik at vi kunne gjøre som 777 og som i utgangspunktet henvist til merverdi av hver av disse treklanger fordi r vil vise til fire, ville w henvise til 2, og x vil henvise til en, slik at når det legges opp, hvert av numrene ville komme ned til en kumulativ nummer til en kumulativ verdi mellom 0 og 7. Så kunne vi også ha 0 for ingen tillatelser i det hele tatt. Og det ville i utgangspunktet gi oss tillatelsene for enten brukeren, gruppen, eller verden. Eventuelle spørsmål om dette så langt? PUBLIKUM: Du sa leste var fire? MARIA ZLATKOVA: Ja. PUBLIKUM: [uhørlig]. HANNAH Blumberg: Yup. PUBLIKUM: Og så ved å legge alle dem andre ville indikere nummeret ditt. MARIA ZLATKOVA: Yeah. Yeah. Dette er store spørsmål. Deilig. Deretter hoppet vi inn i HTML og et litt mer om webutvikling. Så HTML betyr bare Hypertext Markup Language. Og det er markup språk som er en standard at det er brukt til å lage websider. Det kalles et kodespråk fordi det er faktisk ikke utarbeidet. Det sier ikke hvordan noen kode skal bli henrettet eller noe sånt. Det avtegner bare og beskriver hvordan en web side bør settes opp med hver av dens elementer og hvordan de skal se ut for brukeren. Noen av HTML-koder som vi gikk over er følgende. Alle våre HTML-dokumenter startet med DOCTYPE html. Så vi har alltid html tag. Vi har et hode og en kropp. Og det er viktig at HTML har denne typen nestet struktur fordi det er helt klart. Og så blir det veldig tydelig når vi trenger å åpne og faktisk nære koder. Og vi trenger alltid å lukke koder som vi har åpnet. Og her har vi noen av de typer ting fremover som vi ønsker å ha. Så vi har, for eksempel, tittelen CS50. Og da er vi faktisk kan knytte et stilark som definerer hvordan vi style våre nettsider. Det er CSS. Vi kommer til å gå over det i neste par lysbilder også. I kroppen, setter vi noen klasser og IDer. Og som en påminnelse, igjen, IDer er unike og klasser kan tildeles flere elementer. Og det betyr bare at vi kan bruke klasser og IDer innenfor andre structures-- så, for eksempel innen CSS-filer eller stil sheets-- å referere til bestemte elementer og i utgangspunktet si at vi ønsker å style eller lage noen element på noen bestemt måte. Og vi referere til dem ved å sine IDer og klasser. Og vi kan også henvise til forskjellige ting etter koder også, men IDer og klasser bare gi oss noen allsidighet og hva som konkret vi ønsker å referere til. Så bare et eksempel. Vi kan, igjen, innen en CSS-fil hvor vi ønsker å definere noen style-- så farger, fonter, og sånn at-- vi kan definere stilen for en kropp. Så det ville definere det for hele kroppen tag. Men da kan vi også definere en stil for en #title. Og igjen, refererer hashtag til vår ID og dot refererer til klassen vår. Og deretter for de .info, vi kan også stille noen attributter. Og igjen, når vi går tilbake, hadde vi vår klasse kalt info og vår ID tittel. Og vi kan se at vi referere til dem ved #title og .info. PUBLIKUM: Vil du si hashtag [? adoptere meg? ?] MARIA ZLATKOVA: Sorry? PUBLIKUM: Vil du si hashtag [? adoptere meg? ?] MARIA ZLATKOVA: Hashtag betyr ID, så #title refererer til uansett elementer har denne ID kalles tittelen. Og deretter dot refererer til en klasse. Så .info refererer til dette elementet fordi den har klassen info. Jepp. PUBLIKUM: Hvorfor gjør du skille dem i HTML? Hvorfor sier du visse ting er IDer og visse ting er klasse? MARIA ZLATKOVA: Det er bare opp til you-- HANNAH Blumberg: Gjenta spørsmålet. MARIA ZLATKOVA: Oh, sorry. Hvorfor skiller vi gjør visse elementer som IDer og andre elementer som klasser? Det er bare fordi det er virkelig ofte et designvalg. Det gir deg mye allsidighet i å være i stand til å si at jeg vil ha dette bestemt element å ha dette ID fordi de ønsker til å gjøre en rekke ting med det, og jeg bare ønsker å definere en stil, viss stil eller farge uansett for det elementet. Og den måten å gjøre det er bare å gi det en ID. Og så hvis jeg vil ha et par forskjellige elementer har det, i stedet for gå og sette their-- stedet for å gjøre det ved å tag fordi tag ville setter cellen for hele tag for hver gang den koden er brukt, du kan sette en klasse til flere elementer. Og så bare få tilgang til den klassen og si Jeg ønsker å style denne klassen på den måten. Og igjen, klassen kan være flere ulike elementer og ID må være unik. Store spørsmål. Eventuelle andre spørsmål? OK, awesome. Igjen, dette er hvordan disse velgere refereres til i CSS, med hashtag, med prikk, eller uten noe for tildele stilen av noen tag, som kroppen. Og her har vi den generelle Syntaksen for hvordan dette gjøres. For å gjenta noen beste praksis for HTML og CSS, vi må, igjen, lukk alle HTML-kodene som vi kan åpnes. Og hva vi anbefalte deg gjøre for din endelige prosjekter, så vel som for CS50 økonomi, er å gjøre sørge for at alle HTML validerer. Og det er gjort med W3 Validator. Og så hva vi gjorde og hva vi anbefale å gjøre er å skille stil, så CSS fra markup HTML. Så alt som er relatert til hvordan siden din kommer til å visuelt se og hvordan det kommer til å bli endret bør gå inn i et CSS-dokument. Og deretter din markup si hvordan ting er i forhold til hverandre er HTML, og som bør gå inn av HTML-dokumenter. Noen spørsmål? Mhm. PUBLIKUM: Hva kommer på med siden validering når vi validere HTML at [uhørbart] skapt? MARIA ZLATKOVA: Så what-- tenke deg. Så hva som skjer på med siden validering og hvorfor trenger vi å gjøre det? I utgangspunktet må vi gjøre det fordi en rekke ganger, nettleseren din, hvis du ikke lukke en tag eller noe sånt, Nettleseren din er fortsatt kommer til å gjengi en side og kan fortsatt fungere, men det er best praksis å sørge for at du har, igjen, lukket alle kodene, at alle elementene er den måten at de bør være, og i utgangspunktet at det er av konvensjoner som er forhåndsinnstilt. Det er, igjen, bare en ting som du bør skal lære å gjøre, i motsetning til å måtte sloppier kode og sånt. Yeah. Åh unnskyld. Jeg trodde du var å heve hånden. PUBLIKUM: Nei, jeg var bare [uhørbart]. MARIA ZLATKOVA: OK. PUBLIKUM: Takk. MARIA ZLATKOVA: Selvfølgelig, takk. Så igjen, skjer i hvordan informasjon overføres og kommunikasjonsmodeller å overføre informasjon. TCP / IP. TCP betyr bare Transmission Control Protocol og IP refererer til Internet Protocol. Og som bare refererer til måten data er levert. Hvis vi har noen data som må leveres til you-- så du gjør en anmodning om en bestemt server. For eksempel når vi prøver å få tilgang cs50.net, vi gjør en forespørsel til den CS50 server og vi se at vi ønsker å få denne typen informasjon. Og så er basert på denne protokollen for hvordan denne informasjonen blir levert, serveren gir informasjon tilbake til oss, klienten. Og da er vi i stand til å se informasjonen for siden og deretter bruke den. Så da Hypertext Transfer Protocol er bare en annen protokoll eller angi av konvensjoner som definerer hvordan nettleseren og webserveren bør kommunisere. Og sette dette alt sammen, HTTP, igjen, bare definerer hvordan dette hyper definert av HTML som vi har jobbet det, hvordan det skal bli levert til deg og hvordan dataene som leveres til deg kommer til deg. Og det er derfor, hvis dere husker fra en klasse, hadde vi mange forespørsler og vi hadde mye syntaks for disse forespørslene som vi er kommer til å gå over akkurat nå. Så igjen, når vi sender en anmodning til en server, vi må definere et par ting. Så vi trenger å finne den typen forespørsel som vi innstillingen. Og igjen, har vi, for eksempel, GET er en type metode som vi har i vår forespørsel. Og deretter HTTP / 1.1 er bare protokoll som vi bruker i dag. Mesteparten av tiden, er at å gå til protokollen som vi bruker. Så hvis du har et spørsmål sånn på quiz. Det er konvensjonene at vi har så langt. Backslash refererer til hva slags av tingene vi ber om. Deretter, er vår vert, for eksempel i denne tilfellet, prøver vi å gå til google.com. Så dette er verdien for en vert. Dette er en form for forespørsel som kan bli sendt. Og så en type respons som kunne sendes, igjen, basert på denne protokollen, er igjen, HTTP / 1.1. Så det er HTTP-versjonen igjen. 200 OK er bare statuskoden. Og det OK er bare en frase basert på at statuskode. Og så Content-Type henviser til den typen som er returnert til deg som er for at web-side som du mottar og at nettleseren kan gjengi etterpå. Og det er text / html. PUBLIKUM: Hva betyr 1,1 bety? MARIA ZLATKOVA: Det er bare versjon of-- oh, hva betyr 1,1 bety? Det er bare den versjonen, HTTP versjon av en protokoll som vi bruker. Stort spørsmål. Andre spørsmål? PUBLIKUM: Kan du oppsummere Content-Type virkelig rask? MARIA ZLATKOVA: Slik at er hva serveren. den type information-- hva som er innholdstype var spørsmålene. Så det var typen informasjon som du får tilbake fra serveren, typen data at nettleseren kan deretter gjengi at du bruker. PUBLIKUM: Er det det dette protokollen er å fortelle deg å gjøre? MARIA ZLATKOVA: Sorry? PUBLIKUM: Er det det protokollen si? MARIA ZLATKOVA: The protocol-- PUBLIKUM: --hva den Content-Type er eller what-- MARIA ZLATKOVA: Protokollen er basert on-- hva er protokollen forteller deg? Det er bare slik at denne informasjonen ble levert til deg basert på hva slags protokoll ble denne informasjonen fikk levert tilbake til deg. Betyr det fornuftig liksom? HANNAH Blumberg: Du kan tenke på protokollen som a-- jeg tror Professor Malan beskrev det i klassen som typen som a-- det er som tilsvarende menneskelig handshaking. Si, som, hei, jeg er en forespørsel, og jeg vet hvordan de skal håndtere HTTP av versjon 1.1. Og deretter serveren sier, oh, OK, I-- og begge finnes. Jeg vet også hvordan man skal håndtere HTTP / 1.1. Og jeg kommer til å gi du sikkerhets noe av innholdet. I dette tilfellet vil det å være av typen text / html. Så det er på en måte bare en måte av dem for communicating-- MARIA ZLATKOVA: Det er bare som bekrefter at du er både å følge den samme protokoll og at både klienten og server-- så nettleseren din og server-- vet liksom hva du er snakker om og har konvensjonen for bestått i data. PUBLIKUM: Så Content-Type part-- Content-Type tekst / er html-- at en egen del av den samme meldingen? Eller er det en del av la oss si, 200? Betyr 200 fortelle dem det, eller er-- MARIA ZLATKOVA: 200 sier alt gikk OK. Og så innholdstype er liksom en egen del av den samme meldingen, og sier ting som jeg Returnerte har denne typen text / html. Det er bare å gi mer informasjon. Har noe å legge til? OK. Eventuelle andre spørsmål om dette? Awesome. Så noen andre HTTP statuser som vi kunne få i tillegg til 200 OK, de som vi har sett kanskje muligens mye er 403 og 404. Så 404, hvis du prøvde å tilgang noe som ikke eksisterer. Så for eksempel i ditt CS50 Finans psets, hvis du hadde vært rende quote.html og du ikke har denne filen, men i stedet du hadde quote.php, som ville resultere i en 404 Not Found fordi filen kanskje ikke eksisterer. For en 403 forbudt, at refererer til de tillatelser. Så hvis noen filen ikke kan leses av verden, kan du få en 403 returnert. Noen andre som du kanskje get-- 301, flyttet permanent; 302, Funnet; 304, Modifisert; 400, Bad Request; og deretter Internal Server Error for 500 og 503, Tjenesten er utilgjengelig. Ja. PUBLIKUM: Vil vi forventet å memorere alle disse statuser? MARIA ZLATKOVA: Jeg ville ha dem på jukselapp. [LATTER] PUBLIKUM: Er vi forventet å vet hva som utløser hver av dem? MARIA ZLATKOVA: Er de? HANNAH Blumberg: For de som vi har kjøre into-- så spørsmålet var-- MARIA ZLATKOVA: Er de forventes å vet hva hver enkelt av disse status koder kan utløses av? Så for de som vi har brukt og kjørte inn i, vil jeg si, ja. Så vi har definitivt sett 200 OK og foreleste den i psets. Vi har sett 403, 404. For andre? HANNAH Blumberg: Jeg ville si 500 virker rettferdig spill. MARIA ZLATKOVA: 500, ja. HANNAH Blumberg: Yeah. Bare ta en generell følelse av hva som forårsaker dem. Og også bare ved disse navn, kan du på en måte som gjør en kvalifisert gjetning til hva som faktisk forårsaket dem. For eksempel flytte permanent, sannsynligvis filen ble flyttet permanent. PUBLIKUM: Men på en tidligere undersøkelse, var det en så hvordan kan du forvente oss å svare på det? HANNAH Blumberg: That var verdt null poeng. Spørsmålet om 418 på tekanne er teknisk sett en HTTP status, men det var verdt null poeng. Selvfølgelig, er du ikke forventes å kjenne dem. PUBLIKUM: Er det en ekte en? HANNAH Blumberg: Det er en reell en, men det betyr ikke noe. Det er bare en spøk. Internett folk er morsomme. MARIA ZLATKOVA: Flotte spørsmål, folkens. Eventuelle andre spørsmål? PUBLIKUM: Hva er intern serverfeil? MARIA ZLATKOVA: Intern serverfeil bare betyr at du har vært ute av stand til å kommunisere med serveren for noen grunn. Så det er ikke nødvendigvis noe som har å gjøre med klienten eller noe sånt. Jeg vet ikke om noen konkret eksempel at vi har gått over til å forklare, men ja. HANNAH Blumberg: Sure. Så for eksempel, som la oss si at du jobber på mashup og en Google server gikk ned for noen Derfor et strømbrudd, la oss si. Det ville være en intern server feil eller en slags of-- liker deg ville ikke få et svar tilbake. MARIA ZLATKOVA: Yeah. Det er bare når du er ute av stand til å kommunisere med serveren eller annen grunn fordi av den går ned eller en annen grunn. Så hoppe inn i PHP. PHP, i motsetning til HTML, er en programmeringsspråk. Og vi begynte å bruke det fordi det er svært nyttig for webutvikling. Vi først brukt det i CS50 Finance. Og det i utgangspunktet hjelper oss med å bringe sammen denne markeringen, design, og hvordan vi faktisk bruker informasjon å vise ting på en nettside. Så PHP seg selv betyr PHP Hypertext Preprocessor, så det er en rekursiv backnorym av seg selv. Og åpne koder for PHP vi venstre og høyre piltast med spørsmålstegnene og php. Så vi har allerede sett en haug av det. Nå er vi bare nødt til å gå over noen av de grunnleggende ting om det. Så med PHP, variabelen navn som begynner med dollartegn. Vi vil ikke spesifisere, igjen, en variabel skriver lenger. Akkurat som vi gjorde med C, vi trenger ikke å gjøre det. Vi kan gjøre en haug med forskjellige ting med variabler. Vi kan sette dem sammen ved å lenke sammen dem med dot notasjon, som Vi kunne ikke gjøre i C igjen. Igjen har vi en litt mer allsidighet med PHP i form av variabler. Igjen, har vi ikke en hovedfunksjon. Og PHP er tolket i motsetning til kompilert, Så bare hvordan vi gjorde for C-filer, vi trenger ikke å gjøre det for PHP. Men heller, slik at språket drives av seg selv, blir det tolket. Og så løst skrevet betyr bare at vi trenger ikke å angi en variabel type og de variable typer forstås under kjøring. PUBLIKUM: Men hva gjorde du mener med dot sammensetning? MARIA ZLATKOVA: Sure. Når vi ønsker å sette ting together-- så hvis vi hadde noen variabel som hadde verdien av tre, og vi hadde en annen variabel som hadde verdien av strengen, vi kunne sette variablene sammen ved å sette et punktum i mellom dem og sette sammen dem. Eller vi kunne skape en variabel kalt navn og sette det sammen med lenke sammen to strenger. Så hvis vi hadde en streng i dobbel sitater og vi setter en prikk etter det, og da vi hadde en annen streng, at ville skape en streng helt. PUBLIKUM: OK. MARIA LATVIA: Var det fjerne? PUBLIKUM: Yeah. MARIA ZLATKOVA: OK. Ja. PUBLIKUM: Når du sier tolket heller enn kompilert, snakker du om du ikke gjør det trenger å være så konkret når det kommer til PHP versus C? MARIA ZLATKOVA: Når vi sier tolket i motsetning til kompilert, hva mener vi? Så det betyr at vi ikke trenger kjørbare filer for å kjøre PHP. Det betyr at det går som det går. Gir det mening? Litt mer. HANNAH Blumberg: Så du kan tenke på tolk som et annet program som er ansvarlig for å gå linje for linje gjennom PHP og faktisk gjennomføre det, i motsetning å sammenstille det hele ned til binær. Det spiller egentlig ikke betyr noe om hvordan bestemte vi trenger å være. Vi trenger fortsatt å være presis, og gjør ikke glemmer semikolon, og sørg du har din dollartegn, og sånt. Godt spørsmål. MARIA ZLATKOVA: Yeah. Så linje for linje, som i motsetning til med C-filer, vi må gjøre hele finalen før vi faktisk kan kjøre den. Det er den største forskjellen. Men igjen, kan vi ikke virkelig være mindre spesifikk. Så arrays i PHP representerer faktisk en ordnet kartet. Så arrays knytte verdier til tastene. De to måter å erklære en array, basert på denne syntaks, vi kan være mer eksplisitt i å si har vi en rekke og vi har denne nøkkel1 som er tilordnet dette verdi1, NØKKEL2 som kart verdi2. Eller vi kan bare lage en matrise som inneholder verdiene seg og deretter tastene er forstås på en måte. Eventuelle spørsmål om dette? Målgruppe: Hva ville nøkler være i det andre eksempel? 0, 1, 2, 3? MARIA ZLATKOVA: For eksempel er det bare nøklene i dette ikke nødvendigvis gjør en forskjell. De bare definere hvordan du kan bruke verdiene på innsiden av det. Så hvis vi hadde en foreach sløyfe i PHP som ville tillate oss å gå gjennom alle verdiene, vi kan gå gjennom alle verdiene, selv om vi hadde eller ikke hadde definert en bestemt nøkkel innenfor områdets forrige syntaks. Så selv med denne typen av array, kunne vi fortsatt har en foreach løkke som går gjennom hver av verdiene i nøkkelen i rekken. Så syntaksen til en foreach sløyfe, starter vi med en matrise. Denne $ arr variabelen er vår faktiske utvalg at vi definert i forrige lysbilde som verdi som bokstavelig talt går gjennom hver av verdiene Uansett vær vi hadde en nøkkel eller ikke. Og så kan vi gjøre noe med verdien innsiden av foreach sløyfen. Så igjen, hvis vi hadde en rekke som dette her created-- så vi har nøkkelen til foo og verdien av bar, nøkkelen til Baz og verdien av qux-- vi kan ha en foreach loop som går gjennom matrisen som nøkkelverdi og deretter gjøre noe med nøkkelen og / eller verdi. Men vi gjør ikke nødvendigvis alltid må ha en foreach løkker som går gjennom matrisen som sentrale kartet til verdi. Vi kan gå via foreach løkke matrise som verdi. HANNAH Blumberg: Og jeg tror to-- var spørsmålet ditt, hva er den implisitte indeksen? PUBLIKUM: Kinda. MARIA ZLATKOVA: Oh. HANNAH Blumberg: Ja, ja. Så i utgangspunktet, hvis du ikke angir en nøkkel, kommer det til å være 01. MARIA ZLATKOVA: Yeah. Akkurat som med C, er det null indeksert hvis du ikke angir en nøkkel. PUBLIKUM: Sorry. Kan du prøve å snakke litt høyere? Jeg har en liten bit av problemer med å høre alt. MARIA ZLATKOVA: Jeg er så lei meg. Ja selvfølgelig. Så ønsker du å meg å gå over dette igjen? Eller er dette-- PUBLIKUM: Så på den forrige slide-- hvis du bare kunne gå tilbake i ett sekund. MARIA ZLATKOVA: Selvfølgelig, beklager. PUBLIKUM: Så den andre matrise her ikke ser ut til å ha en verdi å taste, på en måte [? årsakssammenheng. ?] MARIA ZLATKOVA: Høyre, høyre. PUBLIKUM: Så hvordan fungerer det når du sier det er alle eller ingen. For meg ser ut som en [? foo?] allerede. MARIA ZLATKOVA: Ja, ja. Så igjen, er dette en bestilte kartet i denne forstand at det ikke er forstått, for eksempel indeksene her kan forstås som 0, 1, 2, 3. Igjen, det er å ha dem indekser tilsvarer vår av å ha nøkler kartlagt på verdier. Så hvis våre viktigste var 0-- beklager. HANNAH Blumberg: Nei, det har kritt opp her. Det er faktisk veldig hyggelig. MARIA ZLATKOVA: Det er flott. OK. Så igjen, ville $ arr 0 være nøkkelen for verdien 1. 0 ville være nøkkelen for verdien 1. PUBLIKUM: Jeg beklager. Det er usynlig. HANNAH Blumberg: Greit, nevermind. Kritt var en dårlig idé. Jeg tar det tilbake. Du kan tenke på tastene som 0 kart til verdien 1. MARIA ZLATKOVA: Yeah. Så dette er 0, er dette en, to, tre. Disse kan være nøklene. Du kan tenke på dem as-- ja. Så i stedet for å ha eksplisitte tastene, de er liksom forstått som indeksene starter på 0. Kritt hjalp ikke. Yeah. PUBLIKUM: For foreach loop, hvis vi ønsket å se som verdi, det ville bare automatisk indeksen til 0? MARIA ZLATKOVA: Yeah. Det ville gå gjennom hver av verdiene. PUBLIKUM: [uhørbart] som 0 eller ville det bare gjøre 0? MARIA ZLATKOVA: Du ville ha å si som dollartegn og deretter noen variabelnavn, verdi. PUBLIKUM: [uhørlig]. MARIA ZLATKOVA: Sorry? PUBLIKUM: Beklager, jeg er bare prøver å huske. Hvordan vil du at hvis du kan gjøre det automatisk indeksering er bare 0 av? MARIA ZLATKOVA: Så hvordan ville du gjøre det hvis du ikke har bestemt nøkkel navn? PUBLIKUM: Yeah. MARIA ZLATKOVA: Du ville bare define-- bare si deg selv som noen navn. Så i dine psets, dere kanskje Husk foreach $ p $ rekker, vi skapt oss selv denne $ rad sier vi ønsker å gå gjennom p $ rader. Selv om vi ikke har dette eksplisitt $ rader definert, vi kunne bare gå og sier dette kan være vår nøkkel, og bare gå gjennom hver av verdiene. PUBLIKUM: Så er verdien en ny variabel vi skaper for å lagre [uhørbart]? MARIA ZLATKOVA: Så det er ikke iboende en ny variabel. Det er en variabel som refererer til inne i matrisen for hver av dem. HANNAH Blumberg: Det er en ny variabel navn. MARIA ZLATKOVA: Ja, det er en ny variabel navn, men det er ikke inherently-- ja. Det er bare en ny variabel at du kan gjøre det. Så bare hvordan vi gjorde $ rad som $ rader, rader var en ny variabel navn som vi kunne skape i vår foreach loop. Det trenger ikke å preexist før det. PUBLIKUM: Kan du gå gjennom logikk for hver, ved hjelp av eksempel er det? MARIA ZLATKOVA: Mhm. Åh unnskyld. Her er et eksempel. Ja visst. Så for hver array-- så det betyr gå til denne matrisen som sentrale value-- som kommer å gå gjennom denne matrisen og først gå og få foo, den Nøkkelen foo og verdien bar. Og deretter på den andre gjentakelse av for loop, det kommer til å gå gjennom og ta nøkkelen baz og verdien qux. Og så kan du gjøre noe med en av dem eller begge. PUBLIKUM: Så ideen bak å ha et sentralt punkt til verdien, hva gjør du ende opp med å få tilgang til? MARIA ZLATKOVA: Hva er ideen av å ha en nøkkel som peker til verdi? Det er bare en annen konvensjon, en annen måte å gå gjennom rekke og å kunne få tilgang enten nøkkel eller verdien eller begge deler og bruker dem. PUBLIKUM: Hva er rollen for pålegg om foreach kjører i? Så hvis vi skulle legge elementer i matrisen senere ville de være de første kalles i foreach array, eller ville det være senere? MARIA ZLATKOVA: Så hva er rekkefølgen at foreach sløyfe går gjennom en rekke i? Det går gjennom den første element til det siste element, til det siste ekstra element. Hvis du legger til elementer senere, ville de bli accessed-- de første elementene ville nås som den første elementer i matrisen, og så vil du gå gjennom hver av elementene som liksom en ordered-- ikke en ordnet, men den måten at de har blitt satt inn i matrisen. PUBLIKUM: Så nye elementer legges senere? Så de added-- de vil være siste som i [? iterasjon. ?] MARIA ZLATKOVA: Nye elementer can-- utgangspunktet, når nye elementer legges til, blir de lagt til slutten av tabellen? PUBLIKUM: Yeah. MARIA ZLATKOVA: Jeg tror det. Ja. Og så med foreach loop, etter at du har lagt til nye elementer og du går gjennom dem, de nye elementene ville være accessed-- den nye element, hvis det er lagt siste, ville det være tilgang sist. PUBLIKUM: Kan du bare gi et eksempel av noe som ville [uhørbart] med noe med verdi som [uhørbart] eller verdi, liker hvordan du vil formatere det? MARIA ZLATKOVA: Sure. Kan jeg gi et eksempel på hva vi ville gjøre med verdien? Så hva dere kan bli kjent med er at vi har gått gjennom en rekke og i utgangspunktet skrives hvert av elementene, for eksempel som en del av en sortert liste eller noe som. Betyr det fornuftig eller ønsker vi to-- PUBLIKUM: Kan vi skrive ut disse verdiene ut? MARIA ZLATKOVA: Ja, vi kunne skrive ut og deretter i utgangspunktet $ verdi fordi på som bestemt verdi, vil vi være skriver verdien på innsiden av det. Så hvis vi var på vår første iterasjon av det og vi skrives $ verdi, vi vil være utskrift bar. PUBLIKUM: Er det også for løkker i PHP eller bare foreach løkker? MARIA ZLATKOVA: Det finnes også etter looper i PHP. Og deres logikk er det meste samme som det du har vært vant til. PUBLIKUM: Så verdien er null. MARIA ZLATKOVA: Det er som det samme. Yeah. PUBLIKUM: Jeg skal bare spørre. Så når du deklarerer en array, trenger du ikke å fortelle hvilken størrelse det kommer til å være, noe som betyr at du kan bare legge til og ta bort elementer [uhørbart]. MARIA ZLATKOVA: Yup. Jepp. Nettopp. Når vi erklære en matrise, vi trenger ikke å si hvilken størrelse det er, så vi kan bare legge til elementer på det senere også. Flere spørsmål? Så bringe PHP og HTML sammen, hva vi har seen-- godt, for eksempel, i dette eksempel, har vi et HTML-skjema som har en inngang felt. Og inntastingsfeltet er bare navn og da den har en Send-knappen. Og når du trykker på Send inn knappen i vår hello.php fil, fordi metoden for formen er får, kan vi få tilgang til alt som er på navn etter dette få global variabel som er-- syntaksen for det er $ _GET. Og så kan vi få tilgang uansett brukerundersøkelser innsiden av den form for navn ved å angi navnet på det feltet. Eventuelle andre spørsmål eller noe spørsmål om dette konkret eksempel? PUBLIKUM: Hvor er PHP? MARIA ZLATKOVA: Her. Så dette er vår åpning tag for PHP. PUBLIKUM: Oh, ikke sant. MARIA ZLATKOVA: Ja. HANNAH Blumberg:? The = er stenografi for dette er PHP og bare ekko. PUBLIKUM: Oh. MARIA ZLATKOVA: Ja, beklager. Jeg burde ha gjort det klart. HANNAH Blumberg: Print. MARIA ZLATKOVA: Det er bare funksjonen som tillater oss å skrive ut noe. Stort spørsmål. Så going-- ja. PUBLIKUM: Er det kommer til å være ganske litt av hånden koding av PHP og HTML på quiz en? MARIA ZLATKOVA: Det kan være en god del tolkning av PHP og HTML, ikke nødvendigvis som en enorm mengde koding, selv om du kanskje nødt til å skrive et foreach loop, skjønt, en for loop. Noen av løkker som vi dekke her er fritt vilt. Og det er stort sett det. HANNAH Blumberg: Jeg vil være forberedt. På samme måte som ba vi deg til å skrive en haug med C-funksjoner på quiz 0, Jeg ville være forberedt på å gjøre det samme i PHP og Javascript. MARIA ZLATKOVA: Yeah. HANNAH Blumberg: Jeg vil si en little-- som vi ikke kommer til å få deg til å skrive en stor HTML side bare fordi det er en liten bit langtekkelig, men du kan ha deler. Det er helt fair game. Som liten HTML-side, helt fair. PUBLIKUM: OK. Hva med i Javascript så vel? HANNAH Blumberg: Yeah. Javascript er fritt vilt. MARIA ZLATKOVA: Yeah. Det er helt fair game. HANNAH Blumberg: Vi får som den i 10 minutter. MARIA ZLATKOVA: SQL, igjen, Structured Query Language. Det gir i utgangspunktet oss å administrere data i en relasjonsdatabase system. Som bare betyr i utgangspunktet at vi har et sted til å lagre noen data som vi kanskje vil bruk i et nettsted, eller i noen annen form. Og så har vi spørsmål for å få opplysninger fra vår database, eller sette inn informasjon i dem. Mye av felles ones-- UPDATE, INSERT, SELECT, og DELETE. Så for UPDATE, er denne syntaksen for oppdatering av data i en database. Oppdatere denne tabellen kalt tabellen ved å si SET, vi kan sette noen verdier i det hele tatt rader til lik noe annet. Så vi kan også angi noen spesifikk oppføringer som vi ønsker å endre og som kan være hjelp DER. Og vi kan spesifisere at vi bare ønsker å modifisere noen rader der huset for, hvis vi hadde et bord av studenter og alle elevene hadde hus, så vi ville bare endre noen verdier hvor et hus er lik Currier, for eksempel. For INSERT, kan vi sette inn visse verdier i en tabell. Så INSERT INTO tabell, og deretter verdiene, og deretter i parentes oppgir vi hvilke verdier du vil sette inn. Så INSERT INTO tabell, col1 og col2, er verdien VAL1 og val2. Så dette setter i utgangspunktet en ny rad inn en tabell som inneholder verdiene 1 og 2 under kolonnene 1 og 2. Og så skal vi gå over en rask eksempel på hvordan dette ser ut som i vår database litt. Men dette siste spørsmålet som jeg tror vi kommer til å gå over, SELECT, det bare gir oss for å velge data fra en tabell å muligens bruke det etterpå. Og måten vi gjør dette er at vi bare lagre den på en eller annen variabel. Og så kan vi muligens bruke det igjen. Så SELECT stjerne betyr velge alle. Det er bare en forkortelse for å velge alle. FROM tabell WHERE, er vi på jakt for noen bestemte vilkår, så der kolonne lik noe, for eksempel. Hvis vi bare ønsket å Velg alle fra bordet, dette bare velger alle kolonner og alle rader fra en tabell. Og deretter DELETE FROM tabell HVOR col lik noe, dette bare sletter noen rad fra vårt bord hvor vi har noen spesifikke forhold. I dette tilfellet, vilkårene er kolonnen tilsvarer noe. Så bare en rask eksempel på dette. Hvis vi har denne tabellen til høyre her, og vi sette det inn i en tabell, disse verdiene, som ville sette inn en ny rad. Og hvis vi hadde auto-økning, ville dette bare øke vår-ID fra 0 til 1 for å 2. Hvis vi valgt alt fra studenter, det bare returnerer alle felt og alle radene. Hvor året er større enn eller lik 2016, det ville bare tilbake Hannah og meg selv. Og så hvis vi bare valgt år id og år fra studenter hvor huset er Cabot House, som ville, igjen, tilbake Hannah og meg selv. Så hvis vi slettet fra studenter der navn er lik Rob, som ville slette hele raden. Og så hvis vi setter navn, UPDATE studenter SET navn tilsvarer Daven HVOR huset er lik Cabot House, er det kommer til å gå til de radene og deretter oppdatere navnet. Og så et par SQL datatyper er Røye, VARCHAR, INT, og flyte. Disse er fritt vilt. Jeg vil gå over igjen og sørg for at du vet og ha dem på jukselapp, hva hver enkelt av disse tegnene har vært brukt for, hva du brukte dem på psets, og pass på at du er kjent og komfortabel med å måtte velge fra forskjellige data typer i din PSet. Ja. PUBLIKUM: Hva var det bordet lagret? Ja, hvor er denne tabellen lagres? MARIA ZLATKOVA: Vel, akkurat nå, er det ikke lagret. Uansett, hvor er denne tabellen lagres? Men det kan være lagret i en database SQL. PUBLIKUM: Og hvor er SQL database? I datamaskinen, online et sted, serveren? MARIA ZLATKOVA: Det kan være en rekke forskjellige ting. HANNAH Blumberg: Vi har tilkobles med SQL-tabeller for det meste med phpMyAdmin. Så vi kunne spørre en server til å lagre dem for oss. Vi kunne lagre dem på vår egen datamaskin. MARIA ZLATKOVA: Det avhenger bare av hvordan du vil gjøre det selv. Men vi har vært lagring dem, som Hannah nevnt, på phpMyAdmin, som er online. Og så måten vi bruker PHP og SQL, vi lagre den inn i noen variable hva vi har spørres etter. Så hvis vi Merk alt historie hvor user_id lik SESSION id, som vil velge alle radene for den spesifikke person som logges inn fra historien bord og sortere dem i rader. En kul ting å vite er at CS50 søket til funksjon beskytter mot SQL-injeksjon koder. Det betyr bare at det gjør at innspill som er kommet er riktig og at personen som går inn inngangs prøver ikke å legge inn noen ondsinnet kode for å enten slippe våre tabeller eller slette alt innsiden av vår database. En rask oversikt over Model View Controller modell, det er bare en måte å organisere og tenker på kode. Det er nytt, et design paradigme. Hva det betyr er at vi can-- og det er god praksis å skille ulike deler av koden vår og hva de kontrollere inn i disse tre paradigmer. Så vårt syn er oftest vår maler, vår layout, vei at vi setter hvordan koden vår ser ut. Det er stort sett våre CSS-filer og måten at vi definerte utformingen av vår kode, i utgangspunktet. Vår kontrolleren er det meste hva vi har gjort med PHP-filer. Så igjen, som arbeider med informasjon som vi har og definere hvordan det Informasjonen brukes og deretter passerer denne informasjonen enten på visning eller modell. Og modellen, måten vi har brukt er har vært vår database, så der vår informasjon er er lagret slik at den har et eller annet sted å leve i, og noen av de kode som er relatert til veien at vi får den informasjonen, eller den måte som vi oppdaterer denne informasjonen. Så i MVC-modellen, HTTP forespørsler sendes til en webserver. Deretter kontrolleren tolker anmodning fra brukeren og deretter validerer brukerundersøkelser. Det er valgfritt om at vi har kontrolleren kommunisere med en modell, slik at noe som vår database eller noen annen funksjonalitet som releer informasjon. Og så til slutt, kontrolleren passerer informasjon på visningen slik at det kan bli gjengitt og at det kan bli synlig for en person tilgang til nettsiden. Noen spørsmål? Awesome. Så igjen, modellen, dens funksjon, igjen, er vedvarende lagring av informasjon, administrere og organisere data. Og det vi har sett så langt er MySQL database og datafiler som kan bruke. View, presentasjon av informasjon til brukeren, UI, eller brukergrensesnitt. Og eksempel på dette er HTML. Og så kan vi ha minimal PHP. Så en for løkke som gjentar i løpet av data som er skrevet ut er en del av visningen, som motsetning til kontrolleren. Og så mange av våre PHP-filer falle inn i kontrolleren kategori. Den håndterer bare bruker ber og får informasjon fra modellen. Hopping i dokument Object Model, dette er bare refererer seg til den måten HTML dokumentene er organisert. Og de er organisert i et tre struktur som har et hierarki. Så hvis vi har tilgang til [uhørbart] representasjon av dokumentet, vi kan arbeide med dokumentet, som vi manipulere objekter i utgangspunktet. Og for å gjøre dette til en litt klarere, når vi har mye av vår ulike koder svare til forskjellige ruter i treet vårt. Og så for dette eksempelet vi har basisdokument node. Vi har altså vår HTML node som deler seg i hodet og kroppen. Hodet har tittel og deretter Tittelen inneholder hallo, verden. Og kroppen vår bare inneholder hallo, verden også. Så noen spørsmål om noen av ting som vi dekket hittil? Og hvis ikke, Hannah vil ta over med Javascript. Awesome. HANNAH Blumberg: OK, kult. Hvis noe kommer opp med PHP eller HTML, eller noen av sakene Maria dekket, vi kan alltid pause. Vi gjør det bedre på tid igjen, så fantastisk. Og bare for å gå tilbake veldig raskt til denne, hvis du ser på hver siste årets eksamen, dette kommer opp either-- her er litt HTML, gjør dette diagrammet. Eller her er dette diagrammet, gjøre noen HTML, så definitivt øve det. Og så det er en garantert spørsmål som du kan få rett. Kjølig. Så la oss snakke om Javascript og hvor det er en liten bit forskjellig fra språk som PHP og C, de to språkene vi så på forhånd. Så nummer én, det er løst skrevet. Det er som PHP, men i motsetning til C. Det er et tolket språk. Igjen, det er sånn PHP, i motsetning til C. Og dette kommer til å tillate oss å use-- det fungerer veldig bra med nettsider. Det kommer til å tillate oss å manipulere innholdet og hvordan det ser ut og hva den gjør. Vi kommer til å se litt av Ajax. Det tillater oss å kommunisere asynkront med forskjellige servere og få informasjon. Og dette er det som virkelig skiller Javascript fra PHP og C er at det er på klientsiden. Både PHP og C er typisk server-side. For det meste, og nesten helt hva vi har sett, i hvert fall i denne klassen, Javascript virker på klientsiden, noe som betyr at nettleseren er faktisk ansvarlig for å kjøre den. Og det betyr at vi ikke trenger å samhandle med serveren. Så det betyr at det kan være mye raskere fordi det er faktisk bare det er Chrome, det er Safari, det er Firefox, uansett hva du bruker faktisk kjører Javascript. PUBLIKUM: Hva betyr asynkron? HANNAH Blumberg: Ah, hva betyr asynkront? Stort spørsmål. Asynkront means-- vel, innholdet i hvilket vi bruker det er, OK, vi oppretter en nettside og vi trenger å få litt informasjon. Så med eksempel på mashup, noen informasjon som vi kanskje vil er artikkelen titler. Nå could-- vi ett alternativ er å gjøre det synkront og det betyr la oss stoppe, går du få artikkelen, få artikkelen tilbake, og deretter gjengi, men det ville være veldig treg. Det ville være en dårlig brukeropplevelse fordi du ville bare bli sittende der venter på noe å svare. Asynkront betyr at vi vil fortsette å gå om vår virksomhet, rende siden, og vi vil sende ut en forespørsel Det er litt å gå på skje i bakgrunnen. Jeg tror vi bruker eksemplet i foredrag for å ringe Rob og sa: hei, kan du se dette opp for meg og komme tilbake til meg, i motsetning til bare meg venter på telefonen. Så asynkront betyr det skjer i bakgrunnen bort fra oss parallelt. Stort spørsmål. Alt annet? Flott. Vi skal hoppe mye mer inn asynkrone forespørsler med Ajax. PUBLIKUM: Har JavaScript-- hvor kommer det falle med modell-view-controller? HANNAH Blumberg: Great spørsmålet. Hvor kommer Script fall med modell-view-controller? Hm. Jeg antar det kan fall-- så vi ikke vanligvis liker å squish det inn som paradigmet, men jeg antar jeg vil si, OK, så Script faktisk kommer til å tillate oss å samle data, tolke data, faktisk gjøre meningsfulle ting med dataene. På den måten er det veldig kontroll-aktig. Men det er også kommer til å tillate oss å vise ting og skrive ut ting. På den måten er det veldig view-aktig. Yeah. Så det er litt som PHP i hvor det kan slags være begge deler. Godt spørsmål. Alt annet? Greit, awesome. Flytte rett sammen. Så la oss se et eksempel på hvordan vi kan bruke Java i en av våre web-programmer. Så jeg vil vurdere dette index.html med en haug med HTML. Og jeg ønsker deg fokusere på er dette skriptet tag. Og dette sier, OK, jeg ønsker å kjøre noen Javascript og her er der den lever. Den lever i hello.js. Og veldig mye som CSS, vi kunne sette Javascript i HTML. Hvorfor kan vi ønsker å skille det ut? Yeah. PUBLIKUM: Lettere å skrive? HANNAH Blumberg: Yeah. Det er enklere å bruke på tvers forskjellige nettsider. Det holder ting renere. Det er bare god praksis. Awesome. Bra svar. Så bra, så dette kommer å være vår index.html. Og deretter ned her er vår bitte liten Javascript-fil. Og all den sier er våken Hei, verden. Så hva skjer når denne siden renders-- så hvis du går til hva nettsiden dette er-- alt som kommer til å skje er det kommer til å si, OK, jeg er kommer til å kjøre denne Javascript-kode. Og denne Javascript-kode bare sier varsling Hei, verden. Så jeg kommer til å få dette vennlige lille pop-up. Kjølig? Det er litt som vår aller første Javascript-program, våre Hei, verden. La oss se litt mer om hva syntaksen til Javascript ser ut. Og spesielt, la oss sammenligne det med C og PHP, som vi har sett før. I Javascript, vi kommer til å ha Var, navnet på variabelen, og deretter den faktiske verdien. Og vi ikke spesifiserer en type, bare som i PHP, men i motsetning til i meget C. Så for eksempel, hvis vi ønsket for å lagre verdien 50 i C, ville vi har å si, hei, C, jeg vil ha et heltall, Jeg kommer til å kalle det Jeg, og verdien er 50. I PHP, er det litt enklere. Vi sier hei, jeg vil ha en variabel heter jeg, og verdien er 50. Svært likt, i Javascript, vi si hei, jeg vil ha en variabel kalt i, verdien er 50. Hver påfølgende tid som jeg bruker jeg, jeg trenger ikke å skrive var. Det er bare jeg fra det punktet på. På samme måte, i C, der når vi sier int i, vi bare bruker jeg. Kjølig? Greit. Flytte til sløyfer, heldigvis, disse nesten ser exactly-- Jeg tror de er nøyaktig det samme som hva sløyfer kommer til å se ut i noe sånt som C der for loop kommer til å ha tre- parts-- en initialisering, en betingelse, og en oppdatering. En stund loop, ser det nøyaktig samme. Vi bare gi det en betingelse. Og en gjør mens loop, igjen, nøyaktig det samme. Vi gir det et vilkår. La oss si at jeg ønsket å veksle over-- Jeg ønsket å gjøre noe fem ganger. I C, kan vi skrive for init jeg er lik 0. Jeg er mindre enn 5, i ++. Eneste forskjellen, i Javascript, stedet for å si int i lik 0, vi sier Var jeg er lik 0. Vakker. Det er den eneste forskjellen. Eventuelle spørsmål om noe av det? Ja. PUBLIKUM: Så i PHP, det er det samme ting, bortsett men som en variabel? Eller var det en VAR eksempel? HANNAH Blumberg: Yeah. Så i PHP, det kommer å være et dollartegn. Så det kommer til å $ i equals 0, $ jeg er mindre enn 5, $ i ++. Stort spørsmål. Nå la oss snakke om funksjons erklæringer. I C, når vi erklært funksjon, vi ga den et navn og vi ga det noen parametere. Og i begynnelsen, skrev vi den type. I Javascript, alt vi trenger å gjøre er å skrive nøkkelordet funksjon som sier, hei, Javascript, Jeg er i ferd med å definere en funksjon. I dette tilfellet har det navn sum. Og det tar to argumenter, x og y. Legg merke til at vi ikke bryr om hvilke typer x og y. Og akkurat som C, har vi dette søkeordet retur, slik at vi kan gjøre noe som avkastning x og y. Og nå når vi har skrevet denne første funksjon, kan vi bruke sum hvor som helst. Og det er helt greit. En virkelig kule ting om Javascript som er veldig ulikt C er at funksjoner kan bli behandlet som verdier. Så vi kan gjøre noe sånt her der jeg antar at jeg dekke dette opp-- Jeg dekket opp Var sum part-- og vi sa funksjon xy er lik avkastning x pluss y. Det er det som vil bli kalt en anonym funksjon. Det er en funksjon uten navn. Mens dette sier funksjon sum, blah, blah, blah, dette ville bare si funksjon. Men nå selv om jeg har dette anonym funksjon, at funksjonen er egentlig bare en verdi. Vi kan behandle det som en verdi. Så vi kan lagre det i en variabel samme måten vi kunne lagre 50 i en variabel. Så vi kan si, OK, jeg vil ha en variabel, det heter sum, og det er denne funksjonen. Så disse to tingene er faktisk kommer til å gjøre akkurat det samme, men syntaksen er litt annerledes og slag av en morsom kommentar. Yeah. PUBLIKUM: Så du kan kalle en funksjon som var anonym ved å si: sum brak 2, 5? HANNAH Blumberg: Yeah. Du kan kalle denne anonyme funksjon på samme måte. Du ville gjøre sum (2, 5) ;. Det ville være helt fint. Hvis jeg ikke gjorde Var sum lik funksjonen, hvis jeg bare slettet dette-- Jeg vet det er på min side, men late som jeg slettet dette-- deretter at funksjonen er slags bare borte. Du kan aldri bruke det igjen fordi du har ikke et navn for det. Det er vanskelig å referere til noe du vet ikke hva jeg skal kalle. Godt spørsmål. Yeah. PUBLIKUM: Kan du referere sum i andre steder med verdien av x pluss y? HANNAH Blumberg: Kan du referanse sum i andre steder med verdien x pluss y? Jeg er ikke helt sikker på hva du mener. PUBLIKUM: Så din fortid semi-anonym Funksjonen er sum er lik denne anonym funksjon, så summen er nå en variabel som du can-- HANNAH Blumberg: Høyre. Så sum er den variable, men det er actually-- slik sum er en variabel med verdien er funksjonen. Så det er en funksjon, som er slags en merkelig ting å vikle hodet rundt siden vi har spilt med C, og du kan ikke gjøre det i C. Men nå kan vi kalle oppsummere samme måte som vi kan kalle summen her. PUBLIKUM: OK. HANNAH Blumberg: Yeah. Godt spørsmål. Yeah. PUBLIKUM: Så vi ikke bruker prototyper i PHP eller Javascript? HANNAH Blumberg: Nei, vi trenger ikke å bruke prototyper, spesielt i Javascript. Så en dårlig praksis ting som jeg er kommer til å si at du ikke bør gjøre er at du ikke trenger å skrive var i = 50. Du kan bare begynne å gjøre i = 50. Og ville bare gjøre jeg en global variabel. Det er veldig dårlig praksis å aldri si explicity Var jeg, men det er noe du kan gjøre. Tolken er ikke kommer til å kjefte på deg. Javascript er ganske like, du kan gjøre hva du vil. Åh unnskyld. Det er to. I de oransje bukser. Gå videre. PUBLIKUM: Nei, du går først. PUBLIKUM: Nei, jeg sier bare Jeg har ikke min hånd opp. OK. Så hvis du skulle ringe den første gang, nå oppsummere, vi kaller det på samme måte, x, y, som hver eneste gang? HANNAH Blumberg: Yeah. Så disse to vesentlige gjøre det samme. PUBLIKUM: Og hva er fordelen ved hjelp av den ene eller den andre? HANNAH Blumberg: Ingen fordel ved hjelp av den ene eller den andre. Jeg ville bare vise dere to ulike deler av syntaks. Mange ganger hvor anonym funksjoner har en hensikt er hvis argumentet til en annen funksjonen skal være en funksjon. Og vi vil se at i bare et sekund med Ajax. Så hvis det ikke gjør noe fornuftig, lagre den på baksiden av hodet. Det er der en anonym Funksjonen kan være nyttig fordi det er egentlig ikke verdt gi den et navn siden vi er bare kommer til å bruke det en gang. Yeah. PUBLIKUM: Hvis x og y endring senere på, vil oppsummere endre så vel? HANNAH Blumberg: Hvis x og y endring senere, vil oppsummere endre så vel? Så dette er faktisk jeg tror noe som er, igjen, det bare føles veldig annerledes fra C. Dette er ikke en verdi. Det er ikke fem. Det er bare selve funksjonen. Slik at så snart du gir den parametere, Da vil du faktisk beregne en verdi. MARIA ZLATKOVA: Og så du kan kalle funksjonen og bruke den til å få noen verdi. HANNAH Blumberg: Høyre. Nettopp. Yeah. PUBLIKUM: Så hvis du bare lagre den i variabelen, som var x er lik summen av to values-- HANNAH Blumberg: Yeah. Så du kan bare gjøre Var sum er lik summen av to verdier. Yeah. Eventuelle andre spørsmål? Yeah. PUBLIKUM: Men ville det forvirre sum og sum? Som hvis du ringer variabel sum, ville du kaller funksjonen sum? HANNAH Blumberg: Mm. Mm. Hvis du gjorde noe som, er lik summen sum 2, 5? PUBLIKUM: Yeah. HANNAH Blumberg: Jeg tror at vil overskrive verdien av summen. Så en annen interessant ting om Javascript er at en enkelt variabel kan ta på en haug av forskjellige typer. Dårlig praksis. Du bør ikke gjøre noe som det du nettopp sa. Men i C, hvis jeg er satt lik et helt tall, vi vet at det er aldri kommer til å bli en streng. Dette er ikke tilfelle i Javascript. Ja, godt spørsmål. Alt annet? Greit. Gjør alt rett tid. Holde går. Greit. Hvis vi ser på en rekke i Javascript, her en rask eksempel på en rekke strenger. Og arrays kan vokse dynamisk. De har ikke en med fast størrelse på samme måte som de gjør i C. Vi kan få tilgang til elementer med bare hakeparenteser. Det ser mye som PHP og mye som C, der kan vi si, i dette tilfellet hvis jeg ønsket ordet Javascript, ville jeg har arr hakeparenteser med en 0, 1, 2. Og så hvis du husker i C når vi ønsket å få lengden av en matrise, det var veldig irriterende. Men i Javascript, super lett. Alt vi gjør, .length. Gir det lengdene. Det er alt. PUBLIKUM: Det er enkelt. HANNAH Blumberg: Ja, gjør livet mye enklere. OK, object-- ikke der. Objekter i Javascript følelse mye som structs i C og assosiative arrays i PHP. Så det vi har sett en Mange er JSON, som står for Javascript Object Notation. Og det er i utgangspunktet en måte strukturere våre data. Så la oss se et eksempel, trolig den enkleste. Så her er et eksempel på et objekt som lagrer klassen, CS50. Og når jeg sier klasse, mener jeg selvfølgelig, ikke like-- yeah, selvfølgelig, CS50. Og du vil se at alt i objektet kommer til å ligge i klammeparentes. Og vi begynner å assosiere feltnavn eller nøkler med forskjellige verdier. Så kan du begynne å se hvordan denne typen føles som en assosiativ array i PHP. Så vi kommer til å knytte feltet eller nøkkelen navn, selvfølgelig, med strengen, CS50. Vi kommer til å ha en instruktør. Vi kommer til å ha TFS. Vi kommer til å ha flere psets og vi kommer til å ha spilt inn. Og en kul ting å merke seg er alle disse tingene har forskjellige typer, og det er helt greit. Det er greit for et objekt, faktisk, det sannsynligvis forventet for et objekt å ha en kombinasjon av strenger og tall og Booleans og arrays og alt annet du kanskje ønsker å ha inni objektet. Og merk at disse kommer til å være navnene eller tastene, og da er vi bare sette den lik med litt kolon. PUBLIKUM: Hva gjør JSON mener? HANNAH Blumberg: Hva nøyaktig gjør JSON mener? JSON bare står for Javascript Object Notation. Det er bare en måte å formatering. Yeah. Det er en måte å formatere våre data. I C, er det structs. I PHP, er det assosiative arrays. I Javascript, har vi stedene. PUBLIKUM: Så CS50 er et objekt? HANNAH Blumberg: CS50 er gjenstanden i dette tilfellet. Nå, hvordan gjør vi faktisk tilgang disse feltene eller endre disse feltene. For eksempel at vi bestemte oss for at du ønsket en færre PSet dette semesteret. I stedet for ni, er vi bare nødt til åtte. Hvordan ville vi endre på det? Oh, feil vei. Det er to måter som vi kan gjøre det. Nummer én er med prikken notasjon og nummer to er med hakeparentes notasjon. Så, for eksempel hvis jeg ønsket å endre eller tilgang den psets feltet i vår CS50 objekt, hva jeg ville gjøre er CS50.psets, så navnet på objektet dot navnet på feltet eller nøkkelen. Svært likt, det er akkurat tilsvar å gjøre CS50, og deretter i hakeparentes, psets. Kjølig? Yeah. PUBLIKUM: Så er JSON teknisk Javascript fortsatt, selv om det i de psets vi skille det ut [uhørbart]? HANNAH Blumberg: Sure. Så spørsmålet er, er Javascript og JSON tilsvarende? Så JSON er notasjon, i utgangspunktet den måten at vi skriver ut et objekt fra Javascript. Så de er ikke akkurat det samme. Jeg vil si Javascript, der er objekter i Javascript. JSON tar disse objektene og skriver dem og viser dem eller lagrer dem på en fin måte. Så JSON er ikke et programmerings språket slik at Javascript er. Det er bare notasjon for våre objekter i Javascript. Yeah. PUBLIKUM: Så hva [Uhørbart] fullføre? HANNAH Blumberg: Sure. Så dette faktisk gjør ingenting. Dette er bare en måte å få tilgang. Så la oss si at vi ønsket å endre antall oppgavesett 9-8. Det vi gjør er å gjøre noe som CS50.psets = 8 ;. Ja, stort spørsmål. Dette er bare for å vise deg syntaks. Faktisk ikke gjøre noe nyttig. Noen spørsmål? Flytte rett sammen. Så la oss se på en rask eksempel på hvordan Javascript fungerer fordi jeg fortalte deg det gjør alle disse kule ting og tillater oss å endre nettsider. La oss faktisk se den i aksjon. Så ta, for eksempel denne HTML-fil. Og ting jeg vil du skal fokusere på er denne koden, som er en knapp, med id Search_Button. Det er bare på den siden. Så nå la oss se hva vi kan faktisk gjør. Vel, antar at når du klikker denne knappen, vi ønsker å gjøre en alert-- du klikket på knappen. La oss se hvordan vi kan gjøre det. Så window.onload-- dette er ikke noe som du har sett i klassen, derfor trenger ikke å vite det for quiz. Men dette utgangspunktet sier, OK, samtale denne funksjonen når vinduet belastninger. Så det er bare slags oppsett kode. Ikke bekymre deg så mye om det. Det jeg vil at du skal fokusere på er her. Vi sier Var searchButton lik document.getElementById Search_Button. Så som du kanskje skjønner, Hva dette er den sier, OK, gå finne elementet med ID Search_Button. Og nå har vi at faktiske element og jeg er skal lagre den i en variabel searchButton. Og nå kan vi faktisk bruke det elementet og endre den, eller få tilgang til sine verdier, ting som det. Vi kan faktisk begynne å engasjere seg med nettsiden. Så her jeg si, OK, nå som jeg har den knappen, når den blir klikket, kalle denne anonym funksjon. Så dette er hvor anonym funksjoner bli nyttig. Og hva funksjonen gjør? Vel, det bare kaller denne varsling og den sier, du klikket på Søk-knappen. Så hva vil skje hvis jeg går dit denne HTML bor og jeg klikker på knappen, Jeg får en fancy liten varsling som sier at du har klikket på knappen. Så ting å fokusere på her-- document.getElementById får en bestemt HTML element med den gitte ID. Og nå kan vi sette hva som skal skje når det bestemt element klikkes. PUBLIKUM: Vi må sette alt dette i? HANNAH Blumberg: Sorry? PUBLIKUM: Må vi fysisk kode alt dette? HANNAH Blumberg: Må vi fysisk kode alt dette? Ja. Er ikke dette litt irriterende? Dette er en mye kode. PUBLIKUM: Du kan importere noe. HANNAH Blumberg: Høyre. Vi kunne bruke noe. Og i particular-- oh, er det forteller meg at jeg må lære delen. Spesielt, la oss bruke biblioteket jQuery, fordi det var virkelig lang og veldig irriterende og jeg ønsker å være i stand til å forenkle det og gjøre det kortere og enklere å skrive. Så jQuery er et Javascript-bibliotek. Så Javascript er programmering språk; jQuery er et bibliotek. Og det gjør en haug med ting enklere. Det gjør endring og går på tvers et HTML-dokument mye enklere. Det gjør håndtering hendelser enklere. Det gjør animasjon enklere og det gjør Ajax enklere. Så la oss hoppe inn to av disse tingene akkurat nå. Unnskyld meg. Før vi gjør det, noen grunnleggende syntaks. Dette er hva de fleste samtaler til jQuery biblioteket se ut. Vi bruker dette dollar sign-- ingen forbindelse tegn til PHP, bare inconvenient-- navnet på en velger, prikk, og deretter en handling. Så la oss se litt konkrete eksempler på det. Så dette faktisk er den samme kode fra arrangementet lysbildet. Så dette lenge, stygge ting blir dette mye hyggeligere, mindre ting. Så la oss prøve å bryte dette ned. Dette sier, OK, jQuery-- dette dollar sign-- jQuery, finne meg i vinduet. Så det er velgeren. Når det lastes, kaller denne funksjonen. Så det er alt inni. OK. Så langt så bra? Greit. Nå, jQuery, finne meg Saken med ID Search_Button. Og hva det klikkes, kalle denne funksjonen. Og så denne funksjonen er akkurat det samme. Bare gjøre en liten bit av varsling, du klikket på Søk-knappen. Så det er veldig fint. Det virkelig kondenserer og forenkler vår kode. Hvordan visste jeg at det er ID Search_Button og ikke liker klassen Search_Button? PUBLIKUM: Hashtag? HANNAH Blumberg: Yeah. Denne hash symbol, er det akkurat som CSS. Så husk, med CSS, når vi ønsket å velge noe av ID, vi brukte firkanttegn. Og når vi ønsket å velge noe av klasse, vi bruker punktum. Flott. Gir mening? Så jQuery er ment å bare gjøre livet vårt enklere. Yeah. PUBLIKUM: Så jeg er litt forvirret til hvordan den anonyme funksjonen fungerer. Vet du navnet på denne anonymouse funksjon, fungere? Hvordan er det heter? HANNAH Blumberg: Sure. Så funksjonen er bare et søkeord som sier, jeg er i ferd med å definere en funksjon. PUBLIKUM: Oh, OK. HANNAH Blumberg: OK? Og så passerer vi det som en argument to-- la oss ta denne indre one-- til klikk-funksjonen. Så ja, slik at funksjon, dette anonym funksjon, blir en faktisk argument. Så husk i Javascript, vi kan behandle funksjoner som verdier. PUBLIKUM: Oh, OK. HANNAH Blumberg: Yeah. Jeg liker at "oh." Fin. Andre spørsmål? Tid? MARIA ZLATKOVA: Good. God. HANNAH Blumberg: Awesome. Noen kjappe nyttig jQuery. Jeg kommer ikke til å gå gjennom alle disse. Disse slides vil være opp online litt senere, slik at du kan sjekke det ut litt senere. Men i utgangspunktet, den generelle Mønsteret holder der vi sier, OK, hei, jQuery, her er min velgeren og så her er en handling. Og du kan gjøre ting som tilgang til Verdien av et skjema, få tilgang til noen HTML, kontroll på hva som skjer når brukeren sender inn et skjema, sånne ting. Ja. PUBLIKUM: Så i eksamen, vi kommer til å trenge å vite ganske mye fra dokumentasjonen jQuery. Så gitt at vi kopiere / lim inn jQuery dokumentasjon til vår jukselapp, hvor er linjen trukket? Som hvor mange trenger vi å vite? HANNAH Blumberg: Great spørsmålet. Spørsmålet er hovedsak gitt at du får ikke tilgang til dokumentasjon jQuery i løpet av testen, hvor mye skal du kjenne til? Vi ville ikke forvente deg å komme opp med noen tilfeldig funksjon at vi forventer du til Google. Ting som er fritt vilt er jeg ville sier bare slags generell syntaks, å være i stand til å velge ved ID og av class-- så akkurat som CSS. Og deretter selve funksjonene seg selv, vil vi trolig fortelle deg. Yeah. PUBLIKUM: Så når du velger av klassen ville bety dot. HANNAH Blumberg: Ja, akkurat. God. Når du velger av klassen, kommer det til å bli prikk i stedet for firkanttegn. Ja. PUBLIKUM: Ville du gå over forskjellen mellom valg av ID og av klasse? HANNAH Blumberg: Sure. Forskjellen mellom å velge ID og velge av klasse. Så som Maria sa en litt tidligere, er det kan bare være en HTML-elementet med en gitt id, mens klasse det gir oss mulighet til å gruppere en haug av forskjellige elementer sammen, så ting som er relatert, men ikke akkurat det samme. Betyr det spørsmålet? Awesome. Ja. PUBLIKUM: Hva om du har flere ting som er i samme klasse? HANNAH Blumberg: Hva skjer hvis du har flere ting som er i samme klasse? Så, for eksempel hvis vi er bare ved hjelp av ren Javascript, vi ville gjøre noe sånt document.getElementsByClass. Og så hva som faktisk gjør er avkastningen en rekke elementer. Og du må enten iterere over dem eller finne hvilken du ønsker. Det kommer ikke til å gi man et enkelt element. Det kommer til å gi deg en rekke elementer. Stort spørsmål. Alt annet? Awesome. Så jeg tror at hvis du er kjent med noen jQuery du så i PSet, du bør være godt å gå. Spørsmål? Å nei. Jeg må virkelig lære. Slappe av. Det blir fin. Jeg skal komme dit. La oss snakke om Ajax. Så Ajax kommer til å være a-- godt, la oss starte med hva det står for. Det er et akronym. Det står for Asynchronous Javascript og XML. Og XML er i utgangspunktet kommer til å være [Uhørbart] med en type våre data. Men vi har faktisk ikke brukt XML. I stedet, vi bare bruke JSON. Så i utgangspunktet, er det noen data-- asynkron, Javascript og data, i dette tilfellet, JSON. Og målet vårt, som vi har nevnt litt tidligere, er å være i stand til å foreta en forespørsel, har denne forespørselen gjøre sin ting i bakgrunn, men fortsetter gjøre hva vi var tenkt å gjøre. Og så når denne informasjonen er klar, så får vi innlemme det. Så la oss se hva denne faktisk ser ut. Og dette, bør du være litt kjent fra pset8, den du bare slått på. Så her er en gyldig jQuery funksjon som vi kan ønsker å vite om-- dette dollartegn. Så det sier jQuery funksjon, .getJson. Og hva denne funksjonen gjør er det tar en URL og noen parameters-- så jeg tror i tilfelle av pset8, var det som, URL var articles.php og parametere var go = noen postnummer. Og den sier, OK, gjør en forespørsel til denne nettadressen med de gitte parametre. Og som bare skjer. Når den er ferdig, er det enten kommer til å fullføre eller det kommer til å mislykkes. Så dette er tilsvarende samtale Rob og be ham om å gjøre noe. Og så når han ringer tilbake, er han enten kommer til å si jeg er ferdig eller jeg mislyktes. Så i tilfelle hvor du er gjort, sier du, OK, jeg er ferdig. Og så kaller denne funksjonen. I dette tilfellet kommer det til å være en funksjon som tar litt informasjon. Den vi vanligvis bryr seg om er data, dataene som vi faktisk tilbake som et resultat av å kalle .getJSON. Og du kan gjøre noe med det. Så i tilfelle av pset8, vi vises det som en liste. Fail kommer til å være en funksjon som kalles dersom kravet ikke uansett grunn. Og i tilfelle av pset8, vi bare console.log det. Eventuelle spørsmål om det? Yeah. PUBLIKUM: Kan vi bare bruke funksjonen theta istedenfor funksjon, textStatus, jqHXR. HANNAH Blumberg: Sure. Så ja, jeg tror i PSet, vi nettopp så funksjonen data. Så det er bare the-- ja, OK. Det er hva vi så i PSet. Det er helt greit. Dette er bare hvis du ønsket å trekke ut mer informasjon, dette er ting som du kan få fra .getJSON. Godt spørsmål. Alt annet? Yeah. PUBLIKUM: Så .getJSON er Ajax? HANNAH Blumberg: OK. Så dette er den type vanskelige delen. Det er en jQuery funksjon som tillater du skal gjøre asynkrone samtaler. Og disse asynkrone samtaler, det er hva vi har vært å henvise til som Ajax. Yeah. Det tok meg veldig lang tid å trekk fra hverandre da jeg var student. PUBLIKUM: Kan du si det igjen? HANNAH Blumberg: Yeah. Kan jeg si det igjen? Dette .getJSON funksjon, Det er et jQuery funksjon. Og det kommer til å gjøre en asynkron samtale. Og disse asynkrone samtaler, vi har vært å henvise til dem som Ajax. Eventuelle andre spørsmål? Vi har bare et par minutter igjen. Og Maria kommer til å brytes opp med sikkerhet og så skal vi å være omtrent ferdig. MARIA ZLATKOVA: Awesome, OK. Så dette er-- bare ta et par sekunder for å se over dette. Og dette er ikke noe virkelig flott. Og kan noen fortelle meg hvorfor? Hva som skjer i foo og kan kunne potensielt føre til noe dårlig, og hva det heter? Yeah. PUBLIKUM: Hvis argumentet som er vedtatt i mer enn 12 tegn, det kan renne over. MARIA ZLATKOVA: Høyre. Perfekt. Hva heter det? Du bare nevnte det. PUBLIKUM: Buffer overflow. MARIA ZLATKOVA: Yup, buffer overflow. Så dette er noe vi refererer til som buffer overflow. Og vi ser at innsiden av foo, Vi har definert vår buffer, c, med en størrelse på 12. Men i hovedsak gjør vi ikke sjekk på noen måte i det hele tatt vidt argv1-- slik at var det andre argumentet. Vi sjekker ikke om størrelsen av det er hensiktsmessig. Så hvis vi hadde en spesielt ondsinnet bruker som satt i noen argument som var lenger enn 12, og deretter eventuelt utover grensene for det argument, hadde noen kjørbar kode at han prøvde å gjøre noe dårlig med det; så dette, hva som ville skje, ville overstyre retur Adressen til foo funksjon, slik at funksjonen til når tilbake til å kjøre denne koden. Og så dårlige ting kan skje. Betyr dette fornuftig for alle? Og hvordan kan vi beskytte mot dette? Noen forslag? I utgangspunktet, innsiden av potensielt foo, hvordan kan vi sjekke for å være sikker at det ikke kan skje? PUBLIKUM: Hvis størrelsen 12 er overskredet, du ville bevilge ekstra minne? MARIA ZLATKOVA: Forslag er, fordele ekstra minne av størrelsen skredet. Egentlig kan vi gjøre noe mye enklere enn det også. Vi kan bare få strengen lengde av argumentet som er lagt inn, sjekk om det er mindre enn eller lik 12-- som er det vi vil ha det å være fordi vi ikke ønsker det å overskride grensene for vår buffer. Og hvis den ikke gjør det, vi kan arbeide med argumentet. Og hvis den gjør det, vi faktisk ønsker til Yello potensielt på brukeren. Men dette er hvordan vi ville gjøre det. Ja. PUBLIKUM: Kunne du forklare memcpy virkelig rask? MARIA ZLATKOVA: Oh, sorry. Ja. Memcpy tar uansett er-- beklager, OK. Memcpy tar alt som er i baren, er det vedtatt på foo som kommandolinjen argument. Så det kommer til å ta argv1. Argv1 kalles bar her. Så det kommer til å ta bar og det kommer til å kopiere den inn c. PUBLIKUM: OK. MARIA ZLATKOVA: Og det kommer til å copy-- tredje argumentet bare refererer til hvor mye det kommer til å kopiere inn i c. PUBLIKUM: Ah. Så dette ens kopiering alt sammen da. MARIA ZLATKOVA: Ja, det er å kopiere alt sammen. Jepp. Først sørger vi for at baren er ikke lik null, fordi det er en peker. Så vi får strengen lengden på bar. Vi sørger for at det er mindre enn eller lik 12. Og da fordi vi har sørget for, kan vi faktisk memcpy og være sikker på at det er OK. Noen spørsmål? Flott. Jeg har to sanne eller falske spørsmål. Kan noen fortelle meg med en gang om disse er sant eller usant? Ja, det er falsk. Nettopp. Begge er falsk. Så bruker et enkelt passord er aldri veldig god idé fordi hvis noen vet passordet ditt, kan de bare få tilgang til alle dine andre kontoer. Og så ikoner gjør ingenting å sikre sikkerheten. Vi bør vanligvis ser for HTTPS i stedet for HTTP og URL. Og noen andre typer angrep som vi har nevnt, at David har nevnt i forelese, SQL-injeksjon angrep. Vi har allerede sett at hvis vi don't-- den CS50 spørring funksjon sørger for at SQL injeksjon angrep kan ikke forekomme. Men hvis vi ikke bruker CS50, sitat, unquote "i søket," vi må sørge for at brukerundersøkelser er faktisk ikke noen SQL spørring som vil føre til at all våre bord for å bli droppet eller noe dårlig å skje med vår database. Session kapring er en annen type angrep som skjer når noen dårlige person bruker noen offerets sesjon ID for å få tilgang til påloggingsinformasjon. Så en veldig trivielt eksempel på det er som om vi har en offentlig datamaskin, så dårlig person logger inn og deretter de har informasjonskapsler som er lagret. Og informasjonskapsler ikke endrer for økten. Så vi har offeret gå i og deretter logge inn på nettstedet. Cookies endrer ikke for en bestemt sesjon. Og da offeret logger inn nettsiden og deretter forlater. Og da den personen som går tilbake Deretter kan du fortsatt bruke sin session ID å få tilgang til informasjon. Så det er ett eksempel på hvordan det kunne skje. Og så ville jeg ikke bekymre deg for mye om spesifikk kode eller noe sånn som kan forårsake dette, men å ha en slags anelse om hva variabler som er involvert i dette er. Og deretter manipulere header data er en annen type angrep som har David har snakket om. Og det bare refererer til hva som kan skje når responsen, HTTP respons innsiden av vår header er ikke sterilisert skikkelig. Og en hvilken som helst av de fields-- f.eks hvis noen overskriver en av overskriften verdier for å inneholde noe mer enn hva de bør contain-- og faktisk inneholde, for eksempel, en 200 OK statuskode, så de kan potensielt gjøre skadelig ting når de ikke skal. Men jeg ville ikke bekymre deg for mye om spesifikk kode som kan forårsake dette, bare en slags forståelse høyt nivå sånt. Jeg tror dette er alt at vi må dekke. Utrolig. Alle som har noen spørsmål om noen av de tingene som vi dekket? Ja. PUBLIKUM: Så en slags mer logistisk spørsmål. Er innholdet i hovedsak fokusert på ting etter quiz 1? MARIA ZLATKOVA: So Spørsmålet er, er innholdet fokusert hovedsakelig på ting etter quiz 1? Slik at fokus er på etter quiz 1, med unntak at vi trenger å fokusere på ting i pset5 og mange av de datastrukturer at vi dekket. Og vi kan ikke si at vi kan ignorere noe før at fordi det bygger på det også. Så fokus på det, pluss pset5 materiale som blant annet knyttet lister, stabler, køer og alt at Hannah gikk over. HANNAH Blumberg: Høyre. Ja, vi gikk over all C stuff helt i begynnelsen veldig raskt. Men sørg for å gjennomgå det. Gå tilbake og se quizen 0 anmeldelse. Et par mer logistiske notater, bare mens vi har din oppmerksomhet. Vi kommer til å ha kontortid både på mandag og tirsdag kveld. De kommer til å være i MD 119. Dette er alt på nettsiden, så Hvis du ikke hører det, ingen bekymringer. MARIA ZLATKOVA: 08:30-11:00. HANNAH Blumberg: Yeah, 08:30 til 11:00. Vi vil være der. Vi vil være der for å svare på spørsmål. Det er ganske chill og morsom. Dere kan stille spørsmål som du har på quiz en. Og quiz 1 er på Onsdag, så lykke til. Hvis du har noen spørsmål, kanskje komme å snakke med oss ​​her oppe one-on-one. Kjølig. Takk så mye. MARIA ZLATKOVA: Takk så mye, folkens. PUBLIKUM: Yay. [BIFALL]