HANNAH BLUMBERG: Hej alle. Vi kommer til at komme i gang blot et par minutter tidligt da vi har en hel masse materiale at komme igennem. Jeg er Hannah. Jeg er en TF. Maria vil være sammenføjning os i blot et par minutter. Hun underviser afsnittet lige før. Jeg underviser sektion højre efter, så vi vil at holde den til halvanden time. Så som du kan se heroppe, har vi helt et par emner, vi har brug for at komme igennem, så vi vil gå lidt hurtigt. Men hvis på noget tidspunkt vi sige noget for hurtigt, eller du ikke forstår, velkommen til at afbryde med spørgsmål. Vi ønsker at være i stand til at gøre dette til en gennemgå session som nyttig for alle jer som muligt. Awesome. Så lad os hoppe ret i med nogle emner, som vi faktisk meget, meget kort dækket til quiz 0 i quizzen 0 anmeldelse session. Så starter med hægtede lister. Så bare sørg for at have nogle grundlæggende viden om hægtede lister og er tryg ved at gøre nogle af de grundlæggende funktioner. Så bare til anmeldelse, der er knyttet lister er bedre end arrays fordi de kan vokse dynamisk. Så vi har at kæmpe fordel. Vi har set dem brugt i hash tabeller, når vi ved ikke præcis, hvor mange ting, vi kommer til at have at indsætte ind i vores datastruktur. Vi har desværre stykker den linkede liste over hukommelsen, så vi vil ikke nødvendigvis være stand til at gøre konstant tid adgang til ethvert element i den linkede liste. For at finde en særlige element, vi nødt til at gentage alle de måde fra begyndelsen. Så husk på, at de fleste af de grundlæggende operationer er omega på 1. Så indsatsen er bare at tage 1. Slet kommer til at tage n da vi nødt til at gå finde det på listen. Og søgning kan tage, i værste fald, n. Vi kan ikke gøre noget som binær søgning på en sammenkædet liste da vi kan ikke bare tilfældigt springe til midten. Afkøle. Awesome. En lille smule af stakke. Dette, igen, kom op på quiz 0, så du skal være super komfortable med det. Men for stakke, beder vi dig at huske en stabel af bakker. Og det kommer til at være først i, sidst ud. Så vi stak tingene op i stakken, og derefter Hvis vi prøver at tage noget off-- som vi kalder popping off den stack-- vi kommer fra toppen. Og hvis vi ønsker at sætte noget i stakken, vi kalder det skubber. Så det er altid vil være voksende op fra bunden som en stak af bakker. Awesome. Vi har set stakke implementeret med både hægtede lister og arrays. Hvis du gennemføre med arrays, du ønsker at sørge for at holde styr på både størrelsen og kapaciteten. Så størrelse kommer til at være den aktuelle Antallet af ting i din stak, mens kapaciteten er det samlede antal af ting, du kan gemme i din stack. Afkøle. Meget på samme måde, har vi køer. I dette tilfælde, i stedet for at tænke på en stak af bakker, så tænk på en linje. Dette vil være først ind, først ud. Så hvis du foring op til noget i butikken, Vi håber, at den person, først i linje vil blive hjulpet først. I stedet for at sige skubbe og pop som vi gør for stakken, vi bare sige enqueue og dequeue. Og igen, hvis du er gennemføre dette med et array, vi nødt til at holde styr af ikke kun størrelsen og kapacitet, men også hovedet, som kommer til at være på forsiden af ​​vores kø. Afkøle. Eventuelle spørgsmål om noget af det? Awesome. Flytning til højre ad. OK, hash tabeller. Her er hvor det begynder at får virkelig interessant. Så en hash tabel er en implementering af et associativt array. Så dybest set, hvad der skete er har vi alle denne indgang, og vi giver det til en hash funktion, som siger, OK, det er her i hash tabellen det tilhører. Så den enkleste hash-funktionen at vi har set er bare at sige, OK, formoder, at vi ønsker at sætte strenge i vores hash tabel. Og en meget simpel idé kunne være at sige, OK, lad os bare sortere efter første bogstav i ordet. Så du kan se her, tager vi banan, vi sætter det gennem en hash-funktion, og det siger, hey, det skal gå på indeks 1. Så kan vi hovedsagelig tænke på en hash tabel som en masse forskellige spande. Og hver af disse skovle kommer at holde lederen af ​​en linket liste. Og i den linkede liste er, hvor vi kan faktisk sat forskellige stykker data. Så dykker lidt mere i en hash-funktion, her er det eksempel jeg lige beskrevet, hvor vi bare sige, OK, tage det første bogstav af ordet, og vi er kommer til at sortere det i spande. Så formentlig vil der være 26 spande, en for hvert bogstav i alfabetet. Hvorfor er det ikke en stor hash-funktion? Hvad gør denne ikke-ideal? Ja. PUBLIKUM: Du kommer at have kollisioner. HANNAH BLUMBERG: Ja, præcis. Du kommer til at have kollisioner. Så det er én ting. Og vi vil tale om, hvordan vi kan fix kollisioner i bare et sekund. Et andet problem med dette især hash-funktionen er, at vores forskellige spande vil være af temmelig drastisk forskellige størrelser. Vi ved, at der er en hel masse flere ord, der starter med A end X, så vi kommer til at have meget ubalancerede spande i vores hash tabel. Afkøle. Så ja, lad os komme tilbage til punktet af kollisioner. Hvad gør vi, hvis der er en kollision? Vi har et par forskellige muligheder. Så en, så formoder vi prøver at sætte bær ind i vores hash tabellen. Og vi ser, Åh, vi ønsker at sætte det i indeks 1, men banan allerede bor der. Hvad skal vi gøre? Vi har to hovedmuligheder. Nummer et er, at vi kan sige, OK, der er ikke plads i indeks 1, men lad os bare holde kigge gennem indtil vi kan finde en anden åben stedet. Så vi vil sige, OK, Lad os sætte det i stedet 3. Det er en mulighed. Det kaldes lineær sondering. Og en anden mulighed er at sige, OK, godt, lad os bare gøre hver af disse spande være lederne af hægtede lister. Og det er OK, hvis der er mere end én ting i en spand. Vi er lige at gå til append det på forsiden. Så her kan du se, OK, når vi indsat berry, vi tog bare banan, slags skubbet det over en lille smule og kastede en bær derinde. Og det er også helt fint. Dette kaldes separat kæde. Du kan tænke på dette som lidt ligesom en vifte af hoveder til hægtede lister. Eventuelle spørgsmål om hash tabeller, hash funktioner? Awesome. Træer og forsøger. Så et træ er enhver slags af datastrukturen hvor der er en slags hierarki eller en slags af ranking til dine forskellige objekter. Og det vil blive super klart, når vi ser et eksempel. Og vi så forsøger sammen med hash tabeller, i pset5-- som, igen, helt fair spil for dette quiz-- som en anden data strukturer, som vi kan opbevare forskellige ting. I tilfælde af ordbogen, vi gemt en masse ord. Så lad os tage et kig på nogle træer. Så dette er et eksempel på et træ. Det har en form for struktur, at hierarkisk struktur, hvor man kan se, at denne 1 node øverst har en slags rang over 2 og 3, der er over 4, 5 og 6 og 7, der er over 8 og 9. Så det er alt mener vi med en træ, så du kan bare lidt af billede dette i dit hoved. Nu har vi et par mere specialiserede træer. Så et eksempel er en binært træ. Og et binært træ er, igen, bare kommer til at være en datastruktur med en slags hierarki, men hver af knudepunkterne kan have højst to børn. Det er, hvor ordet binære kommer fra. Så det er et eksempel på et binært træ. Så det er en mindre kategori af træer. Lad os tage endnu mere specifik og taler om binær trees-- binær søgning træer, snarere. Så her ideen er ikke alene hver node har højst to børn, men alle de børn til venstre vil være mindre og alle børnene til ret vil være større. Så meddelelse i netop vores binært træ, der er ingen sammenhæng mellem tallene. Men i vores binær søgning træet, vi ser, OK, her er 44. Og hvert nummer til venstre for 44 mindre og alt til højre er større. Og der holder ved hvert niveau af træet. Så her, er mindre end 22, og det er større end 22. Og det er binær søgning træ. Hvorfor tror vi det hedder en binær søgning træ? Hvad algoritme betyder det minde dig om? PUBLIKUM: Binær søgning. HANNAH BLUMBERG: Binær søgning. For hvis du leder efter en bestemt antal i dette træ, på hvert punkt, kan du bare banke off halvdel af træet, som er stor. Og så kommer til at give os noget der ser meget gerne binær søgning. Nogen spørgsmål? Okay, cool. Okay, prøver. Alles favorit. Så dette er det eksempel, vi har set en masse i klassen. Og igen, det er bare en anden måde, at vi kan lagre data. I tilfælde af ordbogen, igen, Dette er blot kommer til at være strenge. Så lad os se, hvad det egentlig ligner på et lidt lavere niveau. Så lad os tage et kig ved en knude i en trie. Og vi ser, OK, har der går at være en boolesk og en node, en pointer til et knudepunkt. Og vi ser, at Boolean kaldes is_word. Så det væsentlige, det er kommer til at svare at disse små trekanter, som siger, hvis du har fået her, du har fundet en komplet ord. Vi ved, at "Turing" over her er et helt ord, mens blot T-U-R er ikke et ord fordi vi ikke se, at lille delta. Og den lille delta, igen, svarer til denne is_word, denne Boolesk is_word. Og så har vi en vifte af børn. Så på hvert niveau, du har et særligt knudepunkt, og at node peger på en array af hele alfabetet. Så du kan se, igen, i denne picture-- jeg kommer til at holde hoppe tilbage og forth-- at denne matrix øverst har en masse forskellige noder, der kommer ud af det. Det har 26 eller 27, hvis du vil at indsætte en ekstra karakter. Og det giver os en måde at gemme vores data på en måde, der kan blive kigget på at du kan se op super hurtigt. Hvad er opslag tid til en trie? PUBLIKUM: [uhørligt]. HANNAH BLUMBERG: Ja. I teorien er det konstant tid. Det er kun kommer til at være på størrelse med det ord, du vil slå op. Selv hvis vi tilføjer en zillion flere ord til vores trie, det kommer ikke til at tage os længere at bestemme om det givne ord er i den trie. Så det er virkelig rart. PUBLIKUM: Har du lige initialisere den opstilling? Du gik glip af et punkt eller to. Kan du bare tale om at for en anden? HANNAH BLUMBERG: Sure, absolut. Godt spørgsmål. Spørgsmålet var, vi har et array, der er vil have knude stjerne som modsætning til blot node, ikke? Afkøle. Så her hvad vi siger er vores array er lige vil være henvisninger til andre arrays. Så det er essentially-- den slags føles som en sammenkædet liste på denne måde hvor hver af disse børn bare pege på den næste node. Og den måde, at vi faktisk bestemme, hey, OK, vi har gentaget gennem en hel ord, er dette ord i ordbogen, vi lige tjekke denne is_word. Store spørgsmål. Ja. PUBLIKUM: OK. Så hvad var runtime for trie? HANNAH BLUMBERG: Selvfølgelig. Så runtime til trie for lookup vil være konstant tid. Så det er bare at være den Antallet af bogstaver i ordet. Det er ikke afhængig af størrelsen af ​​ordbogen eller størrelsen af ​​datastrukturen. Så her er en lidt enklere eksempel. I dette tilfælde kan du se, at Ordet bat er i ordbogen og du har zoom, men du ikke har noget som zoo. Hvordan ville vi gøre zoo? Hvordan tilføjer vi zoo til vores ordbog, til vores trie? Ja. PUBLIKUM: Make is_word sandt for [uhørligt]. HANNAH BLUMBERG: God. Så vi vil sige Z-O-O, og så ville vi ønsker at tjekke det kassen så godt. Alle tiders. Lad os sammenligne ganske kort forsøger versus hash tabeller. Forsøger er virkelig stor fordi, som vi sagde, de giver konstant tid opslag. Men den store ulempe er de er humongous. Du kan få den forstand, selv ved at kigge på den, at det kommer til at tage en enorm mængde hukommelse. Så de kommer til at være meget større end hash tabeller, men de kommer til at give os meget hurtigere lookup gange. Så det er lidt din tradeoff, hvad du interesserer dig for, uanset om det er hastighed eller hukommelse. Eventuelle spørgsmål om noget af det, alle de C-datastrukturer. Smuk. OKAY. Vi kommer til at gå videre til en lille bit af web-udvikling med Maria. MARIA ZLATKOVA: Dejligt. OKAY. HANNAH BLUMBERG: Du kan bruge min bærbare computer. MARIA ZLATKOVA: Nice. OK, cool. Som vi bevæger os nu til web udvikling, vi snakkede lidt om skiftende tilladelser af filer og mapper således at de kan være tilgængelige til andre brugere, til verden, og således at vi kan se, hvordan dybest set kan vi formidle dem når vi udvikler ting som websites at vi for det meste har gjort. Så vi så chmod-kommandoen, der er forandring tilstand, dybest set. Det er en Linux kommando og det ændrer adgangsrettigheder af filsystemet objekter. Og et filsystem formål er bare en mappe, en fil, noget, som du kan ændre tilladelserne til. Så at se filens tilladelser, vi skrive kommandoen ls, liste, -l. Og når vi skriver, at vi normalt se nogle tilladelser der ser lidt ligesom denne foran et mappenavn. Så d refererer til mappe. Og så har vi tre treklange der dybest set henvises til tilladelser enten en bruger, en gruppe, eller verden. De typer af tilladelser, vi kan have for disse tre grupper af mennesker er enten R for læsning, w for skrive, og x for at udføre. Og vi kan have dem, for gruppen og verden. Det tricky ting er, at nogle gange når vi skriver kommandoen chmod, vi ville skrive nogle tal som bestod af tre bit. Så vi kunne gøre som 777, og at grundlæggende henvist til den merværdi hver af disse triader fordi r henviser til 4, w ville henviser til 2, og x henviser til 1, så når adderes hvert nummer ville komme ned til en kumulativ nummer til en kumulativ værdi mellem 0 og 7. Så kunne vi også have 0 for ingen tilladelser overhovedet. Og det ville dybest set give os tilladelserne til enten brugeren, gruppen, eller verden. Eventuelle spørgsmål vedrørende denne indtil videre? PUBLIKUM: Du sagde læst var 4? MARIA ZLATKOVA: Ja. PUBLIKUM: [uhørligt]. HANNAH BLUMBERG: Yup. PUBLIKUM: Og så ved at tilføje alle dem andre ville angive dit nummer. MARIA ZLATKOVA: Ja. Ja. Disse er store spørgsmål. Dejlig. Næste vi sprang i HTML og en lidt mere om webudvikling. Så HTML betyder blot, HyperText Markup Language. Og det er markup sprog, der er en standard at det bruges til at oprette websider. Det kaldes et kodesprog fordi det er faktisk ikke kompileret. Det behøver ikke sige, hvordan noget kode skal blive henrettet eller sådan noget. Det bare skildrer og beskriver, hvordan en web side bør oprettes med hver af dens elementer og hvordan de skal se ud til brugeren. Nogle af de HTML-tags, som vi gik over er følgende. Alle vores HTML-dokumenter begyndte med DOCTYPE html. Så vi altid har html-tag. Vi har et hoved og en krop. Og det er vigtigt, at HTML har denne form for indlejrede struktur fordi det er meget klart. Og så bliver det meget klart, når vi brug for at åbne og faktisk lukke tags. Og vi altid nødt til at lukke tags, som vi har åbnet. Og her har vi nogle af de typer af ting forude, som vi ønsker at have. Så vi har for eksempel titlen på CS50. Og så har vi faktisk kan linke et typografiark der definerer, hvordan vi stil vores hjemmeside. Det er CSS. Vi kommer til at gå over det i næste par slides så godt. I kroppen, satte vi nogle klasser og id'er. Og som en påmindelse, igen, ID'er er unikke og klasser kan henføres til flere elementer. Og det betyder bare, at vi kan bruge klasser og id'er inden anden structures-- så for eksempel inden for CSS-filer eller stil sheets-- at henvise til specifikke elementer og dybest set siger, at vi ønsker at style eller designe et element på en eller anden særlig måde. Og vi refererer til dem ved deres id'er og klasser. Og vi kan også henvise til forskellige ting ved tags så godt, men id'er og klasser bare give os nogle alsidighed og hvad der specifikt vi ønsker at henvise til. Så bare et eksempel. Vi kan, igen, inden en CSS-fil, hvor vi vil definere nogle style-- så farver, skrifttyper, og kram at-- ligesom vi kan definere stil for et organ. Så ville definere det for hele kroppen tag. Men så kan vi også definere en stil for en #title. Og igen, hashtag refererer til vores ID og prikken henviser til vores klasse. Og så for .info, vi kan også indstille nogle attributter. Og igen, når vi går tilbage, havde vi vores klasse kaldet info og vores ID-titel. Og vi kan se, at vi henviser til dem af #title og .info. PUBLIKUM: Ville du sige hashtag [? vedtage mig? ?] MARIA ZLATKOVA: Beklager? PUBLIKUM: Ville du sige hashtag [? vedtage mig? ?] MARIA ZLATKOVA: Hashtag betyder id, så #title refererer til uanset elementer har denne ID kaldes titel. Og derefter dot henviser til en klasse. Så .info refererer til dette element fordi det har klassen info. Jep. PUBLIKUM: Hvorfor har du adskille dem i HTML? Hvorfor siger du visse ting er Id'er og visse ting er klasse? MARIA ZLATKOVA: Det er bare op til du-- HANNAH BLUMBERG: Gentag spørgsmålet. MARIA ZLATKOVA: Åh, undskyld. Hvorfor har vi skelner visse elementer som id'er og andre elementer som klasser? Det er bare fordi det er virkelig ofte designvalg. Det giver dig en masse alsidighed i at være i stand til at sige, at jeg ønsker, at dette specifikke emne at få denne ID, fordi de ønsker til at gøre en masse ting med det, og jeg kun ønsker at definere en stil, bestemt stil eller farve hvad for denne post. Og den måde at gøre det er bare at give det et id. Og så hvis jeg vil have et par forskellige elementer der, at i stedet for går og indstilling their-- stedet for at gøre det ved tag da tag ville indstille cellen for hele tag for hver gang anvendes som tag, du kan indstille en klasse til flere elementer. Og så bare få adgang til denne klasse og sige Jeg ønsker at style denne klasse på den måde. Og igen, kan klassen være flere forskellige elementer og ID skal være unikt. Store spørgsmål. Andre spørgsmål? OK, awesome. Igen, dette er, hvordan disse selektorer der henvises til i CSS, med hashtag, med prik, eller uden noget for tildele den stil af nogle tag, legeme. Og her har vi den generelle syntaks, hvordan dette gøres. For at gentage nogle bedste praksis for HTML og CSS, er vi nødt til, igen, lukke alle HTML-tags, som vi kan åbnes. Og hvad vi anbefalede dig gøre for din endelige projekter, samt for CS50 Finance, er at gøre sikker på, at alle dine HTML validerer. Og det er gjort med W3 Validator. Og så, hvad vi gjorde, og hvad vi anbefale at gøre er adskillelse stil, så CSS fra markup HTML. Så alt, hvad der vedrører, hvordan din side kommer til at visuelt se og hvordan det kommer til at blive ændret bør gå ind i en CSS dokument. Og så din markup at sige, hvordan tingene er i forhold til hinanden, er HTML, og at skulle gå inde af dine HTML-dokumenter. Nogen spørgsmål? MHM. PUBLIKUM: Hvad foregår på med siden validering når vi validering af HTML at [uhørligt] skabt? MARIA ZLATKOVA: Så hvad-- tror dig. Så hvad der foregår på med side validering og hvorfor har vi brug for at gøre det? Dybest set, er vi nødt til at gøre det fordi en masse gange, din browser, hvis du ikke lukker et tag eller sådan noget, din browser er stadig vil gengive en side og kan stadig arbejde, men det er den bedste praksis for at sikre, at du har, igen, lukket alle dine tags, at alle dine elementer er den måde, at de burde være, og dybest set, at det er ved konventioner, der er forudindstillet. Det er, igen, bare en ting, du bør lære at gøre, i modsætning til at sloppier kode og den slags. Ja. Åh undskyld. Jeg troede, du var at hæve din hånd. PUBLIKUM: Nej, jeg var bare [uhørligt]. MARIA ZLATKOVA: OK. PUBLIKUM: Tak. MARIA ZLATKOVA: Selvfølgelig, tak. Så igen, foregår i, hvordan oplysninger overføres og kommunikationsmodeller til at overføre information. TCP / IP. TCP betyder blot, Transmission Control Protocol og IP refererer til Internet Protocol. Og der bare refererer til den måde data bliver leveret. Hvis vi har nogle data, skal leveres til du-- så du laver en anmodning om en bestemt server. For eksempel når vi forsøger at få adgang cs50.net, Vi gør en anmodning til Den CS50 server og vi se, at vi ønsker at få denne form for oplysninger. Og så er baseret på denne protokol for, hvordan disse oplysninger er leveret, serveren giver oplysninger tilbage til os, kunden. Og så er vi i stand til at se oplysningerne for siden og derefter bruge det. Så Hypertext Transfer Protocol er blot en anden protokol eller sæt af konventioner, der definerer, hvordan webbrowseren og webserveren skal kommunikere. Og lægge det alt sammen, HTTP, igen, bare definerer, hvordan denne hypertekst defineret af HTML, som vi har arbejdet det, hvordan det skal leveres til dig og hvordan at data, der er leveret til dig kommer til dig. Og det er derfor, hvis du fyre huske fra en klasse, vi havde en masse af anmodninger og vi havde en masse syntaks for disse anmodninger, vi er kommer til at gå over lige nu. Så igen, når vi sender en anmodning til en server, vi nødt til at definere et par ting. Så vi er nødt til at finde den type af anmodning om, at vi er indstillingen. Og igen, vi har, for eksempel, GET er en type af metode som vi har i vores anmodning. Og derefter HTTP / 1.1 er blot den protokol, som vi bruger i øjeblikket. Det meste af tiden, der kommer til den protokol, som vi bruger. Så hvis du har et spørgsmål gerne, at på din quiz. Det er konventionerne at vi har indtil videre. Backslash refererer til hvad slags af ting, vi anmoder om. Derefter vores vært er for eksempel i denne tilfælde, vi forsøger at gå til google.com. Så dette er værdien for en vært. Dette er en type anmodning der kunne sendes. Og derefter en type respons, der kunne sendes, igen baseret på denne protokol, igen, HTTP / 1.1. Så det er HTTP-version igen. 200 OK er bare status kode. Og det OK er bare en sætning baseret på denne status kode. Og så Content-Type refererer til typen der er returneret til dig, der er til denne webside, som du modtager og at din browser kan gøre bagefter. Og det er text / html. PUBLIKUM: Hvad betyder 1.1 betyde? MARIA ZLATKOVA: Det er bare den udgave of-- Åh, hvad betyder 1.1 betyde? Det er bare den version, HTTP version af en protokol, som vi bruger. Store spørgsmål. Andre spørgsmål? PUBLIKUM: Kan du opsummere Content-Type virkelig hurtig? MARIA ZLATKOVA: Så det er det serveren. typen af ​​information-- hvad der er indholdstype var spørgsmålene. Så det var den type oplysninger, som du får tilbage fra serveren, typen af data, som browseren kan derefter gengive, at du bruger. PUBLIKUM: Er det, hvad dette protokol er at fortælle dig at gøre? MARIA ZLATKOVA: Beklager? PUBLIKUM: Er det, hvad protokollen sige? MARIA ZLATKOVA: Den protocol-- PUBLIKUM: --what den Content-Type er, eller hvad-- MARIA ZLATKOVA: Protokollen er baseret on-- hvad er den protokol fortæller dig? Det er bare den måde, at disse oplysninger blev leveret til dig baseret om, hvad slags protokol blev disse oplysninger fik leveret tilbage til dig. Giver det mening slags? HANNAH BLUMBERG: Du kan tænke på protokol som en-- Jeg tror professor Malan beskrev det i klasse som lidt ligesom en-- det er ligesom svarende til human handshaking. Sige, ligesom, hey, jeg er en anmodning og jeg vide, hvordan man håndterer HTTP version 1.1. Og så serveren siger, Åh, OK, jeg-- og begge eksisterer. Jeg ved også, hvordan man skal håndtere HTTP / 1.1. Og jeg har tænkt mig at give du sikkerhedskopiere noget indhold. I dette tilfælde går det at være af typen text / html. Så det er lidt bare en måde af dem for communicating-- MARIA ZLATKOVA: Det er bare bekræfter, at du er både efter samme protokollen, og at både klienten og server-- så din browser og server-- slags ved, hvad du er taler om og har konventionen for at videregive i data. PUBLIKUM: Så Content-Type part-- Content-Type tekst / html-- der er en særskilt del af den samme meddelelse? Eller er det en del af lad os sige, 200? Er 200 fortælle dem, at eller is-- MARIA ZLATKOVA: 200 siger det hele gik OK. Og så indholdstype er en slags separat del af det samme budskab, og siger de ting, jeg Returneret har denne type af tekst / html. Det er bare at give flere oplysninger. Har noget at tilføje? OKAY. Andre spørgsmål om dette? Awesome. Så nogle andre HTTP-statusser, vi kunne få udover 200 OK, dem, vi har set måske eventuelt en masse er 403 og 404. Så 404, hvis du prøvede at adgang til noget, der ikke eksisterer. Så for eksempel i din CS50 Finance psets, hvis du havde været rendering quote.html og du ikke har denne fil, men i stedet du havde quote.php, at vil resultere i en 404 ikke fundet fordi filen måske ikke eksisterer. For en 403 forbudt, at henviser til tilladelser. Så hvis nogle fil kan ikke læses af verden, du kan få en 403 returneres. Nogle andre, som du måske get-- 301 Flyttet permanent; 302, Fundet; 304, modificeret; 400, Bad Request; og derefter Internal Server Error for 500 og 503, service ikke tilgængelig. Ja. PUBLIKUM: Vil vi forventes at huske alle de statusser? MARIA ZLATKOVA: Jeg ville have dem på din snyde ark. [LATTER] PUBLIKUM: Er vi forventes at vide, hvad der udløser hver enkelt? MARIA ZLATKOVA: Er de? HANNAH BLUMBERG: For dem, vi har køre into-- så spørgsmålet was-- MARIA ZLATKOVA: Er de forventes at ved, hvad hver enkelt af disse status koder kan udløses ved? Så for dem, vi har brugt og løb ind, vil jeg sige, ja. Så vi har absolut set 200 OK, og underviste det i psets. Vi har set 403, 404. For andre dem? HANNAH BLUMBERG: Jeg ville sige 500 synes fair spil. MARIA ZLATKOVA: 500, ja. HANNAH BLUMBERG: Ja. Bare have en generel følelse af hvad der forårsager dem. Og også lige som disse navne, kan du slags gerne gøre et kvalificeret gæt som til hvad der rent faktisk fik dem. For eksempel, flytte permanent, sandsynligvis filen blev flyttet permanent. PUBLIKUM: Men på en tidligere prøve, der var en så hvordan kan du forvente, at vi besvare dette? HANNAH BLUMBERG: At var værd nul point. Spørgsmålet om 418 på tepotten er teknisk en HTTP-status, men det var værd nul point. Selvfølgelig, du er ikke forventes at kende dem. PUBLIKUM: Er det en rigtig en? HANNAH BLUMBERG: Det er en reel en, men det betyder ikke noget. Det er bare en joke. Internet mennesker er sjove. MARIA ZLATKOVA: Great spørgsmål, gutter. Andre spørgsmål? PUBLIKUM: Hvad er intern serverfejl? MARIA ZLATKOVA: Intern serverfejl bare betyder, at du har været stand til at kommunikere med serveren eller anden grund. Så det er ikke nødvendigvis noget, der har at gøre med kunden eller noget lignende. Jeg kender ikke nogen specifik eksempel at vi har gået over til at forklare, men ja. HANNAH BLUMBERG: Selvfølgelig. Så for eksempel, som lad os sige, at du arbejdede på mashup og en Google-server gik ned for nogle grund, en strømafbrydelse, lad os sige. Det ville være en intern server fejl eller en slags of-- lide dig ville ikke få et svar tilbage. MARIA ZLATKOVA: Ja. Det er bare, når du er stand til at kommunikere med serveren eller anden grund, fordi af det går ned eller anden grund. Så hoppe ind PHP. PHP modsætning HTML, er en programmeringssprog. Og vi begyndte at bruge det, fordi det er meget nyttigt for webudvikling. Vi først brugt det i CS50 Finance. Og det dybest set hjælper os bringe sammen denne markup, design, og hvordan vi rent faktisk bruge oplysninger for at vise ting på en webside. Så PHP selv betyder PHP Hypertext Preprocessor, så det er en rekursiv backnorym af sig selv. Og åbne tags til PHP vi venstre og højre pile med spørgsmålstegn og php. Så vi har allerede set en masse af det. Nu er vi bare kommer til at gå over nogle af de grundlæggende ting om det. Så med PHP, variablen navne starter med dollartegn. Vi har ikke specificere, igen, en variabel skrive længere. Ligesom vi gjorde med C, vi behøver ikke at gøre det. Vi kan gøre en masse forskellige ting med variabler. Vi kan sætte dem sammen ved at sammenkæde dem med dot notation, som vi ikke kunne gøre i C igen. Igen har vi en smule mere alsidighed med PHP i form af variable. Igen, har vi ikke en hovedfunktion. Og PHP fortolkes i modsætning til kompileret, Så bare hvordan vi gør for C-filer, vi behøver ikke at gøre det for PHP. Men snarere den måde, at sproget drives af sig selv, det er fortolket. Og så løst maskinskrevet betyder blot, at vi behøver ikke at angive en variabel type og de variable typer forstås ved runtime. PUBLIKUM: Men hvad gjorde du mener med dot sammenkædning? MARIA ZLATKOVA: Selvfølgelig. Når vi ønsker at sætte tingene together-- så hvis vi havde nogle variabel, havde værdi på 3, og vi havde en anden variabel, havde værdien af ​​strengen, vi kunne sætte de variabler sammen ved at sætte en prik i mellem dem og sammenkæde dem. Eller vi kunne skabe en variabel kaldet navn og sætte det sammen af sammenkæde to strenge. Så hvis vi havde en snor i dobbelt citater og vi sætter en prik efter det, og derefter havde vi en anden streng, at ville skabe en streng helt. PUBLIKUM: OK. MARIA Letland: Var det klart? Publikum: Ja. MARIA ZLATKOVA: OK. Ja. PUBLIKUM: Når du siger fortolket i stedet for kompileret, taler du om du ikke skal være så specifik, når det kommer til PHP versus C? MARIA ZLATKOVA: Når vi siger fortolkes i modsætning til kompileret, hvad mener vi? Så det betyder, at vi ikke har brug for eksekverbare filer til at køre PHP. Det betyder, at det kører som det går. Giver det mening? Lidt mere. HANNAH BLUMBERG: Så du kan tænke på en tolk som et andet program, der er ansvarlig for at gå linje for linje gennem PHP og faktisk udfører den, i modsætning til at kompilere det hele ned til binær. Det er faktisk ikke noget om, hvordan specifikke vi skal være. Vi har stadig brug for at være præcis, og ikke glemmer din semikolon, og sørg for du har din dollartegn, og sådan noget. Godt spørgsmål. MARIA ZLATKOVA: Ja. Så linje for linje, som modsætning til med C filer, vi er nødt til at gøre hele endelige før vi rent faktisk kan køre den. Det er den vigtigste forskel. Men igen, kan vi ikke virkelig være mindre specifik. Så arrays i PHP repræsenterer faktisk en ordnet kort. Så arrays associerede værdier til nøgler. De to måder at erklære en array, baseret på denne syntaks, vi kan være mere eksplicit i at sige vi har en matrix og vi har denne nøgle1 der er knyttet til denne værdi1, TAST2 der kortlægger value2. Eller vi kan bare oprette et array der indeholder de selv værdier og derefter tasterne er forstås på en måde. Eventuelle spørgsmål om dette? Publikum: hvad ville tasterne være i det andet eksempel? 0, 1, 2, 3? MARIA ZLATKOVA: For eksempel, det er bare tasterne i dette ikke nødvendigvis gør en forskel. De definerer, hvor du kan bruge værdierne inde i den. Så hvis vi havde en foreach løkke i PHP, der ville tillade os at gå igennem alle de værdier, Vi kan gå igennem alle de værdier, selv hvis vi havde eller ikke havde defineret en bestemt nøgle inden webstedets forrige syntaks. Så selv med denne slags af array, kunne vi stadig har en foreach løkke der går gennem hver af værdierne i nøglen i array. Så syntaksen for en foreach loop, vi starter med et array. Denne $ arr variabel er vores faktiske vifte at vi definerede i forrige dias som værdi, der bogstaveligt talt går gennem hver af de værdier, uanset om Vi havde en nøgle eller ej. Og så kan vi gøre noget med værdien indersiden af ​​foreach loop. Så igen, hvis vi havde en matrix ligesom dette her created-- så vi har nøglen til foo og værdien af bar, nøglen til baz og værdien af ​​qux-- vi kan få en foreach løkke, der går gennem array som nøgleværdi og derefter gøre noget med nøglen og / eller værdi. Men vi gør ikke nødvendigvis altid have en foreach sløjfer, går gennem array som centrale kortet for at værdi. Vi kan gå igennem foreach loop array som værdi. HANNAH BLUMBERG: Og jeg tror at-- var dit spørgsmål, hvad er den implicitte indeks? PUBLIKUM: Kinda. MARIA ZLATKOVA: Oh. HANNAH BLUMBERG: Ja, ja. Så dybest set, hvis du ikke angiver en nøgle, går det at være 01. MARIA ZLATKOVA: Ja. Ligesom med C, det er nul indekseret hvis du ikke angiver en nøgle. PUBLIKUM: Beklager. Kunne du forsøger at tale en lille smule højere? Jeg har en lille smule problemer med at høre alt. MARIA ZLATKOVA: Jeg er så ked af det. Ja selvfølgelig. Så vil du mig at gå over det igen? Eller er denne-- PUBLIKUM: Så på den forrige slide-- hvis kunne du bare gå tilbage i et sekund. MARIA ZLATKOVA: Selvfølgelig, undskyld. PUBLIKUM: Så den anden matrix her ikke synes at have en værdi for at indtaste, slags [? årsagssammenhæng. ?] MARIA ZLATKOVA: Right, højre. PUBLIKUM: Så hvordan gør dette arbejde når du siger, det er alle eller ingen. For mig, der ligner en [? foo?] allerede. MARIA ZLATKOVA: Ja, ja. Så igen, det er en bestilte kort i denne forstand at der er forstået, for eksempel indekserne her kan forstås som 0, 1, 2, 3. Igen, det er at have dem indekser er vores tilsvarende for at have nøgler kortlagt på værdier. Så hvis vores nøgle var 0-- ked af det. HANNAH BLUMBERG: Nej, der har kridt op her. Det er faktisk rigtig rart. MARIA ZLATKOVA: Det er godt. OKAY. Så igen, ville $ arr 0 være nøglen for værdien 1. 0 ville være nøglen til værdien 1. PUBLIKUM: Jeg er ked af. Det er usynligt. HANNAH BLUMBERG: Okay, nevermind. Chalk var en dårlig idé. Jeg tager det tilbage. Du kan tænke på tasterne som 0 kort til værdien 1. MARIA ZLATKOVA: Ja. Så dette er 0, denne er 1, 2, 3. Disse kan være dine nøgler. Du kan tænke på dem as-- ja. Så i stedet for at have eksplicitte nøgler, de er slags forstås som værende indekserne starter ved 0. Kridt hjalp ikke. Ja. PUBLIKUM: For foreach loop, hvis vi ønskede at se den som værdi, det ville bare automatisk indeks til 0? MARIA ZLATKOVA: Ja. Det ville gå igennem hver af værdierne. PUBLIKUM: [uhørligt] som 0 eller ville det bare gøre 0? MARIA ZLATKOVA: Du ville have at sige som dollartegn og derefter nogle variabelnavn, værdi. PUBLIKUM: [uhørligt]. MARIA ZLATKOVA: Beklager? PUBLIKUM: Beklager, jeg er blot forsøger at huske. Hvordan ville du gøre det, hvis du kan gøre det automatisk indeksering er blot 0 af? MARIA ZLATKOVA: Så hvordan ville du gøre, at hvis du ikke har særlige vigtige navne? Publikum: Ja. MARIA ZLATKOVA: Du ville bare define-- bare sige dig selv som nogle navn. Så i dine psets, gutter måske Husk foreach $ række som $ rækker, vi skabt os selv denne $ rækken siger vi ønsker at gå gennem række som $ rækker. Selv om vi ikke har denne eksplicitte $ rækker defineret, vi kunne bare gå og sige dette kan være vores nøgle, og bare gå gennem hver af værdierne. PUBLIKUM: Så er værdi en ny variabel Vi er ved at oprette til at gemme [uhørligt]? MARIA ZLATKOVA: Så det er ikke sagens natur en ny variabel. Det er en variabel, der refererer til indersiden af ​​array til hver af dem. HANNAH BLUMBERG: Det er et nyt variabelnavn. MARIA ZLATKOVA: Ja, det er en ny variabel navn, men det er ikke inherently-- ja. Det er bare en ny variabel at du kan gøre det. Så bare hvordan gør vi gjorde $ ro som $ rækker, rækker var en ny variabelnavn, at vi kunne skabe i vores foreach løkke. Det behøver ikke at preexist før. PUBLIKUM: Kunne du går gennem logik for hver, ved hjælp af eksemplet er? MARIA ZLATKOVA: Mhm. Åh undskyld. Her er eksemplet. Jo da. Så for hver array-- så det betyder at gå til dette array som nøglen value-- der kommer at gå gennem denne matrix og først gå og få foo, den nøglen foo og værdien bar. Og så på den anden iteration af for-løkken, det kommer til at gå igennem og tage nøglen baz og værdien QUX. Og så kan du gøre noget med en af ​​dem eller begge af dem. PUBLIKUM: Så ideen bag har et centralt punkt til værdien, hvad gør du ender adgang? MARIA ZLATKOVA: Hvad er ideen for at have en nøgle peger på værdi? Det er bare en anden konvention, en anden måde at gå gennem arrayet og at kunne få adgang enten nøgle eller værdi eller begge og bruge dem. PUBLIKUM: Hvad er den rolle for orden, at foreach kører i? Så hvis vi skulle tilføje elementer til arrayet senere, ville de være de første kaldes i foreach array, eller ville det være senere? MARIA ZLATKOVA: Så hvad er den rækkefølge, de foreach loop går gennem et array i? Det går gennem den første element til sidste element, til det sidste tilføjede element. Hvis du tilføjer elementer senere, de ville være accessed-- de første elementer ville tilgås som den første elementer i arrayet, og så ville du gå gennem hver af de elementer som en slags en ordered-- ikke en ordnet, men den måde, de er sat ind i array. PUBLIKUM: Så nye elementer tilføjes senere? Så de er added-- de vil være det sidste dem i [? iteration. ?] MARIA ZLATKOVA: Nye elementer can-- dybest set, når nye elementer tilføjes, føjes de til slutningen af ​​array? Publikum: Ja. MARIA ZLATKOVA: Jeg tror det. Ja. Og derefter med din foreach loop, efter at du har tilføjet nye elementer og du går igennem dem, de nye elementer ville være accessed-- det nye element, hvis det er tilsat sidst, ville det tilgås sidst. PUBLIKUM: Kan du bare give et eksempel af noget, der ville [uhørligt] med noget med værdi ligesom [uhørligt] eller værdi, ligesom hvordan du ville formaterer det? MARIA ZLATKOVA: Selvfølgelig. Kan jeg give et eksempel på, hvad vi ville gøre med værdien? Så hvad du fyre kunne være bekendt med er, at vi har været igennem et array og dybest set trykt hvert af elementerne, for eksempel som en del af en ordnet liste eller noget, der. Giver det mening eller ønsker vi at-- PUBLIKUM: Kan vi udskrive disse værdier ud? MARIA ZLATKOVA: Ja, vi kunne udskrive og derefter dybest set $ værdi, fordi ved den specifikke værdi, ville vi være trykning værdien inde i den. Så hvis vi var på vores første iteration af det, og vi trykt $ værdi, vi ville udskrive bar. PUBLIKUM: Er der også for sløjfer i PHP eller bare foreach sløjfer? MARIA ZLATKOVA: Der er også efter sløjfer i PHP. Og deres logik er for det meste den samme som det, du har været vant til. PUBLIKUM: Så dens værdi er nul. MARIA ZLATKOVA: Det er ligesom det samme. Ja. PUBLIKUM: jeg bare at spørge. Så når du erklærer en array, behøver du ikke at fortælle, hvad størrelse det vil være, hvilket betyder, at du kan bare tilføje og fjerne elementer [uhørligt]. MARIA ZLATKOVA: Yup. Jep. Nøjagtig. Når vi erklære et array, vi behøver ikke at sige, hvad størrelse er, så vi kan bare tilføje elementer på det senere så godt. Flere spørgsmål? Så at bringe PHP og HTML sammen, hvad vi har seen-- godt, for eksempel i dette eksempel har vi en HTML-formular, der har et input felt. Og indtastningsfeltet er bare navn og så har en knappen Send. Og når du trykker på Indsend knappen, i vores hello.php fil, fordi metoden til formularen er får, kan vi få adgang til, hvad der er på navn af dette får global variabel, is-- syntaksen for det er $ _GET. Og så kan vi få adgang uanset brugerinput inde i denne form for navn ved at angive navnet på dette område. Andre spørgsmål eller en hvilken som helst spørgsmål om dette specifikke eksempel? PUBLIKUM: Hvor er PHP? MARIA ZLATKOVA: Her. Så dette er vores åbning tag for PHP. PUBLIKUM: Åh, højre. MARIA ZLATKOVA: Ja. HANNAH BLUMBERG:? Den = er stenografi til dette er PHP og blot ekko. PUBLIKUM: Oh. MARIA ZLATKOVA: Ja, undskyld. Jeg skulle have gjort det klart. HANNAH BLUMBERG: Udskriv. MARIA ZLATKOVA: Det er bare den funktion der giver os mulighed for at udskrive noget. Store spørgsmål. Så going-- ja. PUBLIKUM: Er der kommer til at være helt lidt af hånden kodning af PHP og HTML på quiz 1? MARIA ZLATKOVA: Der kan være en rimelig mængde tolkning af PHP og HTML, ikke nødvendigvis ligesom en enorm mængde af kodning, selvom du måske nødt til at skrive en foreach loop, men en for-løkke. Enhver af de sløjfer, som vi dækker her er fair spil. Og det er for det meste det. HANNAH BLUMBERG: Jeg ville være forberedt. På samme måde, som spurgte vi dig til skrive en masse C-funktioner på quiz 0, Jeg ville være parat til at gøre det samme i PHP og JavaScript. MARIA ZLATKOVA: Ja. HANNAH BLUMBERG: Jeg vil sige en little-- ligesom vi ikke er vil gøre du skriver en enorm HTML side, bare fordi det er en lille smule kedelig, men du kan have dele. Det er helt fair spil. Ligesom lille HTML-side, helt fair. PUBLIKUM: OK. Hvad med i JavaScript så godt? HANNAH BLUMBERG: Ja. JavaScript er fair spil. MARIA ZLATKOVA: Ja. Det er helt fair spil. HANNAH BLUMBERG: Vi får som i ligesom 10 minutter. MARIA ZLATKOVA: SQL, igen, Struktureret forespørgselssprog. Det dybest set giver os mulighed for at styre data i en relationel database management system. Der bare dybest set betyder at vi har et sted at gemme nogle data, som vi måske ønsker at brug i en hjemmeside eller i en anden form. Og så har vi forespørgsler for at få oplysninger fra vores database, eller til at indsætte oplysningerne i dem. En masse af den fælles ones-- UPDATE, INSERT, SELECT, og SLET. Så for UPDATE, dette er syntaksen til opdatering af data i en database. Opdatering denne tabel kaldet bord ved at sige SET, vi kan sætte nogle værdier i alle rækker til lige noget andet. Så kan vi også angive nogle specifikke poster, som vi ønsker at ændre og det kan være at bruge hvor. Og vi kan angive, at vi kun ønsker at ændre nogle rækker, hvor huset for, hvis vi havde en tabel af studerende og alle de studerende havde hus, så vi ville kun ændre nogle værdier hvor et hus er lig Currier, for eksempel. For INSERT, kan vi indsætte visse værdier i en tabel. Så INSERT INTO tabel, og derefter værdierne, og derefter i parentes, vi angiver hvilke værdier du vil indsætte. Så INSERT INTO tabel, col1 og Col2 er værdien VAL1 og val2. Så dette indsætter dybest set en ny række i en tabel, der indeholder de værdier 1 og 2 I kolonnerne 1 og 2. Og så vil vi gå over et hurtigt eksempel på, hvordan det ser ud ligesom i vores database en lille smule. Men denne sidste forespørgsel, som jeg tror vi kommer til at gå over, SELECT, det bare giver os at vælge data fra et bord eventuelt at bruge det bagefter. Og den måde, vi gør det er vi bare gemme det i nogle variabel. Og så kan vi overhovedet bruge det igen. Så SELECT stjerne betyder vælge alle. Det er bare en forkortelse Til at vælge alle. FROM tabel WHERE, ser vi for nogle særlige betingelser, så hvor kolonne lig noget, f.eks. Hvis vi bare ønskede at Vælg alle fra bordet, dette blot vælger alle kolonner og alle rækker fra en tabel. Og så DELETE FROM tabel HVOR col lig noget, dette blot sletter nogle række fra vores bord hvor vi har nogle særlige betingelser. I dette tilfælde, betingelserne er lig med søjle noget. Så bare en hurtig eksempel på dette. Hvis vi har denne tabel højre her, og vi indsætte det i en tabel, disse værdier, der ville indsætte en ny række. Og hvis vi havde auto-tilvækst, ville dette bare tilvækst vores id fra 0 til 1 for at 2. Hvis vi valgt alle fra studerende, det bare returnerer alle felter og alle rækker. Når året er større end eller lig med 2016 det ville bare vende tilbage Hannah og mig selv. Og så hvis vi bare valgt år-id og år fra studerende hvor huset er Cabot House, at ville igen vende tilbage Hannah og mig selv. Så hvis vi slettet fra studerende hvor navn er lig med Rob, der ville slette hele rækken. Og derefter, hvis vi indstiller navn, UPDATE studerende SET navn lig med Daven HVOR hus er lig Cabot House, der kommer til at gå til disse rækker, og derefter opdatere navnet. Og derefter et par SQL datatyper er CHAR, VARCHAR, INT, og flyde. Disse er fair spil. Jeg vil gå igen og sørg for du kender og få dem på din bedrager ark, hvad hver af disse tegn er blevet anvendt til, hvad du brugte dem på dine psets, og sørg for du er fortrolig og komfortable med at skulle vælge fra forskellige datatyper i din pset. Ja. PUBLIKUM: Hvad var det bord opbevares? Ja, hvor er denne tabel opbevares? MARIA ZLATKOVA: Nå, lige nu, er det ikke gemt. Anyway, hvor denne tabel opbevares? Men den kan opbevares i en SQL-database. PUBLIKUM: Og hvor er SQL-database? I computeren, online et sted, serveren? MARIA ZLATKOVA: Det kan være en række forskellige ting. HANNAH BLUMBERG: Vi har interface med SQL-tabeller for det meste med phpMyAdmin. Så vi kunne bede en server at gemme dem for os. Vi kunne gemme dem på vores egen computer. MARIA ZLATKOVA: Det bare afhænger af hvordan du ønsker at gøre det for dig selv. Men vi har været opbevaring dem, som Hannah nævnt, på phpMyAdmin, som er online. Og så den måde, vi bruger PHP og SQL, gemmer vi det ind i nogle variabel hvad vi har forespurgt om. Så hvis vi vælger alle fra historien hvor user_id lig med SESSION id, der ville vælge alle rækker for den specifikke person, der er logget på fra historien bord og sortere dem i rækker. En cool ting at vide er at CS50 forespørgsel funktion beskytter mod SQL injektion tags. Det betyder blot, at det gør sikker input, der er indtastet er korrekt og at den person, der kommer ind i input forsøger ikke at indtaste nogle ondsindede kode til enten droppe vores borde eller slette alt inde i vores database. Et hurtigt overblik over den Model View Controller model det er bare en måde at organisere og tænker kode. Det er igen, et design paradigme. Det betyder, at vi can-- og det er god praksis at adskille forskellige dele af vores kode og hvad de kontrollere i disse tre paradigmer. Så vores opfattelse er oftest vores skabeloner, layoutet, den måde at vi indstille, hvordan vores kode ser. Det er for det meste vores CSS-filer og den måde at vi definerede udformningen af ​​vores kode, dybest set. Vores controller er for det meste, hvad vi har lavet med PHP-filer. Så igen, der arbejder med oplysninger, som vi har og definere, hvordan det oplysninger bruges, og derefter passerer disse oplysninger enten på visningen eller modellen. Og modellen, den måde, vi har brugt sige har været vores database, så hvor vores oplysninger er opbevares, så det har et sted at leve i og en eller flere af kode, der vedrører den måde at vi får disse oplysninger eller måde, at vi opdaterer disse oplysninger. Så i MVC model, HTTP anmodninger sendes til en webserver. Derefter controller fortolker anmodningen fra brugeren og derefter validerer brugerinput. Det er valgfrit, at vi har styreenheden kommunikerer med en model, så noget ligesom vores database eller en anden funktionalitet som sender oplysninger. Og så endelig styreenheden videresender information på visningen således at det kan være afsagt, og at det kan bliver synlige for enhver person adgang til websiden. Nogen spørgsmål? Awesome. Så igen, modellen, dens funktion igen, er vedvarende lagring af information, styring og organisering af data. Og det, vi har set så langt er MySQL-database og eventuelle datafiler, der kan bruge. Udsigt, præsentation af information til brugeren, UI, eller brugergrænsefladen. Og eksempel på dette er HTML. Og så måske vi har minimal PHP. Så en for-løkke, der gentager overskrive data, som udskrives er en del af den opfattelse, som modsætning til controlleren. Og så en masse af vores PHP-filer falde i controlleren kategori. Det bare håndterer brugerønsker og får oplysninger fra modellen. Hoppe ind i dokumentet Object Model, det bare refererer til den måde HTML dokumenter er organiseret. Og de er organiseret i et træ struktur, der har et hierarki. Så hvis vi har adgang til [uhørligt] repræsentation af dokumentet, vi kan arbejde med dokumentet, ligesom vi manipulere objekter dybest set. Og for at gøre dette til en lidt klarere, når Vi har en masse af vores forskellige mærker svare til forskellige ruter i vores træ. Og så for dette eksempel, vi har udgangsdokument node. Vi har, så vores HTML node der deler sig i hoved og krop. Hovedet har titel og derefter titel indeholder hej, verden. Og vores krop bare indeholder hej, verden. Så spørgsmål om nogen af ​​de ting, som vi er dækket indtil nu? Og hvis ikke, Hannah vil overtage med JavaScript. Awesome. HANNAH BLUMBERG: OK, cool. Hvis noget kommer op med PHP eller HTML, eller nogen af ​​de ting Maria dækket, Vi kan altid holde pause. Vi laver bedre på igen, så awesome. Og bare for at gå tilbage virkelig hurtigt til dette, hvis man ser på hver forløbne års eksamen, dette kommer op either-- her er nogle HTML, gør dette diagram. Eller her er dette diagram, gøre nogle HTML, så definitivt praktisere det. Og så er man garanteret spørgsmål, som du kan få ret. Afkøle. Så lad os tale om JavaScript og hvordan det er en lille smule forskellig fra sprog som PHP og C, de to sprog, vi oplevede på forhånd. Så nummer et, er det løst skrevet. Det er ligesom PHP, men i modsætning til C. Det er et fortolket sprog. Igen, det er ligesom PHP modsætning C. Og det kommer til at tillade os at use-- det fungerer rigtig fint med websider. Det kommer til at give os mulighed for at manipulere indholdet og hvordan det ser ud og hvad den gør. Vi kommer til at se en lille smule af Ajax. Det giver os mulighed for at kommunikere asynkront med forskellige servere og få oplysninger. Og det er det, der virkelig adskiller JavaScript fra PHP og C at det er på klientsiden. Både PHP og C er typisk server-side. For det meste og næsten helt, hvad vi har set, i hvert fald i denne klasse, JavaScript virker på klientsiden, hvilket betyder at browseren er faktisk ansvarlig for at kører det. Og det betyder, at vi ikke nødt til at interagere med serveren. Så det betyder, at det kan være meget hurtigere fordi det er faktisk blot det er Chrome, det er Safari, det er Firefox, uanset hvad du bruger faktisk kører din JavaScript. PUBLIKUM: Hvad betyder asynkron betyde? HANNAH BLUMBERG: Ah, hvad betyder asynkront betyde? Store spørgsmål. Asynkront means-- godt, hvis indhold, hvor vi bruger det, OK, vi opretter en webside og vi har brug for at få nogle oplysninger. Så med eksemplet med mashup, nogle oplysninger, som vi måske ønsker er artiklen titler. Nu could-- vi en mulighed er at gøre det synkront og det betyder lad os stop, gå få artiklen, får artiklen tilbage, og derefter gengive, men det ville være virkelig langsom. Det ville være en dårlig brugeroplevelse fordi du ville bare sidde der venter på noget at reagere. Asynkront betyder, at vi får fortsætte med at gå om vores forretning, rendering siden, og vi sender ud en anmodning der er slags kommer til at ske i baggrunden. Jeg tror, ​​vi bruger eksemplet i foredrag af at kalde Rob og sagde: hey, kan du se dette op for mig og komme tilbage til mig, i modsætning til bare mig venter på telefonen. Så betyder asynkront det sker i baggrunden væk fra os parallelt. Store spørgsmål. Ellers andet? Alle tiders. Vi vil springe meget mere ind asynkrone anmodninger med Ajax. PUBLIKUM: Er JavaScript-- hvor gør det falde med model-view-controller? HANNAH BLUMBERG: Great spørgsmål. Hvor kommer JavaScript falder med model-view-controller? Hm. Jeg tror det kan fall-- så vi ikke normalt gerne klemme det i at paradigme, men jeg tror jeg ville sige, OK, så JavaScript faktisk vil tillade os at indsamle data, fortolke data, rent faktisk gør meningsfulde ting med dataene. På den måde er det meget kontrol-lignende. Men det er også kommer til at tillade os at vise ting og udskrive ting. På den måde er det meget visning-lignende. Ja. Så det er lidt ligesom PHP i hvor det kan slags både være. Godt spørgsmål. Ellers andet? Okay, awesome. Flytning til højre ad. Så lad os se et eksempel af, hvordan vi kan bruge JavaScript i en af ​​vores web-programmer. Så jeg vil overveje dette index.html med en masse HTML. Og de ting jeg vil have dig fokusere på, er dette script-tag. Og det siger, OK, jeg vil køre nogle JavaScript og her er, hvor det bor. Den lever i hello.js. Og meget gerne CSS, vi kunne sætte JavaScript inden for HTML. Hvorfor kan vi ønsker at skille det ud? Ja. PUBLIKUM: Nemmere at omskrive? HANNAH BLUMBERG: Ja. Det er nemmere at bruge på tværs forskellige websider. Det holder tingene renere. Det er bare god praksis. Awesome. Godt svar. Så godt, så det vil at være vores index.html. Og derefter ned her er vores lillebitte JavaScript-fil. Og alt det siger er opmærksom Hej, verden. Så sker der det, når denne side renders-- så hvis du går til uanset hjemmeside dette is-- alt der kommer til at ske er det kommer til at sige, OK, jeg er kommer til at køre denne JavaScript-kode. Og denne JavaScript-kode bare siger alarm Hej, verden. Så jeg har tænkt mig at få denne venligt lille pop-up. Afkøle? Det er lidt ligesom vores allerførste JavaScript-program, vores Hej, verden. Lad os se lidt mere om, hvad syntaksen for JavaScript ser ud. Og specifikt, lad os sammenligne det med C og PHP, som vi har set før. I JavaScript, vi kommer til at have Var, navnet på variablen, og derefter dens faktiske værdi. Og vi har ikke angiver en type, bare ligesom i PHP, men meget i modsætning til C. Så for eksempel, hvis vi ønskede at lagre værdien 50, i C, ville vi nødt til at sige, hey, C, jeg vil have et heltal, Jeg har tænkt mig at kalde det i, og dens værdi er 50. I PHP, det er en lille smule lettere. Vi siger, hey, jeg vil have en variabel kaldes i og dens værdi er 50. Meget på samme måde, i JavaScript, vi sige hey, jeg vil have en variabel kaldet i, dens værdi er 50. Hver efterfølgende gang, at jeg bruger i, behøver jeg ikke at skrive var. Det er bare jeg fra dette punkt på. På samme måde, i C, hvor når vi siger int i, vi bare bruge jeg. Afkøle? Okay. Flytning til loops, heldigvis, disse næsten se exactly-- Jeg tror, ​​de er nøjagtigt det samme som det sløjfer kommer til at se ud i noget som C, hvor din for-løkke vil have tre parts-- en initialisering, en tilstand, og en opdatering. En while-løkke, det ser nøjagtig den samme. Vi har lige give det en betingelse. Og en gør while-løkke, igen, nøjagtig det samme. Vi giver det en betingelse. Lad os sige, jeg ønskede at gentage over-- Jeg ønskede at gøre noget fem gange. I C, kan vi skrive for init I lig 0. i er mindre end 5, i ++. Eneste forskel, i JavaScript, stedet for at sige int jeg er lig med 0, vi sige var i er lig med 0. Smuk. Det er den eneste forskel. Eventuelle spørgsmål om noget af det? Ja. PUBLIKUM: Så i PHP, det er det samme ting, undtagen men ligesom en variabel? Eller var, at en var eksempel? HANNAH BLUMBERG: Ja. Så i PHP, går det at være et dollartegn. Så det kommer til at $ i ligemænd 0, $ i er mindre end 5, $ i ++. Store spørgsmål. Lad os nu tale om funktion erklæringer. I C, når vi erklæret en funktion, vi gav det et navn og vi gav det nogle parametre. Og i begyndelsen skrev vi typen. I JavaScript, alt, hvad vi skal gøre er at skrive nøgleordet funktion, siger, hey, JavaScript, Jeg er ved at definere en funktion. I dette tilfælde har det navn sum. Og det tager to argumenter, x og y. Bemærk, at vi er ligeglade om de typer af x og y. Og ligesom C, har vi dette søgeord gengæld så vi kan gøre noget ligesom tilbagevenden x og y. Og nu når vi har skrevet denne første funktion, kan vi bruge summen overalt. Og det er helt fint. Én virkelig cool ting ved JavaScript, der er meget i modsætning til C er, at funktioner kan blive behandlet som værdier. Så vi kan gøre noget lignende her hvor jeg formoder, at jeg dække denne up-- Jeg dækket op Var sum part-- og vi bare sagt funktion xy lig tilbagevenden x plus y. Det er, hvad der ville blive kaldt en anonym funktion. Det er en funktion uden et navn. Dette siger funktion sum, bla, bla, bla, ville det bare sige funktion. Men nu selvom jeg har denne anonyme funktion, denne funktion er egentlig bare en værdi. Vi kan behandle det som en værdi. Så vi kan gemme det i en variabel på samme måde kunne vi gemme 50 i en variabel. Så vi kan sige, OK, jeg vil have en variabel, kaldes det beløb, og det er denne funktion. Så disse to ting er faktisk kommer til at gøre præcis de samme ting, men syntaksen er lidt anderledes og sådan en sjov bemærkning. Ja. PUBLIKUM: Så du kunne kalde en funktion, som var anonym ved at sige, sum beslag 2, 5? HANNAH BLUMBERG: Ja. Du kan kalde denne anonym fungerer på samme måde. Du ville gøre sum (2, 5) ;. Det ville være helt fint. Hvis jeg ikke gjorde var sum lig funktion, hvis jeg bare slettet her-- Jeg ved, det er på min side, men lader som jeg slettede denne-- derefter denne funktion er slags lige gået. Du kan aldrig bruge den igen, fordi du ikke har et navn for det. Det er svært at henvise til noget du ikke ved hvad de skal ringe til. Godt spørgsmål. Ja. PUBLIKUM: Kan du henvise sum i andre steder med værdien af ​​x plus y? HANNAH BLUMBERG: Kan du henvisning sum i andre steder med værdien x plus y? Jeg er ikke helt sikker på hvad du mener. PUBLIKUM: Så din fortid semi-anonym funktion er sum er lig med dette anonyme funktion, så summen er nu en variabel, som du can-- HANNAH BLUMBERG: Right. Så summen er variabel, men det er actually-- så summen er en variabel, hvis værdi funktionen. Så det er en funktion, som er form for en underlig ting at ombryde dit hoved omkring da vi har leget med C og du kan ikke gøre det i C. Men nu kan vi kalde opsummere samme måde, som vi kunne kalde summen her. PUBLIKUM: OK. HANNAH BLUMBERG: Ja. Godt spørgsmål. Ja. PUBLIKUM: Så vi ikke bruge prototyper i PHP eller JavaScript? HANNAH BLUMBERG: Nej, vi behøver ikke at bruge prototyper, især i JavaScript. Så en dårlig praksis ting, som jeg er vil sige, at du ikke skal gøre er du ikke behøver at skrive var i = 50. Du kunne bare begynde at gøre i = 50. Og ville bare gøre jeg en global variabel. Det er meget dårlig praksis at aldrig sige udtrykkeligt var i, men det er noget du kan gøre. Tolken er ikke kommer til at råbe på dig. JavaScript er temmelig lignende, du kan gøre hvad du vil. Åh undskyld. Der er to. I de orange bukser. Fortsæt. PUBLIKUM: Nej, du går først. PUBLIKUM: Nej, jeg var bare at sige Jeg havde ikke min hånd op. OKAY. Så hvis du skulle ringe at første gang, nu opsummere, vi kalder det på samme måde, x, y, ligesom hver eneste gang? HANNAH BLUMBERG: Ja. Så disse to væsentlige gøre det samme. PUBLIKUM: Og hvad er fordelen at anvende en eller anden? HANNAH BLUMBERG: Ingen fordel for at anvende den ene eller anden. Jeg ville bare vise dig to forskellige stykker syntaks. En masse gange, hvor anonym funktioner har et formål er, hvis det argument til en anden funktionen skal være en funktion. Og vi vil se, at i bare et sekund med Ajax. Så hvis der ikke giver nogen mening, gemme det på bagsiden af ​​dit hoved. Det er, hvor en anonym funktion kan være nyttig fordi det ikke er virkelig værd give det et navn, da vi er bare kommer til at bruge det en gang. Ja. PUBLIKUM: Hvis x og y forandring senere på, vil opsummere ændre så godt? HANNAH BLUMBERG: Hvis x og y forandring senere, vil opsummere ændre så godt? Så det er faktisk jeg tror noget, der er, igen, det bare føles meget anderledes fra C. Dette er ikke en værdi. Det er ikke 5. Det er bare selve funktionen. Så så snart du giver den parametre, så vil du faktisk beregne en værdi. MARIA ZLATKOVA: Og så du kan kalde den funktion og bruge det til at få en vis værdi. HANNAH BLUMBERG: Right. Nøjagtig. Ja. PUBLIKUM: Så hvis du bare gemme det i variablen, ligesom Var x er lig summen af ​​to values-- HANNAH BLUMBERG: Ja. Så du kunne bare gøre var sum lig summen af ​​to værdier. Ja. Andre spørgsmål? Ja. PUBLIKUM: Men ville det forvirre sum og sum? Ligesom hvis du ringer til din variabel sum, ville du kalder funktionen sum? HANNAH BLUMBERG: Mm. Mm. Hvis du gjorde noget lignende, sum er lig summen 2, 5? Publikum: Ja. HANNAH BLUMBERG: Jeg tror, ​​at vil overskrive værdien af ​​summen. Så en anden interessant ting om JavaScript er, at en enkelt variabel kan tage på en masse forskellige typer. Dårlig praksis. Du bør ikke gøre noget gerne, hvad du lige sagde. Men i C, hvis jeg er indstillet lig med et heltal, vi ved, at det aldrig kommer til at blive en streng. Dette er ikke tilfældet i JavaScript. Ja, godt spørgsmål. Ellers andet? Okay. Gør alle lige til tiden. Holde gang. Okay. Hvis vi ser på et array i JavaScript, her er en hurtig eksempel på et array af strenge. Og arrays kan vokse dynamisk. De har ikke en fast størrelse på samme måde at de gør i C. Vi kan få adgang til elementer med bare de firkantede parenteser. Det ser meget gerne PHP og en masse som C, hvor vi kan sige, i dette tilfælde, hvis jeg ønskede ordet JavaScript, ville jeg gør arr kantede parenteser med et 0, 1, 2. Og så hvis du kan huske i C, når vi ønskede at få længden af ​​et array, det var virkelig irriterende. Men i JavaScript, super nemt. Alt vi gør, .length. Giver det længderne. Det er det. PUBLIKUM: Det er simpelt. HANNAH BLUMBERG: Ja, gør dit liv meget lettere. OK, object-- der ikke. Objekter i JavaScript-føler meget gerne structs i C og associative arrays i PHP. Så det, vi har set en masse er JSON, som står for JavaScript Object Notation. Og det er dybest set en måde at strukturere vores data. Så lad os se et eksempel, formentlig den nemmeste. Så her er et eksempel på et objekt der gemmer klassen, CS50. Og når jeg siger klasse, mener jeg selvfølgelig, ikke like-- yeah, selvfølgelig CS50. Og du vil se, at alt i objektet vil være indeholdt i krøllede parenteser. Og vi begynder at associere feltnavne eller nøgler med de forskellige værdier. Så du kan begynde at se, hvordan denne form for føles som en associativ array i PHP. Så vi kommer til at associere feltet eller nøglenavnet, naturligvis med strengen, CS50. Vi kommer til at have en instruktør. Vi bliver nødt til TF'er. Vi bliver nødt til antal psets og vi kommer til at have registreret. Og en cool ting at bemærke er alle disse ting har forskellige typer, og det er helt fint. Det er fint for et objekt, i virkeligheden, Det er sandsynligvis forventes for et objekt at have en kombination af strenge og tal og Booleans og arrays og hvad du ellers måtte ønsker at have inde i dit objekt. Og bemærk, at disse vil være navne eller tasterne, og så må vi bare sætte den lig med lidt kolon. PUBLIKUM: Hvad betyder JSON betyde? HANNAH BLUMBERG: Hvad præcist gør JSON betyde? JSON blot står for JavaScript Object Notation. Det er bare en måde at formatering. Ja. Det er en måde at formatere vores data. I C, er det structs. I PHP er det associative arrays. I JavaScript, har vi objekter. PUBLIKUM: Så CS50 er et objekt? HANNAH BLUMBERG: CS50 er objektet i dette tilfælde. Nu, hvordan gør vi faktisk adgang disse områder eller ændre disse områder. For eksempel antage, vi besluttede, at du ønskede en mindre pset dette semester. I stedet for ni, vi er bare nødt til otte. Hvordan ville vi ændre det? Åh, forkerte vej. Der er to måder, som vi kan gøre det. Nummer et er med prik notation og nummer to er med den firkantede beslag notation. Så for eksempel, hvis jeg ønskede at ændre eller adgang feltet psets i vores CS50 objekt, hvad jeg ville gøre, er CS50.psets, så navnet på objektet dot navnet på marken eller tasten. Meget på samme måde, det er præcis svarende til gøre CS50, og derefter i firkantede parenteser, psets. Afkøle? Ja. PUBLIKUM: Så er JSON Teknisk JavaScript stadig, selv om der i de psets vi adskille det ud [uhørligt]? HANNAH BLUMBERG: Selvfølgelig. Så spørgsmålet er, er JavaScript og JSON tilsvarende? Så JSON er notation, dybest set den måde, at vi skriver ud et objekt fra JavaScript. Så de er ikke helt det samme. Jeg vil sige JavaScript, der er objekter i JavaScript. JSON tager disse objekter og udskriver dem og viser dem eller gemmer dem på en pæn måde. Så JSON er ikke et programmeringssprog sprog den måde, at JavaScript er. Det er bare den notation for vores objekter i JavaScript. Ja. PUBLIKUM: Så hvad der præcist [Uhørligt] fuldføre? HANNAH BLUMBERG: Selvfølgelig. Så dette faktisk gør ingenting. Dette er blot en måde at få adgang. Så lad os sige vi ønskede at ændre antallet af problematiske sæt 9-8. Det, vi gør, er at gøre noget ligesom CS50.psets = 8 ;. Ja, godt spørgsmål. Dette er blot for at vise dig syntaks. Ikke rent faktisk gør noget nyttigt. Nogen spørgsmål? Flytning til højre ad. Så lad os se på et hurtigt eksempel på, hvordan JavaScript virker, fordi jeg fortalte dig det gør alle disse seje ting og giver os mulighed for at ændre websider. Lad os faktisk se det i aktion. Så tag, for eksempel, HTML-fil. Og de ting jeg vil have dig til at fokusere på, er denne særlige mærke, som er en knap, med id search_button. Det er bare på siden. Så lad os nu se, hvad vi rent faktisk kan gøre. Nå, formoder når du klikker på denne knap, vi ønsker at gøre en alert-- du klikkede på knappen. Lad os se, hvordan vi kan gøre det. Så window.onload-- dette er ikke noget at du har set i klassen, derfor behøver ikke at vide det for quizzen. Men det dybest set siger, OK, opkald denne funktion, når vinduet belastninger. Så det er bare lidt opsætning kode. Må ikke bekymre dig så meget om det. Hvad jeg vil have dig til at fokusere på, er i her. Vi siger var searchButton lig document.getElementById search_button. Så som du kan gætte, hvad det gør, er det siger, OK, gå finde elementet med ID search_button. Og nu har vi, at faktiske element, og jeg er kommer til at gemme det i en variabel searchButton. Og nu kan vi faktisk bruge dette element og ændre det, eller få adgang til dens værdier, sådan noget. Vi kan faktisk begynde at engagere sig med websiden. Så her siger jeg, OK, nu hvor jeg har at knap, når der klikkes på, kalder denne anonyme funktion. Så det er her anonym funktioner blive nyttig. Og hvad betyder den funktion at gøre? Tja, det bare kalder dette alarm funktion, og det siger, du har klikket på knappen Søg. Så hvad vil der ske, hvis jeg går derhen, hvor denne HTML bor og jeg klikker på knappen, Jeg får en fancy lille advarsel der siger, at du har klikket på knappen. Så de ting at fokusere på her-- document.getElementById får en bestemt HTML element med den givne ID. Og nu kan vi sætte hvad der skal ske, når at særlige element er klikket. PUBLIKUM: Vi er nødt til at sætte alt dette i? HANNAH BLUMBERG: Beklager? PUBLIKUM: Har vi til fysisk kode alt dette? HANNAH BLUMBERG: Har vi til fysisk kode alt dette? Ja. Er det ikke den slags irriterende? Dette er en masse kode. PUBLIKUM: Du kunne importere noget. HANNAH BLUMBERG: Right. Vi kunne bruge noget. Og i particular-- åh, det er fortæller mig, jeg er nødt til at undervise i sektionen. Især lad os bruge biblioteket jQuery, fordi der var virkelig lang og virkelig irriterende og jeg ønsker at være i stand til at forenkle det og gøre det kortere og lettere at skrive. Så jQuery er en JavaScript-bibliotek. Så JavaScript er programmering sprog; jQuery er et bibliotek. Og det gør en masse ting lettere. Det gør skiftende og går på tværs et HTML-dokument meget lettere. Det gør håndtering lettere begivenheder. Det gør animation nemmere og det gør Ajax lettere. Så lad os springe ind i to af disse ting lige nu. Undskyld mig. Før vi gør det, nogle grundlæggende syntaks. Dette er, hvad de fleste opkald til jQuery biblioteket se ud. Vi bruger denne dollar sign-- ingen forbindelse tegn til PHP, bare inconvenient-- navnet på en vælgeren, prik, og derefter en handling. Så lad os se nogle konkrete eksempler på det. Så det faktisk er den samme kode fra begivenheden slide. Så denne lange, grimme ting bliver dette meget pænere, mindre ting. Så lad os prøve at opdele det. Det siger, OK, jQuery-- denne dollar sign-- jQuery, finde mig i vinduet. Så det er vælgeren. Når det indlæses, kalder denne funktion. Så det er alt inde. OKAY. Så langt så godt? Okay. Nu jQuery, find mig ting med ID search_button. Og hvad det er klikket, kalder denne funktion. Og så er denne funktionens præcis det samme. Bare gør en lille smule af indberetning, du har klikket på knappen Søg. Så det er virkelig rart. Det er virkelig kondenserer og forenkler vores kode. Hvordan vidste jeg, at det er ID search_button og ikke som klasse search_button? PUBLIKUM: Hashtag? HANNAH BLUMBERG: Ja. Denne hash symbol, det er ligesom CSS. Så husk, med CSS, når vi ønskede at vælge noget af ID, vi brugte pundet tegn. Og når vi ønskede at vælge noget ved klassen, bruger vi prik. Alle tiders. Give mening? Så jQuery formodes at bare gøre vores liv lettere. Ja. PUBLIKUM: Så jeg er lidt forvirret som hvordan anonym funktionen fungerer. Har du navngive denne anonymouse funktion, fungere? Hvordan er det hedder? HANNAH BLUMBERG: Selvfølgelig. Så funktionen er bare et nøgleord, siger, jeg er ved at definere en funktion. PUBLIKUM: Åh, OK. HANNAH BLUMBERG: OK? Og så har vi videregive det som en argument at-- lad os tage denne indre en-- til klikfunktion. Så yeah, så funktion, denne anonyme funktion, bliver en faktisk argument. Så husk i JavaScript, vi kan behandle funktioner som værdier. PUBLIKUM: Åh, OK. HANNAH BLUMBERG: Ja. Jeg kan godt lide, at "åh." Pæn. Andre spørgsmål? Tid? MARIA ZLATKOVA: God. God. HANNAH BLUMBERG: Awesome. Nogle hurtige nyttige jQuery. Jeg har ikke tænkt mig at gå gennem alle disse. Disse slides vil være op online en lille smule senere, så du kan tjekke det ud lidt senere. Men dybest set, den generelle mønster holder, hvor vi siger, OK, hey, jQuery, her er min vælgeren og så her er en handling. Og du kan gøre ting som adgang for værdien af ​​en formular, adgang til nogle HTML, kontrol, hvad der sker, når brugeren sender en formular, ting som. Ja. PUBLIKUM: Så i eksamen, vi vil få brug for at vide en hel del fra jQuery dokumentation. Så da vi copy / paste jQuery dokumentation til vores bedrager ark, Hvor er linje trukket? Ligesom hvor mange har vi brug for at vide? HANNAH BLUMBERG: Great spørgsmål. Spørgsmålet er væsentlige eftersom man kan ikke få adgang til jQuery dokumentation under prøven, hvor meget bør du vide? Vi ville ikke forvente dig til at komme op med nogle tilfældige funktion at vi ville forvente dig til Google. Ting, der er fair spil er jeg ville siger bare lidt af det generelle syntaks, at være i stand til at vælge på ID og ved class-- så ligesom CSS. Og så de faktiske funktioner dem selv, vil vi sandsynligvis fortælle dig. Ja. PUBLIKUM: Så når du vælger efter klasse ville betyde prik. HANNAH BLUMBERG: Ja, præcis. God. Når du vælger efter klasse, går det skal dot i stedet for pund tegn. Ja. PUBLIKUM: Ville du gå over forskellen mellem udvælgelsen af ​​ID og klasse? HANNAH BLUMBERG: Selvfølgelig. Forskellen mellem valg ID og vælge efter klasse. Så som Maria sagde en lidt tidligere, er der kan kun være én HTML-element med en given id, mens klassen, det giver os mulighed for at gruppere en flok af forskellige elementer sammen, så ting, der er relateret, men ikke nøjagtigt det samme. Betyder det at besvare spørgsmålet? Awesome. Ja. PUBLIKUM: Hvad hvis du har flere ting, der er i samme klasse? HANNAH BLUMBERG: Hvad sker der hvis du har flere ting, er de samme klasse? Så for eksempel, hvis vi er blot ved hjælp af ren JavaScript, vi ville gøre noget lignende document.getElementsByClass. Og så hvad der rent faktisk gør er returnerer et array af elementer. Og du er nødt til enten at gentage over dem eller finde hvilken en du ønsker. Det kommer ikke til at give du et enkelt element. Det kommer til at give dig et array af elementer. Store spørgsmål. Ellers andet? Awesome. Så jeg tror, ​​at hvis du er fortrolig med enhver jQuery du så i pset, du skal være god til at gå. Spørgsmål? Åh nej. Jeg virkelig nødt til at undervise. Slap af. Det vil være fint. Jeg får der. Lad os tale om Ajax. Så Ajax bliver en-- godt, lad os starte med hvad det står for. Det er et akronym. Det står for Asynchronous JavaScript og XML. Og XML er dybest set vil være [Uhørlig] med en form for vores data. Men vi har faktisk ikke brugt XML. I stedet skal vi bare bruge JSON. Så dybest set, det er nogle data-- asynkron, JavaScript, og data, i dette tilfælde, JSON. Og vores mål, som vi nævnte lidt tidligere, er at være i stand til at foretage en anmodning, har denne anmodning gøre dens ting i baggrund, men fortsætter gøre, hvad vi har til hensigt at gøre. Og så når disse oplysninger er klar, så vi vil indarbejde det. Så lad os se, hvad dette faktisk ser ud. Og dette, skal du være lidt kender fra pset8, den du lige slået. Så her er et gyldigt jQuery funktion, som vi måske ønsker at vide om-- denne dollartegn. Så det siger jQuery funktion, .getJson. Og hvad denne funktion gør, er det tager en URL og nogle parameters-- så jeg tror i sagen af pset8, var det ligesom, URL'en var articles.php og parametre var go = nogle postnummer. Og det siger, OK, fremsætte en anmodning til denne URL med de givne parametre. Og der bare sker. Når den er færdig, er det enten kommer til at fuldføre eller det kommer til at mislykkes. Så dette er hvad der svarer til opkaldet Rob og bede ham om at gøre noget. Og derefter, når han kalder tilbage, er han enten kommer til at sige, at jeg er færdig, eller jeg fejlede. Så i det tilfælde, hvor du er gjort, du siger, OK, jeg er færdig. Og så er du kalder denne funktion. I dette tilfælde vil det være en funktion, der tager nogle oplysninger. Den ene vi normalt bekymrer sig kun om data, de data, vi faktisk blev returneret som et resultat af at kalde .getJSON. Og du kan gøre noget med det. Så i tilfælde af pset8, Vi viste det som en liste. Fail vil være en funktion som kaldes hvis anmodningen ikke uanset årsagen. Og i tilfælde af pset8, vi bare console.log det. Eventuelle spørgsmål om det? Ja. PUBLIKUM: Kan vi bare bruge funktionen theta i stedet for funktion, textStatus, jqHXR. HANNAH BLUMBERG: Selvfølgelig. Så ja, jeg tror i pset, vi lige set funktion data. Så det er bare til-- ja, OK. Det er, hvad vi så i pset. Det er helt fint. Disse er blot, hvis du ønsker at trække sig ud af mere information, det er disse ting, du kunne få fra .getJSON. Godt spørgsmål. Ellers andet? Ja. PUBLIKUM: Så .getJSON er Ajax? HANNAH BLUMBERG: OK. Så dette er den slags vanskelige del. Det er en jQuery funktion, der giver dig til at gøre asynkrone opkald. Og de asynkrone opkald, der er hvad vi har at henvise til som Ajax. Ja. Det tog mig virkelig lang tid at trække fra hinanden, når jeg var studerende. PUBLIKUM: Kan du sige det igen? HANNAH BLUMBERG: Ja. Kan jeg sige det igen? Denne .getJSON funktion, det er en jQuery funktion. Og det kommer til at gøre en asynkron opkald. Og disse asynkrone opkald, vi har været at henvise til dem som Ajax. Andre spørgsmål? Vi har blot et par minutter tilbage. Og Maria kommer til at wrap op med sikkerhed og så vil vi at være lige omkring færdig. MARIA ZLATKOVA: Awesome, OK. Så dette is-- bare tage et par sekunder til at kigge over dette. Og det er ikke noget, virkelig stor. Og kan nogen fortælle mig hvorfor? Hvad foregår der i foo og kan kunne potentielt resultere i noget slemt, og hvad det hedder? Ja. PUBLIKUM: Hvis argumentet, der er bestået i mere end 12 tegn, det kunne løbe over. MARIA ZLATKOVA: Right. Perfektionere. Hvad hedder det? Du har lige nævnt det. PUBLIKUM: Buffer overflow. MARIA ZLATKOVA: Yup, buffer overflow. Så det er noget, vi refererer til som buffer overflow. Og vi ser, at indersiden af ​​foo, vi har defineret vores buffer, c, med en størrelse på 12. Men i hovedsagen, gør vi ikke tjekke på nogen måde overhovedet om argv1-- så var det andet argument. Vi har ikke kontrollere, om størrelsen af ​​det er hensigtsmæssigt. Så hvis vi havde en især ondsindet bruger der sætte nogle argument, var længere end 12, og derefter potentielt ud over grænserne for, at argument, havde nogle eksekverbar kode at han forsøgte at gøre noget slemt med den; så, hvad der ville ske, ville tilsidesætte tilbagevenden adresse på foo funktion, forårsager funktionen til, når vender tilbage til at udføre denne kode. Og så dårlige ting kunne ske. Betyder det mening at alle? Og hvordan kan vi beskytte mod denne? Nogen forslag? Dybest set, indersiden af potentielt foo, hvordan kan vi kontrollere, at at der ikke kan ske? Målgruppe: Hvis størrelsen 12 overskrides, du vil afsætte ekstra hukommelse? MARIA ZLATKOVA: forslag er, tildele ekstra hukommelse størrelse overskredet. Faktisk kan vi gøre noget meget enklere end at så godt. Vi kan bare få strengen længde af det argument, at der indtastes, kontrollere, om der er mindre end eller lig med 12-- hvilket er, hvad vi ønsker det at være, fordi vi ikke ønsker det til at overskride grænserne for vores buffer. Og derefter, hvis det ikke sker, vi kan arbejde med det argument. Og derefter, hvis det gør det, vi faktisk ønsker at gule sol potentielt på brugeren. Men dette er, hvordan vi ville gøre det. Ja. PUBLIKUM: Kunne du forklare memcpy rigtig hurtig? MARIA ZLATKOVA: Åh, undskyld. Ja. Memcpy tager uanset is-- ked af det, OK. Memcpy tager hvad der er i bar, uanset passeres på foo som kommandolinjen argument. Så det vil tage argv1. Argv1 kaldes bar her. Så det kommer til at tage bar og det kommer til at kopiere det ind i c. PUBLIKUM: OK. MARIA ZLATKOVA: Og det kommer til at copy-- det tredje argument bare refererer til, hvor meget det kommer til at kopiere ind c. PUBLIKUM: Ah. Så denne ens kopiering det hele derefter. MARIA ZLATKOVA: Ja, det er at kopiere det hele. Yep. Først vi sørge baren er ikke svarende til null, fordi det er en pointer. Derefter får vi strengen længde bar. Vi sørger for, at det er mindre end eller lig med 12. Og så fordi vi har sørgede, kan vi faktisk memcpy og være sikker på, at det er OK. Nogen spørgsmål? Alle tiders. Jeg har to sande eller falske spørgsmål. Kan nogen fortælle mig det samme hvis disse er sande eller falske? Ja, det er falsk. Nøjagtig. Begge af dem er falske. Så ved hjælp af en enkelt adgangskode er aldrig rigtig god idé fordi hvis nogen kender din adgangskode, kan de bare få adgang til alle dine andre konti. Og så ikoner gøre noget for at sikre sikkerheden. Vi bør normalt ser for HTTPS i stedet for HTTP og URL'en. Og nogle andre typer af angreb, som vi har nævnt, at David har nævnt i foredrag, SQL injektion angreb. Vi har allerede set, at hvis vi don't-- den CS50 query funktion gør sikker på, at SQL injektion angreb kan ikke forekomme. Men hvis vi ikke bruger CS50, tilbud, citat slut "i forespørgslen," vi ville have til at sørge for, at brugerinput er ikke faktisk nogle SQL forespørgsel, der vil forårsage alle vores borde, der skal droppes eller noget dårligt at ske med vores database. Session kapring er en anden type angreb der sker, når nogle dårlige person bruger nogle ofrets session ID for at få adgang til login-oplysninger. Så en meget trivielt eksempel på det er gerne, hvis vi har en offentlig computer, så dårligt menneske logger ind og derefter de har cookies, der er gemt. Og cookies ikke ændre sig for sessionen. Så har vi ofret gå i og derefter logge ind på hjemmesiden. De cookies ændrer ikke for en bestemt session. Og så offeret logger ind hjemmesiden og derefter efterlader. Og derefter den person, der går tilbage kan så stadig bruge deres session-id at få adgang til deres oplysninger. Så det er et eksempel på hvordan det kunne ske. Og så ville jeg ikke bekymre dig for meget om specifikke kode eller noget gerne, at der kunne forårsage dette, men som har en slags idé om, hvad De er involveret i denne variabler. Og derefter manipulere header data er en anden type angreb der har David har talt om. Og det bare refererer til hvad der kan ske, når svaret, HTTP reaktion inde i vores header ikke desinficeres korrekt. Og enhver af fields-- for eksempel hvis nogen overskriver en af ​​headeren værdier for at indeholde noget mere end hvad de skal contain-- og faktisk indeholde for eksempel en 200 OK statuskode, så de kunne potentielt gøre ondsindet ting, når de ikke skal. Men jeg ville ikke bekymre dig for meget om den specifikke kode der kunne forårsage dette, bare slags forståelse højt niveau sådan noget. Jeg tror, ​​det er alt at vi er nødt til at dække. Fantastiske. Nogen der har nogen spørgsmål om nogen af de ting, vi er dækket? Ja. PUBLIKUM: Så en slags mere logistiske spørgsmål. Er indholdet hovedsagelig fokuseret på tingene efter quiz 1? MARIA ZLATKOVA: Så Spørgsmålet er, er indholdet fokuserede primært på tingene efter quiz 1? Så er der fokus på, efter quiz 1, med undtagelse at vi er nødt til at fokusere på ting i pset5 og en masse af de datastrukturer at vi dækket. Og vi kan ikke sige, at vi kan ignorere noget før det, fordi det bygger på det så godt. Så fokusere på det, plus pset5 materiale ligesom herunder forbundne lister, stakke, køer, og alt at Hannah gik over. HANNAH BLUMBERG: Right. Ja, vi gik over al C kram i begyndelsen meget hurtigt. Men sørg for at gennemgå det. Gå tilbage og se quizzen 0 anmeldelse. Et par mere logistiske noter, lige, mens vi har din opmærksomhed. Vi kommer til at have kontortid både mandag og tirsdag aften. De kommer til at være i MD 119. Dette er alt på hjemmesiden, så hvis du ikke høre det, ingen bekymringer. MARIA ZLATKOVA: 8:30 til 11:00. HANNAH BLUMBERG: Ja, fra 8:30 til 11:00. Vi vil være der. Vi vil være der til at besvare spørgsmål. Det er temmelig chill og sjov. Du fyre kan stille spørgsmål at du har på quiz 1. Og quiz 1 er på Onsdag så held og lykke. Hvis du har spørgsmål, måske kommer tale med os op her en-til-en. Afkøle. Tusind tak. MARIA ZLATKOVA: Tak så meget, gutter. PUBLIKUM: Yay. [BIFALD]