>> [Redare a muzicii]
>> SPEAKER 1: Ei bine, aici suntem, ultimul set P în CS50.
Felicit vă de la a avea ajuns atât de departe de la prima ta salut
lumi și imprimarea piramide pentru Mario.
Ai făcut un site de săptămâna trecută.
Și vom fi a face o alta în această săptămână, unul care vă permite să
conduce în jurul campusul Harvard, cules up membri ai personalului CS50, și
care le aduce înapoi la lor case de locuit.
>> Acum, săptămâna trecută am lucrat în PHP, un limbaj partea de server.
Pentru acest set P, suntem obtinerea introdus pentru JavaScript, care este o
client limbaj parte.
Deci, haideți să aruncăm o privire la unele dintre cod de distribuție care este furnizat de
vă de acest set P.
>> În dosarul JavaScript, va exista să fie o grămadă de fișiere JavaScript.
Există buildings.js, care conține o serie de clădiri din toată Harvard
campus, cu informațiile lor și poziția.
Houses.js este o matrice de la Harvard case de locuit, cu lor
latitudine și longitudine.
Passengers.js conține o matrice de pasageri -
membrii personalului CS50 -
că veți fi adus înapoi la casele de locuit.
>> Math3D.js, care conține o mulțime de Funcțiile de a face cu mișcarea.
Dacă sunteți matematic minte, atunci eu vă urez bun venit să aruncăm o privire.
Dar nu aveți nevoie pentru a înțelege tot acolo.
Shuttle.js, care se ocupă cu miscarea navetei.
Și index.html este pagina de start în care tot ceea ce se întâmplă, într-adevăr, în cazul în care
utilizatorul interacționează cu site-ul.
>> Service.css este foaia de stil CSS, care, în plus față de Twitter
Bibliotecă Bootstrap, controale cum arată index.html.
Și apoi ne-am, de asemenea, service.js, care conține funcții de service pentru
naveta.
Și aici e în cazul în care ai de gând să fie completarea în unele din la dos.
>> Acum, haideți să aruncăm o privire la obiecte și matrice asociative în JavaScript,
care pentru toate punctele de vedere sunt interschimbabile.
Dacă am vrut să fac un obiect o variabilă numit o baghetă, mi-ar
declare.
Și în interiorul acestor acolade i-ar specifica de bază este unicorn.
Lemnul este de cires.
Iar lungimea este de 13.
>> Acum pot accesa, de asemenea, valori de obiecte folosind
asociativ notație matrice.
Core index așa bagheta, eu pot seta care egal la unicorn, sau
verifica că, dacă am nevoie.
Sau pot utiliza operatorul punct.
Lemn bagheta punct este egal cu cireșe, și așa mai departe, și așa mai departe.
Deci, vedeți că tablouri asociative și obiecte JavaScript vor fi
interschimbabile, și voința vin în destul de la îndemână.
>> Apoi, vom vedea o serie de clădiri în buildings.js.
Din nou, o serie de obiecte.
Dacă aș fi vrut să fac o serie de cele mai bune clădirilor din campus la Harvard, apoi
Mi-ar face după cum urmează.
Folosind această notație obiect, în cazul în care Am stoca rădăcină, numele, adresa,
latitudine, longitudine și pentru fiecare obiect singura cladire.
>> Hai sa vorbim repede despre variabile în JavaScript.
Cum ar fi PHP, JavaScript variabile sunt slab sau vag tastat.
Pentru a crea o variabilă locală, aveți prefixul numele variabilei cu V-A-R, var.
>> Acum în JavaScript, funcții vor limita domeniul de variabile.
Deci, dacă aveți o variabilă locale în o funcție, apoi alte funcții
nu-l poate accesa.
Dar, spre deosebire de C, bucle și condiții nu limita domeniul de aplicare a unei variabile.
>> Deci, chiar dacă se declară în interiorul unei condiție, întregul funcția va
au acces la ea.
Acum fără var, variabila va fi la nivel mondial.
Deci, dacă ai declara doar numele și atribui o valoare, atunci variabila
va fi o variabilă globală în JavaScript.
>> Acum, în case, avem o asociativ tablou de obiecte de tip casă, în cazul în care
fiecare casă este doar o latitudine și o longitudine.
Apoi, ne-am pasagerii matrice, care este o matrice
de tip obiect de pasageri.
Deci, fiecare pasager are un nume de utilizator, un nume, și o casă.
Observați că eu văd de tip pasageri, care de fapt înseamnă doar
că fiecare obiect are aceeași pereche valoare-cheie.
Deci, fiecare obiect de tip pasager are un nume de utilizator, un nume, și o casă.
>> Deci, ceea ce avem nevoie pentru a face pentru setul P?
Ei bine, avem nevoie pentru a permite utilizatorilor de a alege up membri ai personalului, pentru a afișa toate
membrii personalului care sunt în prezent în transfer de la noastră, și să fixați-le off.
Și apoi vom vorbi de asemenea despre suplimentar caracteristici care pot fi implementate pentru
set P de transfer.
>> Dar hai sa vorbim despre primul pickup.
Fețele de personal CS50 au fost plantat peste tot campus, unde fiecare
Fața este implementat ca un semn loc pe pământ 3D, și ca o
marker pe harta 2D.
Deci, atunci când utilizatorul face clic pe pick-up buton, dorim să adăugăm în apropiere
călători naveta.
Și ne-am dori, de asemenea pentru a elimina locul lor marca din lume, și scoateți lor
marcator de hartă, indicând faptul că ei sunt în transfer nostru acum.
>> Deci, cum putem detecta dacă pasagerii sunt în gama de transfer de la noastră?
Ei bine, distanța funcție -
astfel de transfer punct distanță, trece în latitudinea și longitudinea, va
calcula distanța de la nivelul actual poziția de transfer la
punct pe care le specificați cu care dat latitudine și longitudine.
Astfel, puteți utiliza această pentru a calcula distanta de transfer la
pasagerilor.
>> Dar cum a face tu știi unde pasagerii sunt?
Ei bine, asta e în cazul în care va trebui să edita funcția popula.
Popula locuri de toți membrii personalului și a pasagerilor în lume,
și în harta, dar nu stoca locația lor.
Asa ca, probabil, puteți stoca lor loc mărci și markeri
în unele matrice global.
>> Acum, există deja o gamă globală stocarea de informații de la pasageri.
Pasagerii matrice magazine fiecare Numele pasagerului și casa lor.
Deci, poate că puteți adăuga câțiva parametri acolo a obiectelor de pasageri.
>> Pentru a ne ajuta detectarea tuturor pasagerilor în gama de transfer de la noastre, să
buclă prin toate de pasageri în matrice de pasageri.
O buclă de activarea JavaScript-ar putea arata ceva de genul asta, foarte asemănătoare cu
cei pentru buclă în C. Sau putem folosi un alternativă pentru structura buclă.
>> Pentru i var în matrice, unde am va fi în continuare indicele.
Dar nu aveți nevoie să specificați lungimea matrice dot
condiție, și i plus, plus.
Locație fiecare pasager este dat de marca lor loc.
>> Dar marca locul nu este latitudinea și longitudinea.
Avem de a accesa acești parametri de obtinerea de geometria, folosind get
geometrie pe marca locul.
Și apoi o dată ne-am geometria, obtinerea fie de latitudine sau
longitudine, folosind aceste funcții.
>> Deci, acum stim cum de a detecta dacă pasagerii sunt în
gama de transfer noastre.
După ce vom avea aceste persoane, vom doriți să adăugați orice pasageri care sunt
în acel interval.
Ne dorim pentru a le permite să hamei pe, și ia un loc pe naveta noastră, ci numai
dacă avem destul loc pentru ei.
>> Matrice de locuri de transfer de dot va indică dacă numărul de locuri sunt goale, sau
care este în acel loc.
Deci, dacă un scaun este gol, atunci care loc va fi nul.
Astfel repeta peste matrice de locuri, verificarea de locuri goale, stocarea
călători în aceste locuri până când Nu am nici mai multe locuri goale.
Și, din păcate, orice alte persoane va trebui să așteptați pentru
data viitoare naveta vine în jurul valorii.
>> Odata ce ajung pe navetă, vom dori pentru a elimina marca locul lor, care
este fotografia lor în lume 3D.
Dacă am vrut pentru a elimina un marcaj loc p, atunci mi-ar lua toate caracteristicile
de la pământ meu, de la Google Earth, și apoi eliminați acel loc specific
marca folosind funcția removeChild.
Apoi, în cele din urmă, să scoateți markerul, pictograma de pe hartă 2D pentru orice
pasager care ne iau.
Pentru a elimina un marker, m, atunci eu voi executa doar m punct setMap nul.
Face acest lucru pentru pasageri în raza de acțiune, și ați terminat de preluare.