ZAMYLA CHAN: Nah, di sini kita, p-set terakhir dalam CS50. Ucapkan selamat diri dari memiliki datang dari jauh sejak Hello pertama Anda Dunia dan Percetakan Up Piramida untuk Mario. Anda membuat sebuah website pekan lalu. Dan kita akan membuat satu sama lain minggu ini, salah satu yang memungkinkan Anda untuk berkeliling kampus Harvard, memilih up anggota staf CS50 dan membawa mereka kembali ke mereka rumah tinggal. Sekarang, minggu lalu kami bekerja di PHP, bahasa sisi server. Untuk ini p-set, kita mendapatkan diperkenalkan untuk JavaScript, yang merupakan bahasa sisi client. Jadi mari kita lihat beberapa kode distribusi yang diberikan kepada Anda untuk ini p-set. Dalam folder JavaScript, akan ada menjadi sekelompok file JavaScript. Ada buildings.js, yang berisi array bangunan di sekitar Harvard kampus dengan informasi mereka dan posisi. Houses.js adalah array dari Harvard rumah tinggal dengan mereka lintang dan bujur. Passengers.js berisi array penumpang, anggota staf CS50 bahwa Anda akan membawa kembali ke rumah tinggal mereka. Math3D.js, yang berisi banyak fungsi yang harus dilakukan dengan gerakan. Jika Anda berpikiran matematis, maka Saya menyambut Anda untuk melihat. Tapi Anda tidak perlu memahami segala sesuatu di sana. Shuttle.js, yang berhubungan dengan gerakan Shuttle itu. Dan index.html adalah halaman rumah di mana segala sesuatu terjadi, benar-benar, di mana pengguna berinteraksi dengan situs. Service.css adalah style sheet CSS, yang di samping Twitter Perpustakaan Bootstrap, kontrol bagaimana index.html terlihat. Dan kemudian kami juga memiliki service.js, yang berisi fungsi layanan untuk yang Shuttle. Dan inilah di mana Anda akan menjadi mengisi di beberapa to-do. Sekarang mari kita lihat benda-benda dan array asosiatif di JavaScript, yang, untuk semua maksud dan tujuan, yang dipertukarkan. Jika saya ingin membuat sebuah objek variabel disebut tongkat sihir, saya akan mendeklarasikan. Dan di dalam kurung kurawal tersebut, saya akan tentukan, inti adalah unicorn, kayu adalah cherry, dan panjangnya 13. Sekarang, saya juga dapat mengakses nilai-nilai obyek menggunakan notasi array asosiatif. Inti indeks Jadi tongkat, saya dapat mengatur yang sama dengan unicorn, atau memeriksa bahwa jika saya perlu. Atau aku bisa menggunakan operator dot wand.wood sama cherry, dan seterusnya dan sebagainya. Jadi, Anda melihat bahwa array asosiatif dan objek dalam JavaScript akan menjadi dipertukarkan, dan akan datang sangat berguna. Kemudian kita melihat berbagai bangunan di buildings.js, lagi, array obyek. Jika saya ingin membuat sebuah array dari yang terbaik bangunan di kampus Harvard, kemudian Aku akan membuatnya sebagai berikut. Menggunakan notasi objek ini, di mana Saya menyimpan akar, nama, alamat, lintang, bujur dan untuk setiap satu objek bangunan. Mari kita cepat berbicara tentang variabel dalam JavaScript. Seperti PHP, variabel JavaScript yang lemah atau longgar diketik. Untuk membuat variabel lokal, Anda awalan nama variabel dengan V-A-R, var. Sekarang, dalam JavaScript, fungsi akan membatasi ruang lingkup variabel. Jadi jika Anda memiliki sebuah variabel lokal dalam fungsi, maka fungsi lainnya tidak bisa mengaksesnya. Tapi tidak seperti C, loop dan kondisi tidak membatasi ruang lingkup variabel. Jadi bahkan jika Anda menyatakan hal itu dalam sebuah kondisi, seluruh fungsi akan memiliki akses ke sana. Sekarang, tanpa var, variabel akan global. Jadi, jika Anda hanya menyatakan nama dan menetapkan nilai, maka variabel yang akan menjadi variabel global dalam JavaScript. Sekarang, di rumah-rumah, kita memiliki asosiatif array objek jenis host, di mana setiap rumah hanya garis lintang dan bujur a. Kemudian kita memiliki penumpang array, yang merupakan array jenis objek penumpang. Jadi setiap penumpang memiliki user nama, nama, dan rumah. Perhatikan bahwa saya katakan jenis penumpang, yang benar-benar hanya berarti bahwa setiap benda memiliki pasangan nilai kunci yang sama. Jadi setiap objek dari tipe penumpang memiliki nama pengguna, nama, dan rumah. Jadi apa yang kita butuhkan untuk lakukan untuk p-set? Nah, kita perlu untuk memungkinkan pengguna untuk memilih up anggota staf, untuk menampilkan semua anggota staf yang sedang dalam pesawat kami, dan untuk menjatuhkan mereka. Dan kemudian kami juga akan berbicara tentang ekstra fitur yang dapat diterapkan untuk yang Shuttle p-set. Tapi mari kita bicara tentang pickup pertama. Wajah-wajah staf CS50 telah ditanam di seluruh kampus, di mana masing-masing wajah diimplementasikan sebagai tanda tempat pada Earth 3D, dan sebagai penanda di peta 2D. Jadi ketika pengguna mengklik Pickup tombol, kita ingin menambahkan sekitar penumpang untuk pesawat ulang-alik. Dan kami juga ingin menghapus tempat mereka menandai dari dunia dan menghapus mereka penanda dari peta, menunjukkan bahwa mereka berada di pesawat kami sekarang. Jadi bagaimana kita mendeteksi jika penumpang berada dalam jangkauan pesawat kami? Nah, jarak fungsi, sehingga shuttle.distance, lewat di lintang dan bujur, akan menghitung jarak dari posisi saat ini dari pesawat ulang-alik ke titik yang Anda tentukan dengan yang diberikan lintang dan bujur. Jadi, Anda dapat menggunakan ini untuk menghitung jarak dari pesawat ulang-alik ke penumpang. Tapi bagaimana Anda tahu di mana para penumpang? Nah, di situlah kita harus mengedit fungsi populate. Mengisi tempat semua anggota staf penumpang ke dunia dan ke dalam peta, tetapi tidak menyimpan lokasi mereka. Jadi mungkin Anda dapat menyimpan mereka menempatkan tanda dan spidol dalam beberapa array yang global. Sekarang, sudah ada adalah array global menyimpan informasi dari penumpang. Toko penumpang Array masing-masing nama penumpang dan rumah mereka. Jadi mungkin Anda dapat menambahkan beberapa parameter ada ke objek penumpang. Untuk membantu kita mendeteksi semua penumpang dalam jangkauan kami shuttle, lingkaran mari kita melalui semua penumpang di penumpang array. A untuk loop dalam JavaScript mungkin terlihat sesuatu seperti ini, sangat mirip dengan mereka untuk loop di C. Atau kita bisa menggunakan alternatif untuk struktur loop, untuk var i di array, di mana saya akan tetap indeks, tetapi Anda tidak perlu tentukan array.length yang kondisi dan i + +. Lokasi setiap penumpang adalah diberikan oleh tempat tanda mereka. Tapi tempat mark tidak lintang dan bujur. Kita harus mengakses parameter dengan mendapatkan geometri, menggunakan get geometri pada tempat yang ditandai, dan kemudian setelah kita memiliki geometri, mendapatkan baik lintang atau bujur menggunakan fungsi-fungsi. Jadi sekarang kita tahu bagaimana untuk mendeteksi apakah penumpang berada dalam berbagai pesawat kami. Setelah kita memiliki orang-orang penumpang, kita akan ingin menambahkan penumpang yang dalam kisaran tersebut. Kami ingin memungkinkan mereka untuk naik dan mengambil kursi di pesawat kami, tetapi hanya jika kita memiliki cukup ruang untuk mereka. The shuttle.seats array akan menunjukkan apakah kursi kosong, atau siapa di kursi itu. Jadi, jika kursi kosong, maka kursi yang akan null. Jadi iterate atas kursi array, memeriksa kursi kosong, menyimpan penumpang ke kursi tersebut sampai Anda tidak memiliki kursi lebih kosong. Dan sayangnya, setiap penumpang lain akan harus menunggu untuk kali pesawat ulang-alik turun. Setelah mereka mendapatkan pada pesawat ulang-alik, kita akan ingin untuk menghapus tanda tempat mereka, yang adalah foto mereka di dunia 3D. Jika saya ingin menghapus tempat mark p, maka saya akan mendapatkan semua fitur dari Bumi saya, dari Google Earth, dan kemudian menghapus tempat tertentu menandai menggunakan fungsi removeChild. Kemudian yang terakhir, mari kita menghapus penanda, ikon pada peta 2D, untuk setiap penumpang bahwa kita mengambil. Untuk menghapus penanda m, maka aku akan hanya menjalankan m.setMap null. Lakukan ini untuk setiap penumpang dalam jangkauan, dan Anda selesai pickup. Fungsi grafik harus menampilkan semua penumpang yang ada di Anda shuttle, dan kursi kosong jika kosong. Jadi grafik harus iterate atas shuttle.seats, menampilkan informasi penumpang untuk setiap indeks, dan kursi kosong jika indeks yang null. Sekarang jika teks HTML diletakkan dalam sebuah JavaScript variabel, maka dengan menggunakan document.getElementById, grafik dapat mengedit HTML batin yang diberikan elemen dengan menempatkan Teks HTML ke document.getElementById variabel HTML batin. Ketika pengguna mengklik tombol drop Off di index.html, itu akan memanggil fungsi penurunan. Dan itu tugas kita untuk melaksanakan itu. Dalam dropoff, kita akan ingin menghapus penumpang dari pesawat ulang-alik hanya jika kita berada dalam jangkauan tujuan mereka, rumah tempat tinggal mereka. Jadi dropoff harus memeriksa apakah pesawat ulang-alik adalah dalam kisaran dari salah satu rumah, dan menghapus dibutuhkan penumpang dari pesawat ulang-alik. Jadi bagaimana kita memeriksanya jika kita di berbagai rumah apapun? Nah, sekali lagi, kami akan memanfaatkan shuttle.distance fungsi, lewat di garis lintang dan bujur dari titik bahwa kita sedang memeriksa melawan. Tapi apa adalah titik? Nah, rumah-rumah array, jika Anda ingat di houses.js, menyimpan lintang dan bujur masing-masing rumah di array asosiatif, di mana setiap Indeks adalah nama dari rumah itu. Kemudian untuk menghapus penumpang - baik, hanya jika kita berada dalam jangkauan mereka rumah yang mereka ingin pergi ke. Jadi sekali lagi, ingat bahwa penumpang menyimpan rumah bahwa setiap penumpang ingin pergi ke. Jika mereka berada dalam jangkauan mereka rumah, maka kami akan menghapus bahwa penumpang dari shuttle.seats dan set posisi mereka dalam array ke null. Sekarang mari kita bicara tentang beberapa fitur tambahan yang dapat diterapkan di yang CS50 Shuttle p-set. Ada sistem poin dimana Anda melacak berapa banyak menunjukkan pengguna memiliki. Untuk mengantar penumpang berhasil, mereka bisa mendapatkan poin. Tapi untuk mencoba untuk menurunkan penumpang di mana tidak ada rumah pun di dekatnya, baik, mereka bisa mendapatkan sanksi untuk itu. Jadi mungkin Anda ingin melacak poin dalam variabel global. Anda dapat menerapkan mungkin timer, di mana pengguna memiliki sejumlah waktu untuk mengambil dan drop off sejumlah penumpang. Mungkin bahkan mengintegrasikan ini dengan sistem poin. Atau Anda dapat Mengedit Bagan sehingga penumpang diurutkan menurut rumah. Sehingga mungkin akan menjadi semacam sebuah berfungsi untuk shuttle.seats. Anda dapat menerapkan fitur terbang, di mana jika pengguna memasukan Konami kode, maka pesawat lift off tanah dan pesawat bisa terbang. Tapi untuk drop off yang aman, terbaik untuk membuat pesawat mendarat roda terhadap tanah pertama. Anda juga dapat menerapkan teleportasi, di mana Anda membuat daftar drop-down bangunan di index.html. Dan memilih salah satu dari mereka, yang pengguna akan diangkut ke bahwa bangunan di kampus. OK, meskipun, untuk melakukan perjalanan melalui dinding beberapa bangunan di jalan di sana. Anda juga dapat mengubah kecepatan shuttle, yang memungkinkan pengguna untuk meningkatkan atau mengurangi kecepatan. Mungkin Anda ingin variabel global untuk melacak berapa banyak bahan bakar shuttle memiliki, penurunan sebagai Anda pergi bersama. Setelah Anda mencapai nol, meskipun, pesawat ulang-alik tidak akan bisa bergerak kecuali jika Anda sudah mengisi bahan bakar, mungkin dengan menggunakan tombol, atau bahkan membuat pompa bensin Anda sendiri. Tapi itu pasti tidak daftar lengkap. Periksa spesifikasi untuk penuh daftar, atau mungkin mengusulkan Anda sendiri untuk TF Anda. Langit adalah batas. Ini adalah terakhir CS50 p-set Anda, sehingga bersenang-senang dengan itu. Ini adalah CS50 Shuttle. Saya harus mengatakan, itu menjadi kesenangan membuat ini untuk Anda dengan tim produksi. Dan saya berharap bahwa Anda telah menikmatinya, juga. Nama saya adalah Zamyla. Dan ini adalah CS50.