[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.