ZAMYLA CHAN: Vel, her er vi, den siste p-satt i CS50. Gratuler dere fra å ha kommet så langt siden den første Hallo Verdener og utskrift Opptil Pyramidene for Mario. Du har gjort en nettside i forrige uke. Og vi kommer til å være å gjøre en annen denne uken, en som lar deg kjøre rundt i Harvard campus, plukking opp CS50 ansatte og å bringe dem tilbake til deres bolighus. Nå, i forrige uke jobbet vi i PHP, en server side språk. For denne p-sett, vi blir introdusert til Javascript, noe som er en klientsiden språk. Så la oss ta en titt på noen av de distribusjon kode som er gitt til du for denne p-settet. I Javascript-mappen, det vil være en haug av Javascript-filer. Det er buildings.js, som inneholder en rekke bygninger rundt Harvard campus med sin informasjon og posisjon. Houses.js er en rekke Harvard bolighus med deres breddegrader og lengdegrader. Passengers.js inneholder en rekke passasjerer, de CS50 ansatte at du skal bringe tilbake til sine boliger. Math3D.js, som inneholder mye funksjoner å gjøre med bevegelsen. Hvis du er matematisk tenkende, deretter Jeg ønsker deg velkommen til å ta en titt. Men du trenger ikke å forstå alt der inne. Shuttle.js, som omhandler romfergens bevegelse. Og index.html er hjemmesiden der alt som skjer, egentlig, hvor brukeren er i samspill med området. Service.css er CSS-stilark, som i tillegg til den Twitter Bootstrap Library, kontroller hvordan index.html utseende. Og så har vi også service.js, som inneholder servicefunksjoner for Shuttle. Og her er hvor du kommer til å være fylling i noen av de to-do-tallet. La oss nå ta en titt på objektene og assosiative arrays i Javascript, som for alle praktiske formål, er utskiftbare. Hvis jeg ønsket å lage et objekt en variabel kalt en tryllestav, jeg ville erklære det. Og inne i disse klammeparentes, ville jeg spesifisere, er kjernen enhjørning, veden er kirsebær, og lengden er 13. Nå kan jeg også få tilgang til verdier av objekter ved hjelp assosiativ matrise notasjon. Så wand indeksen kjerne, kan jeg stille som lik enhjørning, eller sjekk at hvis jeg trenger. Eller jeg kan bruke dot operatør wand.wood tilsvarer kirsebær, og så videre og så videre. Så du ser at assosiative matriser og objekter i Java kommer til å være utskiftbare, og vilje kommer i ganske hendig. Så ser vi en rekke bygninger i buildings.js, igjen, en rekke gjenstander. Hvis jeg ønsket å gjøre en rekke av de beste bygninger på Harvard campus, deretter Jeg ville gjøre det på følgende måte. Ved hjelp av dette objektet notasjon, der Jeg lagrer roten, navn, adresse, breddegrad og lengdegrad for hver enkelt bygning objekt. La oss raskt snakke om variabler i Javascript. Som PHP, Javascript variabler er svakt eller løst skrevet. For å opprette en lokal variabel, prefiks deg variabelnavnet med V-A-R, var. Nå, i Javascript, funksjoner vil begrense omfanget av variabler. Så hvis du har en lokal variabel i en funksjon og andre funksjoner kan ikke tilgang til den. Men i motsetning til C, løkker og betingelser ikke begrense omfanget av en variabel. Så selv om du erklærer det inne i en tilstand, vil hele funksjonen har tilgang til det. Nå, uten var, variabelen vil være global. Så hvis du bare erklære navnet og tilordne en verdi, da den variabelen vil være en global variabel i Javascript. Nå, i hus, har vi en assosiativ rekke verts type gjenstander, hvor hvert hus er bare en breddegrad og en lengdegrad. Da har vi passasjerene matrise, som er en matrise av objekttype passasjer. Så hver passasjer har en bruker navn, et navn, og et hus. Legg merke til at jeg sier av type passasjer, som egentlig bare betyr at hvert objekt har samme sentrale verdi-par. Så hver objekt av typen passasjer har et brukernavn, et navn, og et hus. Så hva trenger vi å gjøre for p-settet? Vel, vi trenger å tillate brukere å plukke opp ansatte, for å vise alle de ansatte som er i vår transport, og å slippe dem av. Og da vil vi også snakke om ekstra funksjoner som kan implementeres for Shuttle p-set. Men la oss snakke om pickup først. Ansiktene til CS50 ansatte har vært plantet over hele campus, hvor hver ansiktet er implementert som et sted mark på 3D-jord, og som en markør på 2D-kartet. Så når brukeren klikker Pickup knappen, vil vi legge til i nærheten passasjerer til romfergen. Og vi ønsker også å fjerne sin plass markere fra verden og fjerne deres markeringen fra kartet, som indikerer at de er i vår shuttle nå. Så hvordan kan vi oppdage om passasjerene er innenfor rekkevidde av vår transport? Vel, funksjonen avstand, så shuttle.distance, passerer i breddegrad og lengdegrad, vil beregne avstanden fra nåværende posisjon av skyss til det punktet at du angir med at gitt breddegrad og lengdegrad. Så du kan bruke dette til å beregne avstand fra transport til passasjerer. Men hvordan vet du hvor passasjerene er? Vel, det er der vi må redigere befolke funksjon. Fylle steder alle de ansatte i passasjerer i verden og inn i kartet, men ikke lagre deres plassering. Så kanskje du kan oppbevare plassere merker og markører i noen global array. Nå er det allerede en global matrise lagring av informasjon fra passasjerene. Passasjerene array-butikker hver passasjerens navn og huset deres. Så kanskje du kan legge til et par parametere det til personobjekter. For å hjelpe oss med å finne alle passasjerene innenfor rekkevidden av vår transport, la oss sløyfe gjennom alle passasjerer i passasjerer matrisen. En for løkke i Javascript, kan se noe sånt som dette, svært lik de etter looper i C. Eller vi kan bruke en alternativ for loop struktur, for Var jeg i matrise, hvor jeg vil fortsatt være indeksen, men du trenger ikke å spesifisere tabell.length tilstand og jeg + +. Hver passasjerens posisjon er gitt av sin plass mark. Men stedet merket er ikke den breddegrad og lengdegrad. Vi må få tilgang til disse parametrene ved få geometri, å bruke Get geometri på stedet mark, og deretter når vi har geometri, får enten breddegrad eller lengde ved hjelp av disse funksjonene. Så nå vet vi hvordan å oppdage om passasjerer er innenfor Utvalget av våre shuttle. Når vi har disse passasjerene, vil vi ønsker å legge til noen passasjerer som er innenfor dette området. Vi ønsker å tillate dem å hoppe på og ta en plass på vår shuttle, men bare hvis vi har nok plass til dem. Den shuttle.seats array vil indikere om setene er tomme, eller hvem som er i det setet. Så hvis et sete er tomt, så at setet skal være null. Så iterere over setene array, sjekker for tomme seter, lagring passasjerer i setene til du har ikke noen flere tomme seter. Og dessverre, noen andre passasjerer blir nødt til å vente på neste gang romfergen kommer ned. Når de kommer på romfergen, vil vi ønsker å fjerne sin plass mark, som er deres bilde i 3D-verden. Hvis jeg ønsket å fjerne et sted mark p, da ville jeg få alle funksjonene fra min Earth, fra Google Earth, og fjern deretter bestemt sted markere ved hjelp removeChild funksjon. Så til slutt, la oss fjerne markøren, ikonet på 2D-kartet, for ethvert passasjer som vi plukker opp. Hvis du vil fjerne en markør m, så skal jeg bare utføre m.setMap null. Gjør dette for alle passasjerer som er innenfor rekkevidde, og du er ferdig pickup. Diagrammet Funksjonen skal vise alle av passasjerene som er i din transport, og ledig sete hvis tom. Så diagram bør iterere over shuttle.seats, viser passasjer informasjon for hver indeks, og ledig sete hvis indeksen er null. Nå hvis HTML teksten er satt inne i en Java variabel, deretter ved å bruke document.getElementById, diagram kan redigere indre HTML av at gitt element ved å tilordne HTML tekst til document.getElementById indre HTML variabel. Når brukerne klikker på Drop Off-knappen i index.html, vil det ringe avleveringsby funksjon. Og det er vår jobb å implementere det. I frafallsfrekvensene, vil vi ønske å fjerne eventuelle passasjerer fra shuttle bare hvis vi er innenfor rekkevidde av sin destinasjon, deres bolig hus. Så frafallsfrekvensene blir nødt til å sjekke om shuttle er innenfor rekkevidde av noen av hus, og fjern eventuell nødvendig passasjerer fra romfergen. Så hvordan skal vi sjekke om vi er innenfor rekkevidde av noen hus? Vel, nok en gang, vil vi gjøre bruk av shuttle.distance funksjon, passerer i breddegrad og lengdegrad på det punktet at vi sjekker mot. Men hva er disse punktene? Vel, det husene array, hvis du husker i houses.js, lagrer breddegrad og lengdegrad på hvert hus i en assosiativ array, der hver indeksen er navnet på det huset. Så å fjerne passasjerer - vel, bare hvis vi er innenfor rekkevidde av deres hus som de ønsker å gå til. Så igjen, husk at passasjerene lagrer huset at hver passasjer ønsker å gå til. Hvis de er innenfor rekkevidden av deres huset, så får vi ta det passasjer fra shuttle.seats og sett deres posisjon i matrisen til null. Nå la oss snakke om noen ekstra funksjoner som kan implementeres i den CS50 Shuttle p-set. Det er et poengsystem hvor du holde oversikt over hvor mange påpeker en bruker har. For å slippe av passasjerer vellykket, kan de få poeng. Men for å prøve å slippe av passasjerer hvor det ikke er noen hus i nærheten, vel, kan de bli straffet for det. Så kanskje du ønsker å holde styr på punktene i en global variabel. Du kan implementere kanskje et tidsur, hvor brukeren har en viss tid til å plukke opp og slippe av en visst antall passasjerer. Kanskje til og med integrere dette med punkt-system. Eller du kan redigere figur slik at passasjerer er sortert etter huset. Så det ville trolig være en slags fungere til shuttle.seats. Du kan implementere en flygende funksjon, der hvis brukeren innganger Konami kode, og deretter shuttle løftes fra bakken og shuttle kan fly. Men for en trygg frafalt, best å gjøre shuttle lande hjulene på bakken først. Du kan også implementere teleportering, hvor du gjør en rullegardinlisten med bygninger i index.html. Og velge en av dem, den Brukeren vil bli transportert til at bygningen på campus. OK, men å reise gjennom veggene i noen bygninger på veien dit. Du kan også endre hastigheten på transport, slik at brukeren kan øke eller redusere hastigheten. Kanskje du vil ha en global variabel til holde styr på hvor mye drivstoff den shuttle har, mink det etterhvert. Når du treffer null, skjønt, shuttle vil ikke være i stand til å bevege seg med mindre du har refueled, kanskje ved hjelp av en knapp, eller selv lage din egen bensinstasjon. Men det er absolutt ikke en uttømmende liste. Sjekk ut spec for hele listen, eller kanskje foreslå din egen til TF. Himmelen er grensen. Dette er din siste CS50 p-sett, så ha det gøy med det. Dette var CS50 Shuttle. Jeg har å si, det har vært en glede noe som gjør disse til deg med produksjonsteamet. Og jeg håper at du har liker dem, også. Mitt navn er Zamyla. Og dette var CS50.