>> ZAMYLA Чан: Ну, вось мы, апошні р-мноствам ў CS50.
Павіншаваць сябе ад неабходнасці так далёка з моманту вашага першага Добры дзень
Міры і друк Уверх Піраміды для Марыё.
Вы зрабілі сайт на мінулым тыдні.
І мы збіраемся рабіць яшчэ адзін на гэтым тыдні, які дазваляе
ездзіць вакол кампуса Гарвардскага, выбіраючы да CS50 супрацоўнікаў і
вяртаючы іх да іх жылыя дамы.
>> Цяпер, на мінулым тыдні мы працавалі ў PHP, сервера мова бок.
Для гэтага р-мноства, мы становімся уведзены на JavaScript, які
мову на боку кліента.
Такім чынам, давайце зірнем на некаторыя з Код размеркавання, які прадастаўляецца
Вы для гэтага р-мноства.
У тэчцы JavaScript, там будзе быць куча файлаў JavaScript.
>> Там у buildings.js, які ўтрымлівае Масіў будынкаў вакол Гарвардзе
кампус з іх інфармацыяй і становішча.
Houses.js ўяўляе сабой масіў з Гарварда жылыя дамы з іх
шыраты і даўгаты.
Passengers.js ўтрымлівае масіў пасажыры, супрацоўнікі CS50
што вы будзеце вярнуць да іх жылых дамоў.
>> Math3D.js, што змяшчае шмат функцыі, каб зрабіць з рухам.
Калі вы матэматычна настроеных, то Я вітаю вас, каб зірнуць.
Але вы не павінны разумець ўсё там.
Shuttle.js, што мае справу з Рух шатла.
І index.html з'яўляецца хатняя старонка, дзе усё адбываецца, на самай справе, дзе
карыстальнік ўзаемадзейнічае з сайтам.
>> Service.css з'яўляецца ліст CSS стыль, якія ў дадатак да Twitter
Пачатковая загрузка Бібліятэка, элементы кіравання як index.html выглядае.
А потым у нас таксама ёсць service.js, якія ўтрымлівае сэрвісныя функцыі для
Трансфер.
І вось тое, дзе вы збіраецеся быць запоўніўшы некаторыя з да-рабіць,.
>> Зараз давайце зірнем на аб'ектах і асацыятыўныя масівы ў JavaScript,
якія, для ўсіх намераў і мэтаў, з'яўляюцца ўзаемазаменнымі.
Калі б я хацеў зрабіць аб'ект зменную называецца палачка, я б
аб'явім яго.
І ўнутры гэтых фігурных дужак, я б паказаць, ядро ​​аднарог, лес
вішнёвага, а даўжыня складае 13.
>> Зараз, я магу таксама доступ да значэнняў аб'ектаў з выкарыстаннем
асацыятыўная абазначэння масіва.
Так палачка Базавы індэкс, я магу ўсталяваць што роўна аднарог, або
праверыць, што калі мне трэба.
Ці я магу выкарыстоўваць аператар пункту wand.wood роўна вішня, і
гэтак далей і таму падобнае.
Такім чынам, вы бачыце, што асацыятыўныя масівы і аб'екты ў JavaScript будуць
ўзаемазаменныя, і воля прыйсці ў вельмі зручна.
>> Затым мы бачым масіў будынкаў у buildings.js,
зноў, масіў аб'ектаў.
Калі б я хацеў зрабіць масіў з лепшых будынка на Гарвардскага універсітэцкага гарадка, то
Я хацеў бы зрабіць гэта наступным чынам.
Выкарыстоўваючы гэтыя абазначэння аб'екта, дзе Я захоўваю каранёвай, імя, адрас,
шырата, і даўгата для кожнага адзін аб'ект будаўніцтва.
>> Давайце хутка казаць аб зменных у JavaScript.
Як PHP, JavaScript зменныя слаба або свабодна набралі.
Каб стварыць лакальную зменную, Вы папярэднічаючы імя зменнай з V-A-R, вар.
Зараз, у JavaScript, функцыі будуць абмежаваць вобласць бачнасці зменных.
Так што калі ў вас ёсць лакальная пераменная у функцыя, то іншыя функцыі
не можа атрымаць да яго доступ.
>> Але ў адрозненне ад C, завесы і ўмовы не абмежавання аб'ёму зменнай.
Так што нават калі вы аб'яўляеце яго ўнутры стан, уся функцыя будзе
мець доступ да яго.
Зараз, не вар, пераменная будзе насіць глабальны характар.
Так што калі вы проста абвясціць імя і прысвоіць значэнне, тое, што пераменная
будзе глабальная пераменная у JavaScript.
>> Зараз, у дамах, у нас ёсць асацыятыўную Масіў аб'ектаў тыпу хост, дзе
кожны дом знаходзіцца ўсяго ў шыраты і даўгата.
Тады ў нас ёсць пасажыраў масіў, які з'яўляецца масівам
тыпу аб'екта пасажыра.
Такім чынам, кожны пасажыр мае карыстальніка імя, імя, і дом.
>> Звярніце ўвагу, што я кажу тыпу Пасажыр, які на самай справе проста азначае,
што кожны аб'ект мае ж пар ключ-значэнне.
Такім чынам, кожны аб'ект тыпу пасажыра мае імя карыстальніка, імя, і дом.
Дык што ж нам трэба зрабіць для р-набору?
Ну, мы павінны дазволіць карыстальнікам выбіраць да супрацоўнікаў, каб паказаць усе
супрацоўнікі, якія ў цяперашні наш маршрутны аўтобус, і высадзіць іх.
І тады мы будзем таксама казаць аб дадатковых асаблівасці, якія могуць быць рэалізаваны для
Трансфер р-мноства.
>> Але давайце пагаворым пра пікапе ў першую чаргу.
Асобы CS50 персаналу была пасадзілі ва ўсім кампусе, дзе кожны
Твар рэалізаваны як месца маркі на 3D Зямлі, і ў якасці
маркер на 2D-карце.
Так што, калі карыстальнік націскае на Pickup Кнопка, мы хочам дадаць непадалёк
пасажыраў у маршрутным аўтобусе.
І мы таксама хочам, каб выдаліць іх месца пазначыць ад свету і выдаліць іх
Маркер з карты, паказваючы, што яны ў нашым трансферным аўтобусе цяпер.
>> Так як жа нам вызначыць, што пасажыры знаходзіцца ў зоне нашага чоўна?
Ну, функцыя адлегласці, так што shuttle.distance, перадаючы
шырыня і даўжыня, разлічыць адлегласць ад бягучай пазіцыі
чоўна да таго, што Вы вызначаеце з прыведзеных
шырыня і даўжыня.
Такім чынам, вы можаце выкарыстаць гэта для вылічэнні Адлегласць ад маршрутнага аўтобуса, каб
пасажыраў.
>> Але як вы ведаеце, дзе пасажыры?
Ну, вось дзе мы павінны будзем рэдагаваць функцыю запаўнення.
Запоўніце Places ўсё з супрацоўнікаў ў пасажыраў у свет
і ў карце, але не захоўваць іх размяшчэнне.
Так што, магчыма, вы можаце захоўваць іх размясціць знакі і маркеры
у некаторым глабальным масіве.
>> Цяпер ужо ёсць глабальны масіў захоўвання інфармацыі ад пасажыраў.
Пасажыры масіва крамы кожны Імя пасажыра, і іх дом.
Таму, магчыма, вы можаце дадаць некалькі параметраў там пасажырскіх аб'ектаў.
>> Каб дапамагчы нам выявіць усе пасажыры у спектр нашых
Трансфер, давайце цыкл па ўсіх пасажыры ў масіве пасажыраў.
Для завесы ў JavaScript можа выглядаць нешта накшталт гэтага, вельмі падобны на
тыя, для завес ў С. Ці мы можам выкарыстоўваць Альтэрнатыва для структуры завесы, для
вар я ў масіве, дзе я ўсё яшчэ будзе індэкс, але вы не павінны
пазначыць array.length стан, і я + +.
>> Размяшчэнне кожнага пасажыра складае даецца іх месцы пазнакі.
Але месца знак не шырыня і даўжыня.
У нас ёсць доступ да гэтых параметры, атрыманне геаметрыю, выкарыстоўваючы Пошук
геаметрыі на месцы знака, а затым як толькі мы маем геаметрыю, атрымліваючы
альбо шырата або даўгата з дапамогай гэтых функцый.
>> Так што цяпер мы ведаем, як выявіць ці пасажыры знаходзяцца ў межах
Асартымент нашага шатла.
Як толькі мы атрымаем тых пасажыраў, мы будзем хочаце дадаць любыя пасажыраў, якія
ў межах гэтага дыяпазону.
Мы хочам, каб дазволіць ім скакаць на і прыняць месца на нашым трансферным аўтобусе, але толькі
калі ў нас ёсць досыць месцы для іх.
>> Масіў shuttle.seats пакажа сядзенні, ці з'яўляюцца пустымі, або
хто ў гэтым крэсле.
Так што, калі месца пуста, то што месца будзе нулявы.
Так ітэрацыі па масіве месцаў, праверка на пустыя месцы, захоўвання
пасажыры ў гэтыя месцы, пакуль Вы няма ніякіх больш пустыя месцы.
І, на жаль, ніякіх іншых пасажыраў прыйдзецца чакаць
у наступны раз шатл ідзе ўніз.
>> Як толькі яны атрымаюць на шатле, мы хочам выдаліць іх месца знак, які
з'яўляецца іх фота ў 3D-свеце.
Калі б я хацеў, каб выдаліць месца Mark P, то я хацеў бы атрымаць усе функцыі,
ад майго Зямлі, ад Google Earth, , А затым выдаліць, што канкрэтнае месца
пазначыць з дапамогай функцыі RemoveChild.
Тады, нарэшце, давайце прыбярэм маркер, значок на 2D-карце, для любога
пасажыр, што мы ўстаюць.
>> Каб выдаліць маркер т, то я буду проста выканаць m.setMap нуль.
Рабіце гэта на працягу любых пасажыраў у межах дыяпазону, і вы скончылі пікап.
Функцыянальная схема павінна адлюстроўваць ўсе з пасажыраў, якія знаходзяцца ў вашым
Трансфер і вольнае месца, калі пустымі.
Так графік павінен перабраць shuttle.seats, адлюстравання
інфармацыя аб пасажырах для кожнага індэкса, і вольнае месца, калі, што індэкс з'яўляецца несапраўдным.
>> Цяпер, калі HTML тэкст змяшчаецца ўсярэдзіне JavaScript пераменная, то з дапамогай
document.getElementById, графік можа рэдагаваць ўнутраную HTML з, што дадзены
элемент, прызначыўшы HTML тэкст
document.getElementById ўнутраная зменная HTML.
Калі карыстальнікі націскаюць кнопку Drop Off у index.html, ён патэлефануе
Функцыя пакінеце машыну.
І гэта наша праца, каб ажыццявіць гэта.
>> У Dropoff, мы хочам, каб выдаліць любыя пасажыры з шатла, толькі калі
мы знаходзімся ў дыяпазоне іх прызначэння, іх жылы дом.
Так пакінеце машыну прыйдзецца праверыць, ці з'яўляецца трансфер у дыяпазоне любы з
дома, і выдаліце ​​ўсе неабходныя пасажыры з шатла.
Так як жа мы правяраем, калі мы ў дыяпазоне любых дамоў?
Ну, яшчэ раз, мы будзем выкарыстоўваць shuttle.distance функцыю, перадаючы ў
шырыня і даўжыня пункту што мы правяраем супраць.
>> Але тое, што гэта тыя кропкі?
Ну, масіў дома, калі вы памятаеце, у houses.js, захоўвае
шырыня і даўжыня кожнага дома ў асацыятыўны масіў, дзе кожны
індэкс імя гэтага дома.
Тады, каб выдаліць пасажыраў -
ну, толькі калі мы знаходзімся ў дыяпазоне іх Дом, які яны хочуць пайсці.
Такім чынам, яшчэ раз, памятаеце, што пасажыры захоўвае дом, што кожны пасажыр
хоча пайсці ў.
Калі яны знаходзяцца ў межах дыяпазону іх дом, то мы будзем вымушаныя выдаліць, што
пасажыр ад shuttle.seats і набору іх становішча ў масіве да нуля.
>> Зараз давайце пагаворым аб некаторых дадатковых функцый , Якія могуць быць рэалізаваны ў
CS50 Трансфер р-мноства.
Там у бальнай сістэме ў выніку чаго вам адсочваць, колькі
паказвае карыстальнік мае.
Для высаджваючы пасажыраў паспяхова, яны могуць атрымаць ачкі.
Але за тое, каб высадзіць пасажыраў дзе няма ніякага дома паблізу,
добра, яны могуць атрымаць пакаранне за гэта.
Так што, магчыма, вы хочаце, каб адсочваць кропкі ў глабальнай зменнай.
>> Вы можаце рэалізаваць, магчыма, таймер, дзе карыстальнік мае пэўную колькасць
час, каб забраць і сыходзяць а, пэўную колькасць пасажыраў.
Можа быць, нават інтэграваць гэта з сістэмай кропкі.
Ці вы можаце рэдагаваць дыяграмы такім чынам, каб пасажыры сартуюцца па хаце.
Так што, верагодна, будзе свайго роду функцыянаваць у shuttle.seats.
>> Вы можаце рэалізаваць лятаючую функцыю, дзе, калі карыстальнік ўводзіць Konami
Код, то трансфер ўзлятае зямля і трансфер можа лятаць.
Але для бяспечнай высадкі, усё магчымае, каб Трансфер прызямліцца свае колы на
зямлю ў першую чаргу.
Вы таксама можаце ажыццявіць тэлепартацыю, дзе вы зрабіць выпадальны спіс
будынка ў index.html.
І выбраўшы адзін з тых,, Карыстальнік будзе транспартавацца ў
што будаўніцтва на тэрыторыі кампуса.
У парадку, хоць, падарожнічаць па сцены некаторыя
будынка па дарозе туды.
>> Вы таксама можаце змяніць хуткасць Трансфер, што дазваляе карыстальніку, каб павялічыць
або паменшыць хуткасць.
Магчыма, вы хочаце глабальную зменную ў адсочваць, колькі паліва
Трансфер мае, памяншаючы гэта, як вы ідзяце наперад.
Калі вы дабярэцеся да нуля, хоць, трансфер не зможа рухацца, калі вы не маеце
запраўляцца, магчыма, з дапамогай кнопкі або нават зрабіць свой уласны АЗС.
>> Але гэта, вядома, не вычарпальны спіс.
Праверце спецыфікацыю для поўнага спіс, або, магчыма, прапанаваць
самастойна на свой TF.
Неба гэта мяжа.
Гэта твой апошні CS50 р-набор, так весела з ім.
Гэта было CS50 Трансфер.
>> Я павінен сказаць, гэта было вельмі прыемна што робіць гэта для вас з
здымачная група.
І я спадзяюся, што вы атрымліваць асалоду ад імі, а таксама.
Мяне клічуць Zamyla.
І гэта было CS50.