>> [MUSIK SPELA]
>> HÖGTALARE 1: Tja, här är vi, den sista P som i CS50.
Gratulera er från att ha kommit så långt sedan din första hej
världar och skriva ut pyramider för Mario.
Du gjorde en hemsida förra veckan.
Och vi kommer att göra en annan den här veckan, en som gör att du kan
köra runt Harvard campus, plocka up CS50 personal och
föra dem tillbaka till deras bostadshus.
>> Nu förra veckan vi jobbade i PHP, en server side språk.
För denna P-set, vi blir introducerade till JavaScript, vilket är en
side språk klient.
Så låt oss ta en titt på några av de kodfördelning som är försedd med
er för denna P set.
>> I JavaScript-mappen, kommer det vara ett gäng JavaScript-filer.
Det finns buildings.js, som innehåller en samling av byggnader runt Harvard
campus, med sin information och placering.
Houses.js är en samling av Harvard bostadshus, med sina
latituder och longituder.
Passengers.js innehåller en samling av passagerare -
de CS50 personal -
att du kommer att föra tillbaka till deras bostäder.
>> Math3D.js, som innehåller en hel del funktioner för att göra med rörelsen.
Om du är matematiskt sinnade, då välkomnar jag att du tar en titt.
Men du måste förstå allt där.
Shuttle.js, handlar det med skytteln rörelse.
Och index.html är hemsidan där allting händer, egentligen, när det
Användaren interagerar med platsen.
>> Service.css är CSS-formatmallen, som, förutom att den post
Bootstrap bibliotek, kontroller hur index.html ser ut.
Och då har vi också service.js, vilket innehåller servicefunktioner för
skytteln.
Och här är där du kommer att bli fylla i en del av den till DOS.
>> Nu ska vi ta en titt på föremål och associativa arrayer i JavaScript,
som för alla avseenden är utbytbara.
Om jag ville göra ett objekt en variabel kallas ett trollspö, skulle jag
förklara den.
Och inom dessa klammerparentes jag skulle specificera kärnan är enhörning.
Träet är körsbär.
Och längden är 13.
>> Nu kan jag också komma åt värden av objekt med
associativ array notation.
Så trollspö index kärna, kan jag ställa som lika med enhörning, eller
kontrollera att, om jag behöver.
Eller jag kan använda punktoperatorn.
Wand dot trä är lika med körsbär, och så vidare, och så vidare.
Så du ser att associativa arrayer och objekt i JavaScript kommer att bli
utbytbara och viljan komma ganska praktiskt.
>> Sedan ser vi en rad byggnader i buildings.js.
Återigen, en array med objekt.
Om jag ville göra en samling av de bästa byggnader på Harvard campus, sedan
Jag skulle göra det på följande sätt.
Med användning av detta föremål format där Jag lagrar roten, namn, adress,
latitud och longitud för varje enda byggnad objektet.
>> Låt oss snabbt tala om variabler i JavaScript.
Liksom PHP, JavaScript-variabler är svagt eller löst skrivit.
För att skapa en lokal variabel, prefix du variabelnamnet med V-A-R, var.
>> Nu i JavaScript, funktioner kommer begränsa omfattningen av variabler.
Så om du har en lokal variabel inom en funktion, då andra funktioner
kan inte komma åt den.
Men till skillnad från C, loopar och villkor inte begränsa omfattningen av en variabel.
>> Så även om du förklara den inne i en tillstånd, hela funktionen kommer
ha tillgång till den.
Nu utan var, variabeln kommer att vara global.
Så om du bara deklarera namn och tilldela ett värde, då den variabeln
kommer att vara en global variabel i JavaScript.
>> Nu i hus, har vi en associativ samling av hus textobjekt, där
varje hus är bara en latitud och en longitud.
Sedan har vi passagerarna matris, som är en array
av objekttypen passageraren.
Så varje passagerare har ett användarnamn, ett namn och ett hus.
Lägg märke till att jag ser på typ passagerare, vilket egentligen bara innebär
att varje objekt har den samma nyckelvärde paret.
Så varje objekt av typen passagerare har ett användarnamn, ett namn, och ett hus.
>> Så vad gör vi behöver göra för P set?
Tja, måste vi tillåta användare att plocka upp personal, för att visa alla
den personal som för närvarande vår buss, och att släppa dem.
Och sedan kommer vi också tala om extra funktioner som kan genomföras för
skytteln P set.
>> Men låt oss tala om pickup först.
Ansiktena på CS50 personal har varit planterade över hela campus, där varje
ansikte genomförs som en plats märke på 3D-jord, och som ett
markör på 2D-kartan.
Så när användaren klickar på pickup knapp, vi vill lägga till i närheten
passagerare till skytteln.
Och vi vill också ta bort sin plats markera från världen, och ta bort deras
markör från kartan, vilket tyder på att de är i vår buss nu.
>> Så hur ska vi upptäcka om passagerare är inom räckhåll för vår buss?
Tja, funktionsavstånd -
så pendelpunktavstånd, som går i latitud och longitud, kommer
beräkna avståndet från den aktuella position för transfer till
pekar som du anger med det given latitud och longitud.
Så du kan använda detta för att beräkna avstånd från buss till
passagerare.
>> Men hur vet du var passagerarna är?
Tja, det är där vi måste redigera populate funktion.
Platser Fylla alla anställda och passagerare i världen,
och in i kartan, men inte förvara sin plats.
Så kanske kan du lagra sina placera märken och markörer
i någon global array.
>> Nu finns det redan är en global array lagra information från passagerarna.
Passagerarna array lagrar vardera passagerarens namn och deras hus.
Så kanske du kan lägga till några parametrar det till passagerarobjekt.
>> För att hjälpa oss att upptäcka alla passagerare inom räckhåll för vår buss, låt oss
loop genom alla passagerare i passagerar array.
En for-loop i JavaScript kan se ungefär så här, mycket lik
de för slinga i C. Eller vi kan använda en alternativ för slingstruktur.
>> För var jag i rad, där jag fortfarande kommer att vara indexet.
Men du behöver inte ange arrayen punktlängden
tillstånd, och jag plus plus.
Varje passagerare läge är som ges av deras plats märket.
>> Men den plats märket inte är det latitud och longitud.
Vi måste komma åt dessa parametrar genom få geometrin, med hjälp av get
geometri på den plats märket.
Och sedan när vi har geometri, få antingen latitud eller
longitud, med hjälp av dessa funktioner.
>> Så nu vet vi hur man upptäcker om passagerare inom
spektrum av vår buss.
När vi har dessa passagerare, vi ska vill lägga till några passagerare som
inom detta intervall.
Vi vill låta dem hoppa på, och ta en plats på vår buss, men bara
om vi har tillräckligt med utrymme för dem.
>> Skytteln dot säten array kommer ange om platserna är tomma, eller
som finns på den platsen.
Så om en plats är tom, då att stolen kommer att vara noll.
Så iterera över sätena arrayen, kontroll för tomma platser, lagring
passagerare i dessa säten tills du har inte några fler tomma platser.
Och tyvärr, alla andra passagerare kommer att behöva vänta på att
Nästa gång bollen kommer runt.
>> När de får på buss, vi vill ha att ta bort sin plats märke, som
är deras foto i 3D-världen.
Om jag ville ta bort en plats mark p, då skulle jag få alla funktioner
från min jord, från Google Earth, och sedan ta bort den specifika platsen
Markera med hjälp av removeChild funktionen.
Sedan slutligen, låt oss ta bort markeringen, ikonen på 2D-kartan för alla
passagerare som vi plockar upp.
För att ta bort en markering, m, sedan ska jag bara köra m dot setMap null.
Gör detta för alla passagerare inom räckhåll, och du är klar upphämtning.