[За възпроизвеждане на музика] DAVID Malan: Това е CS50. Това е началото на седмица девет. И това е, което ще има била 200 години от рождението на г-н Бул е. Така че това е стипендиантите на когото сме намекнато немалки пъти за използването Булеви променливи верни и неверни, 1 и 0 и такива. И това е на Google почит към него днес. Той щеше да навърши 200. Така че, ако искате да присъединете се към нас за CS50 обяд, да разгледаме връзката на интернет страницата на курса. И такива лица и приятели като те ви очакват тук, в Кеймбридж. Faces като тези, очакваме ви в Ню Хейвън. И, всъщност, Ken в New Haven любезно направи което се нарича анимиран GIF на Eli тук, в скорошно lunch-- на GIF е още друг графичен файлов формат, с които сте familiar-- че изглежда малко нещо като това. Така че просто последователност of-- OK. Тук никой не се смее в Кеймбридж. Но в New Haven, този е наистина смешно, нали? Всичко е наред. И така, да се присъединят към нас там. Тук в Харвард, специално, тази сряда, ако сте второкурсник или първокурсник even-- или дори junior-- мислене на вземане превключвател в компютъра науката, ще знаете, че има бъдат по-CS съветва справедлива тази Сряда, малко след клас в 16:00 в компютъра науката сграда Maxwell Дворкин. Ние ще постави този на курса уебсайт, като утре, както добре. Donuts, аз съм казал, ще бъдат обслужвани. Всичко е наред. Така смешно story-- бях изпълзяват около в интернет, и открих някои стари архиви на бившия моя сайт. И се оказва out-- около това времето, изглежда много навременна тъй като аз се съберат, че изборите UC са на път да ускори темпото отново. Така че аз се кандидатира за UC, загуби безславно. И може би това е отчасти защо. Така че това беше моя сайт в момента. По някаква причина, аз помислих, че е Добра идея, преди да казвам на хората това, което ми платформа е и защо те трябва да гласуват за мен, че те имат да кликнете, за да влезете, за да разберете, че информация, която е в ретроспекция вид страховито. Аз наистина не знам какво е това. Но това със сигурност не е направил помогне на кампанията ми. Аз също така, че от страна на старшия year-- имах този Muppet календар. Muppets са вид на мода тогава. Или може би те не са били. Имах Muppet календар тогава. А аз си мислех, че ще бъде готино да име моя компютър в мрежата на Харвард frogman.student.harvard.edu. По това време всички ние трябваше еднозначно разпознаваеми имена на хостове. И вие може да изберете някаква суета назове вместо собственото си име. И аз отидох с леководолаз по някаква причина. И тогава аз started-- Прекарах много от време с кликване тези връзки тази сутрин. И това беше моят около страница, които сега вид изглежда очарователни. Но той също така свидетелства за просто колко далеч технология е дошъл. Искам да кажа, назад в деня, 486 беше нещо. Тези дни, това е супер, супер, супер бавен и добре по-малко отколкото може да има във вашия собствените си джобове тези дни. Има и още там, че е още по-неудобно. Така че аз ще го оставите в това. Но това беше първият ми набег в web-- о, не. Това не е така. Първата ми реална набег в уеб програмиране е този сайт, който аз просто забравих. В един момент, аз научих как да правят повтарящи фонови изображения. И така, аз намерих тази облицовка ефективно, като хокеист, футбол, голф и топка, или каквото и да е за сайта на Фрош УИ. И това е всъщност, наистина на Първият уеб-базиран проект взех on-- Мисля, че може би второкурсник година, младши year-- след като CS50 и CS51, една на общите последващи по класовете. Забелязах в търсенето чрез архивите че един от моите наследници и приятели, Lee, вид променени авторското право на себе си. Но в действителност това е нещо, което Аз трябва да притежавате срам да. Но в момента, това беше първия сайт, както казах преди няколко седмици, чрез която първокурсник би могъл регистрирай се интрамурални спортове тук. И така се оказва, че фонови изображения като това не е толкова добра идея. Но в интернет е нова, и всички ние експериментирахме. И това е, което аз очевидно е направил по това време. Всичко е наред. Така че, без повече приказки, ние превключите зъбни колела днес, за да ви дам, наистина, последната част, която може да откриете особено полезен за крайните проекти но също така, че ще започне да направи целия World Wide Web се чувствам малко по-разбираеми. Наистина, ние ще представим повече от един език за програмиране наречено JavaScript, че е сходна и различни по различни начини от езици като видяхме досега. Така C, изземване, е този компилиран език. Ти трябва да го стартирате чрез компилатор. Можете да получите изходния код на възражение код, или нули и единици. И тези, които са нули и единици, които вашия процесор, Централен процесор, всъщност разбирам. PHP, за разлика от това, не е компилиран език. Това е какво? Това е интерпретиран език. Така че има някаква програма наречен преводач, че трябва да прочете it-- отгоре надолу, отляво right-- и да разбера какво всички Вашата синтаксис прави и означава, независимо дали това е една линия, или състояние или друг номер на програмиране конструкции. Така че това е интерпретиран език. Тогава ние въведохме HTML. И HTML не е дори по- език за програмиране. Ние ще го наричаме това, което? A език за маркиране, което е просто нещо като луксозен начин на казвайки го не разполага с програмни конструкции като видяхме дори назад в деня на Scratch. Не са открити контури. Не са открити условия. Това наистина е език за маркиране на вашите данни и да го форматирате или структурирането му по някакъв начин. CSS, междувременно, по подобен начин Не един език за програмиране. Това е още по-естетично ориентирани. И тя ви позволява да сортирате на фина настройка неща като размера на шрифта и цветове и настаняването и всичко това. Тогава имахме SQL. Така че SQL е наистина програмиране език в някакъв смисъл, макар и съобразени специално до бази данни. Но въпреки че ние само да ви запозная с изберете и поставете и изтриване и актуализиране и няколко други, Оказва се, всъщност можете да напиши функции или процедури, както те са нарича, в SQL, че изглежда и работи съвсем като PHP и C функции. Така че знаем, че тези, които съществуват. Но ние дори не се занимавам с тях тъй като ние просто надраскате повърхността тук. И тогава JavaScript, последният от формално въведени нашите езици. Така че JavaScript, също е интерпретиран език. И тези, запознати, направете Искате ли да го направи разграничение с някои характеристика от двете С и PHP? Какво го прави по-различни? АУДИТОРИЯ: Това не е компилиран. DAVID Malan: Кажете отново? АУДИТОРИЯ: Това не е компилиран. DAVID Malan: Това не е компилиран. Така че тя също се интерпретира. Така че това не е компилиран. Но това, че е малко като PHP прави. Но тя все още е различно от PHP в някои поразителен начин, най-малко в начина, по който ще го използва. Да? АУДИТОРИЯ: Тя работи от страна на клиента. DAVID Malan: Тя работи от страна на клиента, обикновено. Това е наистина разграничаването характерен за нас в момента. C е от страна на сървъра, в смисъл, че ние направихме всичко по CS50 IDE. PHP досега е от страна на сървъра, доколкото както също получава interpreted-- не компилира, но interpreted-- вътре CS50 IDE, което разбира се е само на сървър или сървъри в облака. Но JavaScript, дори макар че ти започваш да започне да я пиша за, да речем, pset осем и може би окончателно projects-- сте Ще го в полето CS50 IDE и да го запишете в рамките файлове CS50 IDE, CS50 IDE и на свой ред, облачни сървъри на която той е домакин, не се случва да тълкува или да изпълнят своя код. По-скоро, че ще ходи да бъде изпратен в дословно надолу към браузъра. И това е след това ще бъде IE или Chrome или Firefox или Safari или каквото и които всъщност интерпретира го, горе до долу, от ляво на дясно. Така че ключовият разграничаването характерен за днес е, че JavaScript е от страна на клиента и PHP, например, е било от страна на сървъра. Сега, това има интересни последици за, като, интелектуална собственост и кой всъщност може да видите вашия код. И наистина, можете да отидете в интернет и да видим най- всеки код, който някой трябва написан на JavaScript. Понякога е по-четим, Понякога е по-завоалира. Но повече за това в срок. Така че JavaScript, достатъчно добре, е супер подобна, синтактично, да C. И много като PHP, че няма основна функция. Ако искате да започнете да пишете JavaScript код, както ще видите днес, можете просто да започнете да я пиша. Но това е, вие ще видите, особено полезен в контекста на браузъри. Въпреки това, моето малко disclaimer-- обикновено earlier-- е да се каже, че това е възможно все употреба днес JavaScript от страна на сървъра използване на фантазия рамка, наречена Node.js че някои от собствени приложения на CS50 са написани инча Проверете 50 действително използва Node.js. Но ние ще се съсредоточи върху JavaScript от страна на клиента сега нататък. Така че тук е набор от условия в PHP. Съжаляваме, in-- всъщност, че декларация, също е вярна. Тук е и набор от условия в JavaScript. Синтактически, че е идентичен С и към PHP. Изрази г-н Бул са, по подобен начин, синтактично идентичен на двете С и PHP. Ние също имаме превключватели JavaScript, които изглеждат идентични. Ние имаме за електрически вериги, които са структуриран по същия начин, докато примки, докато правите линии. Това е една малко по-различна. PHP е имал за всеки конструкт че може да сте с помощта на или ще се използва в pset седем, може би. JavaScript е тази специална версия на за където можете буквално да кажа нещо като за променлив ключ в обект, който е много кратък и ясен начин да се каже, ако аз имам една object-- и ние ще говорим за това отново в moment-- и аз искам да обхождане всички от ключовите двойки стойност вътре, Аз не трябва да разбера как да се числено индекс тях с нула, едно, две, три. Мога да кажа, че това буквално. И на всяка итерация, JavaScript за мен ще актуализира ключът променлива да бъде първият, след това следващата ключ, след това на следващия, след това следващата ключ, и т.н. И мога да получа най стойността си с лечение обект в JavaScript, както ще видим, като че ли това е асоциативен масив в PHP. Действително, ако най-накрая увити си интересуваме около това, което е асоциативен масив в PHP, можете да мислите за него като за сега идентичен обект в JavaScript. Но това е малко прекалено опростяване. Масивите изглеждат достатъчно добре, идентична да прави PHP с изключение на един символ. Има едно нещо липсва тук че ние направихме виж миналата седмица с PHP. Какво е пропуснато? Да? Не знак за долар. Така че ние сме назад към по-нормален свят, където променливи не са долара знаци. Но нали ги префикс с Var, обикновено. И Var означава променлива. И много като PHP е хлабаво typed-- при която има видове, има номера и струнни и плавници и така forth-- JavaScript подобен начин има видове. Но това е хлабаво написа, че сме на програмисти не се налага да ги посочите. Ние просто трябва да сме наясно че съществуват различни видове. Променливи, meanwhile-- ето как ние може да обяви "Здравей, свят" като низ. Забележете, че е идентичен PHP, но не знак за долар. И това е нещо, което ще започнете да виждате по-днес, с което имате обект с ключове и стойности. А ако искате да опитате да се направи извод от миналата week-- синтаксиса е малко по-различна. Но малко здрав разум check-- колко ключове се този обект изглежда да има? Така че аз виждам четирима. Виждам две. Така че това е всъщност две. Така че това е колекция на две двойки ключ-стойност. Ключът е символ, чиято стойност е FB. Ключът е цената, чиято стойност е 101.53. Така че тези, които са две двойки ключ-стойност. И не забравяйте, PHP-- и това е отново просто някак синтактична разлика. Това не е всичко, което интелектуално интересно. PHP може да е написал тази същата нещо като follows-- цитат, е равен. И аз ги промените да квадратни скоби. И тогава аз се промени това, за да котирана дума, "цена". И тогава аз не използвайте двоеточие. Какво да използвам миналата седмица? Да, знака за равенство стрелка фънки нотация. И след това, което направих същото нещо тук. Същото е и тук. И това е всичко. Така че е добре, ако това не е Наистина потънал в с памет точно Все още, защото това е наистина интелектуално безинтересно. Това е просто синтактични различия. Но идеите са абсолютно същите. Вътре на тази променлива котировки на JavaScript е колекция от двойки ключ-стойност, един от които е символ, една от които е цената. И мога да получа най тези ценности със следния синтаксис. Точно като в PHP, можех направя нещо like-- нека ме направи това поле малко по-голям. Точно като в PHP, можех направи this-- О, по дяволите. Хайде. Точно като в PHP-- OK, ние ще просто използвайте презентатора бележки. Точно като в PHP, което мога направя цитат ["символ"] $ цитат $, и това ще ме вземе Стойността на "символ". В JavaScript, това ще бъде идентични, с което мога просто да направите това. Единственото нещо, което е липсва, е знака за долар. Така че достатъчно добре, а след това, има Не всички, че много нов синтаксис. Така че това, което днес ние се фокусираме върху, наистина, е някои от идеите и заявленията. И първият такъв приложение, което може да се съм виждал, ако се хвърли в pset седем вече е този синтаксис. Така че в pset седем, ако сте виждал или не го видели още, знам, че има един файл, който ние даваме сте се обадили config.json-- JavaScript Object Notation. Защо? Искахме да бъде в състояние да ви предостави шаблон с някои двойки ключ-стойност. Искахме да бъде в състояние да ви даде списък на приемащата, името на сървъра. Искахме да ви даде по- контейнер за вашето потребителско име и контейнер за парола. Ако не виждате това все пак, да не се притеснява. Повече за това в pset седем [? спец. ?] И тогава, Очевидно, ние искате да попълните до-DOS защото, когато влезете в CS50 IDE, всеки от вас имате собствен потребителско име и парола. Така че ние можеше да използва половин дузина или повече различни файлови формати. Можехме да използва .txt файл. Бихме могли да се използва файл CSV. Бихме могли да съм използвал INI файл, един XML файл, цял куп повече съкращения, които може да не сте ли чували. Това е вид на произволна в края на деня. Но супер популярна в наши дни е текст формат, наречен JSON-- JavaScript Object Notation--, който изглежда така. Това е малко загадъчен, но забележете моделите. Започвате с отворен къдрава презрамки, и ти свърши с една и съща. Вътре на това е нещо. Това е двойка с ключ-стойност. Така че това е един обект, който съм гледаш на екрана тук че има един ключ, който има една стойност. И точно извод въз основа на на предишния модел, което е ключът тук? База данни, за нещо, което да от ляво на дебелото черво. Сега, стойността се случва да бъде на няколко реда и този път. Но стойността започва с къдрава подпре и завършва с фигурна скоба. И така, какво бихте предложили е тип на стойността на база данни? A речника или, по-точно накратко, един обект. Нали така? Това е вид структурата на данните, които да използвате други структури в себе си. Така че, ако цялото това нещо, че сме наричайки object-- и обект е просто един куп ключ-стойност pairs-- на стойност на самата база данни е обект. Стойността на база данни има цял куп на двойки ключови стойности, първата от които е домакин, след това име, а след това потребителско име, парола тогава, всеки един от чиито ценности, междувременно, това е Просто един скучен низ в двойни кавички. Така че, дори ако това не е супер ясно, просто все още, Знам, че това е само една стандарт, доста скучен начин за съхраняване на данни в стандартен формат. Но най-често срещаните грешки, които може да се направи, дори и в pset седем, са малки глупави неща, като, ако случайно пропуснете запетаята там. Това ще доведе до файла не е задължително да е четлив. Ако случайно пропуснете неща като котировки, тя няма да може да се чете. Така че това е файлов формат доста nitpicky, но това е един, това е супер общ. И ние се случи да го използвам, въпреки че не използвате някоя JavaScript друго, в pset седем. Всичко е наред. Така че не забравяйте тази снимка. Ние говорихме за, в HTML, че кодът може да изглежда така. Това е HyperText Markup Language [Недоловим] само на "здравей, свят". Но тогава предложихме малко назад, че ако това помага, може да искате да започнем да мислим за това вече като дърво. В действителност, че вдлъбнатината използвате само заради четивността на или заради върху стила си ляво може вид да се преведе на това дърво, където можете има някаква специална корен възел, който ние ще общо наречена документ, под който е основната HTML елемент или тагове, HTML, които след това има две деца, главата и тялото. И след това на свой ред, глава има заглавие. И заглавието има текст стойност. И тялото по същия начин има текст стойност. Така че, ако сте доволни поговорка че да, бихте могли да се възползвам от тази HTML и да се направи снимка като това, дясната ръка е хубаво мисловен модел, защото сега че имаме JavaScript, за програмиране език, който може браузъри изпълнява и интерпретира за вас, Оказва се, че това, което ние сме на път да направим в кода се започне да манипулира това дърво структура в паметта. Ние не трябва да се изгради дървото в паметта. Ние не трябва да направите нещо структура на данните pset петте стил сложност. Браузърът, достатъчно добре, при тълкуването HTML горе до долу, наляво или надясно, е буквално ще ни предаде равностойността на показалеца да, че цялото дърво безплатно. Той прави всичко на упорита работа. Това е, което Mozilla и Apple и другите са направили за нас. И с JavaScript отиваме да да бъде в състояние да контролира и да промените и да направим интересни неща за това дърво, иначе известен като DOM или Document Object Model. Какви видове неща? Е, оказва се, че в JavaScript, има този пране списък на събития, които могат да се осъществяват. И ние наистина не са използвани, че Думата след седмица нула и pset нула, когато говорихме за Scratch. Повечето от вас вероятно не се е възползвал събитие във вашия Scratch проект. Но може да се припомни, простата Марко Поло Например, когато имахме две спрайтове, един от които казаха, Marco. Другият от които след това, при слушане и слуха, че събитието, заяви, Polo. Ако не, не се колебайте да погледнем назад, че далеч назад. Но това е само за да казват, и ще можете да вид заключим от имената на тези неща, JavaScript, оказва се, ще ни даде начин да слушате за мишка захождането или мишка качвах или ключова захождането или ключ качвах или onsubmit onselect или onresizing нещо. С други думи, всяко физическо действие че човек може да вземе с браузър , което правите всеки ден, можете да напишете код за който се вслушва за тези събития и след това прави нещо подходящо. Например, ако използвате Google Maps, какво се случва, ако кликнете и ход мишката, обикновено? Ако кликнете и плъзнете? Да? Точно. Картата започва да се движи. Така че можете да някак видите какво е тук, какво е там. И как Google приложи това? Е, най-вероятно, те са с помощта на няколко от тях събитие слушателите, че един казва, вслушайте на мишката down-- така, когато потребителят физически избутва си тракпад или неговия мишка надолу. И след това, което търсим нещо като движение или някакъв друг случай, че ни позволява да улови драг. И всъщност, драг е по подобен начин в тази дот Дот дот списък с възможни опции. Така че това ще се превърне в мощен начин да започне в отговор на потребителя дори преди той или тя кликва нещо изрична като представи. Но ние ще представим няколко теми, за да стигнем до там. Преход Но първо, нека до известна действителната код. Така че аз ще отида напред и да се отворят дом-0, което е много прост пример тук, че ако аз просто я увеличите има този вход тук за мен. И аз ще отида напред и да напишете в "Давид" за моето име и кликнете върху Изпращане. И след това, макар и някак по-евтино, I получите този промпт, който се появи, която казва, "Здравей, Дейвид!" Така че това е един вид като нашия "Здравей, свят" че сме направили известно време назад в C и дори и в PHP, защото съм динамично изведен моето име. Мога да направя име на някой друг тук. Мога просто да промените това да, харесват, Хана, кликнете върху Изпращане. И наистина, малки изскачащи промени. Сега, изскачащи прозорци са един от повечето малтретирани характеристики на интернет. И в действителност, обратно в на ден блокиране на изскачащите прозорци излезе на мода, защото вие ще отида до известна website-- може би от спорна place-- че би след това изведнъж започнете peppering вашия екран с цял куп от изскачащи прозорци. И така, тази способност да се появи прозорци в предната част на потребителя не е бил особено добре приет от човечеството. Така че това е защо сте въвели това се предотврати нещо, които просто прави цялото това нещо грозно. Така че ние ще се нуждаем от добър начин да се напомни на потребителя. Но за сега, че изглежда да работи. Така че просто интуитивно, това, което изглежда се случва тук? Аз отивам напред и кликнете върху Изпращане, и След това нещо се случва, ясно. Но това, което не се случва, че се е случило миналата седмица всяко време щракнах Пуснете? Какво не се случи на екрана? Съжаляваме? Презареди. URL адресът не се променя изобщо. Казах това е дом-0, и аз съм все още на дом-0. Обикновено, ние ще се промени на някой друг URL, като register.php или други подобни. Но дори и когато аз се отхвърли това нещо като кликнете OK, забележите, че URL остава напълно сложи. И, всъщност, ако съм малко скептичен, позволете ми да се отворят Chrome. Позволете ми да се отворят раздела Network. И забележи, че е празна в момента. Нека да вървим напред и да представи отново Maria. Няма никакъв мрежов трафик, каквато. Така че няма HTTP. Така че наистина, ако аз гледам на изходния код за this-- да ме затворите този прозорец и отидете на View Source. Интересно. Тя изглежда като има някои нови тагове, сред тях сценарий. Така че нека да погледнем в рамките CS50 IDE точно това, което изпраща до потребителя. Така че тук is-- нека фокусира върху само HTML. Ето долната половина на дом-0.html. И забележи, че тя има заглавие, глава маркер, маркер тялото, форма маркер. Но това, което скача на вас като различно, особено ако никога не сте писмено всяка JavaScript себе си. Позволете ми да превъртите малко надясно тук. Имам един вход, друг вход, за да представи. Имам ID, което е един вид ново. Но ние го видите това с CSS. Какво друго определено е ново? Да? Ница. Всичко е наред. Така че, където се казва onsubmit, забележите това, което изглежда да се следват. Това е атрибут в HTML номенклатура. Неговата стойност е тази, цитиран низ тук. И това изглежда малко странно на пръв поглед. Това не е HTML. Това не е CSS. Това е, както можете да се досетите, JavaScript. Така че изглежда, че вградена в този уеб страница е функция, наречена поздрави. И аз съм извод, че просто защото това е една дума, поздрави. Той има една отворена скоба, близки скоба, точка и запетая. Прилича на функция C, прилича на функцията PHP. И наистина, това ще да бъде функция на JavaScript. Тогава аз съм връщане фалшиви. Ще се върнем към че в един момент. Но там, където се определя тази функция? Ами нека да превъртите нагоре в началото на файла. И въпреки, че това е една дълга линия, това е относително лесно. Позволете ми да отдалечите тук и съсредоточи върху тези четири линии. Така че в JavaScript, просто като PHP, просто да речем, буквално, думата "функция" името на функцията, и след това скоби с всеки arguments-- без аргументи в този случай. И няма връщане тип в JavaScript, точно като PHP. Така че това е малко по-свободна, отколкото C. Open фигурна скоба, близо фигурна скоба. Построен в JavaScript е function-- не е препоръчително function-- а функция, наречена сигнал чиято единствена цел в живота е да се спра, че доста грозно подкани, че видяхме преди малко. Сега това е вид хапка. Какво става тук? Така че нека да започнем да маркирайте всичко тук. Това е същия аргумент, за да предупреди. И какво се случва? Това просто изглежда като низ. И се оказва, за разлика от PHP и за разлика от C, това няма значение в JavaScript ако вие единични кавички или двойни кавички. Те ще бъдат равностойни. И честно казано, това е просто популярна в наши дни за програмисти JavaScript винаги да използвайте единични кавички по някаква причина. Това е просто нещо да направя. Но бихме могли да използваме двойни кавички, както добре. Така плюс е нов герой. Но онези от вас, които съм направил това преди, какво прави плюс означава? Да. Свързвам. Така че ние видяхме това в PHP. Има само точката оператор в PHP, че ще се слеят две струни заедно. C е болка в областта на шията, за да направите това. Спомнете си от pset шест, което е една особена болка в областта на шията, вие ще трябва да използвате нещо като strcat След разпределяне на паметта на стека или купчината. Вие трябваше да скочи през обръчите само за да се слеят две струни. В JavaScript, това е супер просто. Просто използвайте оператора на плюс между тях. Така комплексът изглеждащи нещо изглежда да е това защото в края на Цялата тази струна, аз просто свързвам с удивителен знак. Така че, ако това, което се пръкват се "Здравей, Дейвид", "Здравей, Хана," "Здравей, Мария", и така нататък, ясно че нещо по средата между двете плюсове трябва да ми даде достъп до какво? Какво е там със сигурност? Да. Така че аз ще се преструваме тук отговори на името си, нали? Така че името им показа на финала резултат. И така, какво означава това? Е, аз предложих по-рано в тази картина, която така наречените DOM има този специален корен елемент път до върха, наречен документ. И сега, оказва се, че това ще за специална глобална променлива в JavaScript, вградена в което е куп полезна функционалност. Сред полезна функционалност е способността да се получи по всяко потомък възел. Тези квадратна или правоъгълна форма или елипси са само възли в едно дърво, така да се каже. Така се оказва, че вградена в Документ, обект на JavaScript е функция, известен като метод, който се нарича getElementById. Синтаксисът за свикване функция в JavaScript която е вътре на даден обект или променлива е само с нотация дот. И видяхме това в C какво синтаксис структура на. Вие виждате тази в pset седем, вид, нещо, когато видите CS50 :: заявка. Дебелото черво на дебелото черво в PHP е друг начин за извикване на функция, която е вътрешността на някакъв предмет. Но за сега в JavaScript, това е само една точка. И така, тази функция, достатъчно добре, вид казва какво does-- получите елемент от ID. Един елемент е просто друго име за тагове или възел в DOM. И така се получи елемент от ID "име" означава this-- тук ми е HTML. И на тази основа HTML, което възел или какво HTML тагове съм Ще бъде програмно ръка като се обадите document.getElementById? Да, точно така. Отивам да получите на входа елемент има чието ID е "име." Така че специално, можете да мисля, че на тази функция, getElementById, като начин за даване резервно указател към този специфичен възел в дървото. Ние не са изготвили настоящия дърво, но това е начин за получаване на достъп до тази правоъгълник или че правоъгълник от уникално го идентифицира чрез неговия ID. Сега, защо е полезно това? Е, оказва се, че след като съм намерила този възел, че правоъгълник от снимка, този възел вътре в него, от своя страна, има цял куп properties-- двойки ключ-стойност или данни, единият от които се нарича стойност. Така буквално, това е един вид хапка, за да обясни всичко. Но в края на деня, всичко това прави, е да ви даде низ, че потребителят въвели в в този йерархичен начин. Но аз не харесвам Няколко от тези неща. Или по-скоро, има някои любопитство все още. Всичко това изглежда да работят. Защо мислите, че се върнах невярна след извикването поздравят? Това изглежда малко грозно, че Имам две твърдения има разделени с точка и запетая. Познай. Ако аз се отстраняват върне фалшиви, това, което може да се случи, просто инстинктивно? Съжаляваме, повтарям? Отворете един куп Windows. Така че може би нещо потенциално като това ще се случи. Какво друго? Може да подадат искане къде? За една и съща страница. Така че, в действителност, това е, че колкото по-близо се отговори тук, въпреки че за разлика в миналото, не съм посочено признака действие, които обикновено трябва да направим. Оказва се, че там е по подразбиране. Ако не посочите действия, това е като да кажеш, цитирам, край на цитата или името на самия файл, което в този случай би бъде като дом-0.html. Това е просто вид заключи, или по-скоро мълчалив. И така, ако не направим това, нека да забележите. Позволете ми да запазите този. И аз съм отстранен връщане фалшиви. Нека да се върнем към тази пример и сила да го презареди. И може да си видял да ми предложи тази на CS50 Обсъдете куп пъти. Ако нещо някога е действащ и фънки браузър не е поведение, колкото очаквате, много пъти вие ще искате да задържите Shift и щракнете върху Reload. Това ще принуди всеки файл, за да презареди и не се използва местна кеша на браузъра или копие, така че сега, нека да вървим напред и да отвори ми инспектор, раздела Network. Отивам да кликнете Съхрани Log, защото аз не искам да го да изтриете редовете след като аз се набързо другаде. Позволете ми давай тук и Тип на Andi, кликнете върху Изпращане. Всичко е наред. Това изглежда както се очаква. Той казва "здравей, Andi." Позволете ми да кликнете OK. Интересно. Забележете, че страницата се промени, макар и в оригиналната страница. Обърнете внимание на URL вида на променената. Той добави въпросителен знак, което обикновено е индикатор че сме се опитали да представят нещо. И след това в долната част, още по-ясно, тук е действително искането HTTP, които получих отговор от 200, че ме върна тук. Така че това не е това, което което искаме да направим, нали? Защото аз не искам да се презарежда цялата страница. Аз вместо да иска да се върне невярно, така че да късо съединение поведението по подразбиране на браузъра, който беше, разбира се, да представи на страницата. Така че нека да разгледаме по- незначително по-добър пример. Това е дом версия една. И забележете следното. Това е ОК, ако не гроквам всички линии на код. Но това, което е коренно различна за това изпълнение? Ще се предвиди тя се държи на същата, прави същото нещо. Какво съм очевидно прави по различен начин? Да? АУДИТОРИЯ: [недоловим]. DAVID Malan: Да. Така че функцията е дефинирана differently-- С други думи, отсъстват от формата, там по линия 7-- или по-скоро, линия 8-- вече не направя Имам onsubmit атрибут. В предишния пример, имах това. И тогава аз буквално пише кода ми тук. И тогава аз казах върне фалшиви. И ако това не търкайте все още по грешен начин, тя трябва да започне да дотолкова като, точно като в HTML, когато започнахме да го сътрудничат размесят с CSS атрибути в стил, той просто започна да се получи малко разхвърлян или се чувстват малко погрешно. По същия начин тук, ако да започнете да приемате HTML, и след това вие автоматично цоп някои JavaScript код в средата на котирана низ, това е не ще бъде много за поддържане. Нали така? Тя дори не е очевидно на пръв сложите там, където кодът на JavaScript е. Така че би било много хубаво като принцип на по-добър дизайн, нека да запазим HTML напълно отдели от нашия JavaScript. Така че, за да направи това, което сме направено тук е following-- ние просто използваме HTML само за маркиране. И така във версия едно от това, всичко, Имам е форма с уникален идентификатор. И след това тук, аз съм като се възползва на специална функция на JavaScript с което мога да имам това, което е нарича анонимен функция. Така се оказва, че ако аз наричам document.getElementById на "демо" това е все едно, че ми даде указател към този възел в дървото ми, форма елемент, така да се каже. Сега, аз просто знам от знаейки малко на HTML Сега ние сме като прочетох някои онлайн позоваване, че форма елемент подкрепя цял куп положения listeners-- в С други думи, пране списък на събитие слушателите, които видяхме преди малко. Знам, че от четене на документацията че onsubmit е валиден събитие слушател за формуляр елемент. Така че след като знам, че, че е безопасно за мен да направя на following-- получите този възел от дървото, форма елемент, и получете достъп до така наречената onsubmit собственост. Така че точката просто означава, това е един имот, като особена стойност вътре в него. И това, което аз съм тип данни възлагане, както изглежда, да onsubmit, което е ефективно променлива вътре на този възел в дървото? Това е област, в рамките на тази структура на. Какъв е типът на данните? A функция, да. Така се оказва, че PHP е това. И въпреки, че ние не ви кажа за него, C също има функция указатели, на способност да се премине и възлага функциите като самите стойности променливи. И ние няма към регрес обратно към C. Но за сега, се оказва, че от дясната ръка тук, макар и да изглежда малко фънки, това означава, хей браузър, дайте ми функция. Аз няма да се притеснява дори да даде това име, защото аз съм буквално Ще назначите нека го наречем адреса на тази функция незабавно да onsubmit. С други думи, браузър, не е нужно да знам какво тази функция се нарича. Ти просто трябва да знаете когато е в паметта. И така, достатъчно е само да се има знак за равенство там и да не се притеснява за именуване това, като Foo или поздравят или друга дума. И сега това е просто нещо, стилистични. Аз можех да се движа този фигурна скоба върху the-- sorry-- следващия ред като правим обикновено CS50. Но в JavaScript, това е всъщност стилистично обща просто да се запази фигурна скоба, за първо една, от които на първа линия. Но по-нататък, има нищо интересно. Това отворена фигурна скоба просто разграничава началото на моята функция. Функцията вече е идентични, с изключение Нямам включени в замяна фалшивото вътрешността на тази функция. Защото се оказва out-- само и бихте Знам това от четене на documentation-- че ако функцията, която присвоява до onsubmit манипулатор връща невярна, браузъра просто знае и е съгласен да не се представя под формата на сървър. Ако тя се връща истина, това ще внесе тя към сървър по причини ще видим са полезни само за миг. И тогава, след запетаята на фигурна скоба там просто означава свърша дефиниране на функцията. Знаеш ли какво да се обади веднага като чуете подаване. Всичко е наред. Това все още е спорно вид грозно. И така, какво повече можем да направим? Е, оказва се, след това в два версия, която е last-- и ние просто ще погледне това. В риска от вземане тя по-грозна, се оказва, че има една библиотека в свят, наречен JQuery. И JQuery е супер популярната JavaScript библиотека това е толкова популярна, че най- всяко JavaScript-- това не е необичайно за хората да се объркат Jquery с JavaScript. Защо? Самата JavaScript има много многословни начини за правене на things-- document.getElementById, dadadadadada. В крайна сметка има много дълги реда код. Така че един човек на име Джон Resid, който всъщност работи за стартиране до наши дни, се появиха с тази библиотека години Преди, че много хора са допринесли да нарича JQuery, която променя синтаксиса по следния начин. И точно затова сте виждали това, защото ще неизменно виж това, ако правиш уеб-базирана окончателен проект, това би било еквивалентно на пътя прилагане на същата тази функция се използва тази специална библиотека. Сега, вместо да закачка тя освен в своята цялост, нека просто да разгледаме някои модели. Този синтаксис изглежда да има колко анонимни функции или безименни функции или известен още като ламбда функции? Two, нали? И знаете ли, че, дори ако не сте супер удобен с това, само от факта, че казва функция () два пъти. И се оказва, че какво този код е doing-- и ние ще се отнасят за онлайн препратки, в крайна сметка, за някаква помощ с това. Това просто означава, че когато документът е готов, отидете напред и да се регистрирате следната функция като водачът представя за HTML елемент, чиято уникална идея е демо. И тогава, когато това се случи, наричаме тези два реда код. И това е трагично, по- многословен начин да се каже върне фалшиви. И ние споменахме това, само защото ще видите код, подобен на този онлайн. И това е нищо, за да се обезсърчават от. Но по-скоро, имайте предвид, че това, което е ще бъде често в JavaScript е тази парадигма. И така, това е защо ние го покаже за сега. Всичко е наред. Така че без да се спира твърде много по този синтаксис, се има някакви въпроси относно тези примери или идеи до този момент? Всичко е наред. Така че нека да използваме това за нещо полезно. Осъществяване на уеб страница, която просто казва здравей, така и така не е всичко, че интересно, не underwhelm. Това няма да бъде красива, но това няма да направи нещо полезно. Нека се върнем към моята директория тук и да се отворят, да кажем, форма-0.html. Така че предполагам, че това е най-първокурсника интрамурални спортове регистрация страница без каквато и CSS или някакво чувство за дизайн. И аз искам да отида напред и регистрирайте тук с парола. И аз отивам да се съгласявам с условията и условията и кликнете Register. И сега на сайта се казва: "Вие сте регистриран! (Е, не съвсем.) " Това изглежда като тя работи, но нека да вървим напред и да принуди презареждане. И позволете ми да кажа, не, не го направите действителната нужда от моя имейл адрес. Или може би просто ще кажа поща там. Парола ще бъде, като, 12345. И след това, само защото аз съм идиот, сега е 123 456 789. И аз няма да ходя, за да проверите вашата кутия. Хм. Всичко е наред. Така че има няколко възможности за подобрение тук. И знаеш ли, или ще видим в pset седем, че можете да напишете code-- и ще трябва да се напише код в PHP-- да защитят срещу тези видове на потребителя грешки, тъй като потребителят ясно не е сътрудничила. И той или тя не ви е дал всичко стойности сте искали или дори във формата, че ги е искал. Така че вие ​​ще видите в pset седем че ние със сигурност може да има някои ако условията, които казват, ако имейл адрес Не е username@something.edu, бихме могли просто кажа съжалявам и се извинявам на потребителя много, като може да сте в pset седем. Или, ако те не са проверили, че поле, Оказва се, в PHP, можете да откриете, че, също. И със сигурност, ако паролите не съвпадат, както в register.php за pset седем, можете да откриете, че. Но това е трън в врата с това, че сега те поискат ни да отидем по целия път до сървъра. Потребителят е информиран за грешката. И най-малко, освен ако не използвате някои красиви техники, Сега те трябва да щракнете върху стрелката назад. Не би ли било хубаво, като много сайтове днес, ако сте имали по-непосредствен обратна връзка, веднага? С други думи, нека отида до версия един, който ще бъде не по-хубава. Но тя не разполага с тази функция. Malan, 12345, 123 456 789, а не Ще отметка в квадратчето, регистрирайте. Паролите не съвпадат. Така че, въпреки че този поп-нагоре е ugly-- ние може да замени това в крайна сметка с нещо като Bootstrap, които ще видите в pset седем е много популярен library-- Направих открива, че паролите не съвпадат. Всичко е наред. Е, нека да се определи, че като потребител. Нека да вървим напред и да се каже, 12345, 12345. Все още не е проверка на споразумението. Трябва да се съгласи с правила и условия. Така че, защо? Ако вече сме постулира че има начин, и ние сме ви изисква в pset седем за откриване на грешки условия, като този от страна на сървъра, защо трябва аз притеснява да прави това в JavaScript? Какво е аргумент в подкрепа на това, което добавяне сте на път да видите като some-- има допълнителна сложност. Може би не е наопаки. Какво може да е? АУДИТОРИЯ: [недоловим]. DAVID Malan: О, интересно. Потенциални подвизи. Така че със сигурност, ако не сте боравене погрешно въвеждане на потребителя, че голяма, може би това е още по-добре, ако дори не достига до вашия сървър. Бих избутване там и да речем, вероятно ще трябва да оправя и двете от тези проблеми. Но това е справедливо. Какво друго? АУДИТОРИЯ: [недоловим]. DAVID Malan: Да. Този код, както казахме и преди, е тълкува въз от страна на клиента. Тя не се притеснява сървъра, което означава, че не е така повлияе на товара или капацитета на сървъра. И сега, за малко старата ми, това не оказва значим ефект защото имам един потребител в момента. Но ако сте всякаква уебсайт на приличен размер, особено най-големите, като Facebook, толкова повече можете да държи хората на разстояние на вашия сървър толкова по-добре тъй като сървър, разбира се, има само ограничен размер на RAM, краен брой гигахерца, краен брой неща той може да направи за единица време. Така че, ако има повече хора в света удря вашия сървър, случайно влезете неправилно, точно както ако да запазите този товар на разстояние вашия сървър. Plus, особено по мобилните device-- Ако някога сте влезете в или my.harvard NETID Йейл или други подобни, има тази латентността с много сайтове като този, при който то предприема, харесват, пука секунда или две, понякога. И тогава, Боже мой, ако сте въвели грешно, тогава ще трябва да отвърна на удара и да го ремонтирам. Така че има време на изчакване, особено при по-слаби връзки с мрежата. Но JavaScript, защото тя работи на клиента и не е нужно да отидете напред и назад цяла потенциално бавна интернет връзка, можете да получите почти мигновена обратна връзка. Така че нека да погледнем на това. Позволете ми да се отворят формуляр-0 и погледнете на HTML тук. И нека просто да видим какво се случва. Това е форма, чиито действие е register.php. Аз съм само с помощта получите толкова че можех да видя адреса. Но за пароли, щяхме със сигурност искате да се промени това, за да публикувате в реалност. Ето един вход поле от тип текст. Ето още един вход поле от тип парола. Ето, ако никога не сте виждали, с вход на отметка от тип. Но няма JavaScript тук, каквато. Това е само, че HTML отива register.php. Но в една версия, където I Започнах да получите тези изскачащи прозорци, нека да видим какво всъщност се случва тук. Във версия, какво Отивам да see-- I че мога да се забави достатъчно, с достатъчно думи, но аз се завтече. Във версия one-- там отиваме. Във версия една, забележете following-- и не е най-доброто изпълнение, но това е първият ми. Забележете, че под форма, имам таг скрипт. И таг скрипт означава, хей, браузър, тук идва някакъв код в, Обикновено, JavaScript. И сега, забележете, това, което правя. На line-- Трудно ми е да Прочети it-- линия 32, се казва, Var form-- така да ми дадете променлива, наречена форма. И след това получи document.getElementId на "регистрация". Какво е това? Е, нека да се върнем назад до тук. И предизвестие, ах, дадох форма елемент произволно, но описателно идея на регистрацията. Така че това ми дава променлива, която ми позволява да вземете този възел, че правоъгълник, в дървото, наречена форма. form.onsubmit средства, хей браузър, регистрирайте слушател събитие в този формуляр. С други думи, когато тази форма е представено, изпълнява следния код. Тя не се нуждае от име, защото защо трябва да знаете името? Ти просто трябва да знаете какво да се изпълни, ерго това е анонимен или ламбда функция. И това е функция всички тези линии тук. И сега, за да бъдем честни, въпреки че може да не са писани някога JavaScript и преди, това е просто C и PHP логика. Така че, ако form.email.value == "" - така че, ако полето за имейл е празно, крещи на потребителя с "Трябва да предостави имейл адреса си. " Иначе, ако form.password.value е празно крещи на потребителя, "Трябва да предоставите парола." Още по-интересно е логично, ако form.password.value не равно form.confirmation.value-- когато дойде потвърждение от? Нека да се върнем назад. Е, аз нарича този вход поле тук парола. И се обадих на този тук потвърждение. Можех да го нарече парола две или нещо друго. Аз съм просто логично проверка че тези две са еднакви. Else-- се оказва, това е господин Бул again-- булева стойност, в квадратчето. Така че, ако кажа, удивителен point-- ако не form.agreement.checked, крещи на потребителя, както добре. Така че този синтаксис ще видите е много често в JavaScript, , където можете да получите този пунктирана нотация. Започвате с обект тук. Вие се потопите в дълбок до до имот като парола. И тогава можете да получите най-реалната й стойност. И пак, тук е на входа. Тук е паролата име. И неговата стойност е независимо от всъщност човека е въвел инча Така във всички от тях случаи, аз се върнаха фалшиви. Но ако не, аз се върнете вярно. И така, сега ние виждаме убедителна, когато използването на вие ще се върне фалшиви да спрете това, което правите на потребителя и го направи или да я изберете отново или въведете отново. В противен случай, ние се върнете вярно. И нека представим една друг вариант на това просто за семена някакво разбиране за това. Е, във версия 2 на този, форма-2-- Ще го направя с махване на ръка. Това е, за тези, любопитни, на JQuery версия, тези от вас, които може да искате да бъркам в конкретната библиотека. Но нека start-- и някакви въпроси? Нека спрем за момент, защото че е бърз и много. Но хубавото е, че всичко, на кода е почти същото. Новият неща е това, което е най-DOM? Какви са тези правоъгълници? Какви са тези възли? Какво е анонимна функция? Какво е боравене със събития? Но за щастие, повечето от които е само пълен кръг от, да речем, нула седмица. Всичко е наред. Така че нещо малко по-интересно? Ами, на първо място, да ме пусне напред и да се отворят Google Maps. И вие ще забележите, че за миг, за част от секундата, забележите, какво става, когато I кликнете достатъчно бързо. И тази връзка в Харвард е така бързо, че наистина не го забележите. Но това, което вид вид виж ако щракнете и плъзнете много по-бързо? Тези от вас, гледане онлайн, ако се забави тази скорост 0.5х, можете да видите това по-добре. Какво се случва само преди Щракнах и повлече? Нека се опитам here-- ми позволява нещо друго, като 90 210. Нека да отидем далеч. Това беше много по-бързо, също. Какво ще кажете за Disney World? Ето. ДОБРЕ. Какво видя за част от секундата? Просто, като, площади, нали? Запазено място за плочки? Е, какво става тук? Google Maps е приятен пример за тази технология, която се нарича AJAX. И това е мястото, където ние ще започнем да използвате JavaScript в особено съблазнителен начин. Обратно, в деня, имаше този уебсайт, наречен MapQuest. И аз трябва да са взели скрийншот на този от 1990-те години, където ако искаш да гледам тук на карта, бихте буквално кликнете стрела нагоре към върха, която ви показах различен квадрат на картата. Ако искате да се движат наляво, вие кликнали стрела, която ви показах различен квадрат на картата. И някои сайтове все още правят това днес. Но дори и MapQuest е намерила по-добре, като Google Maps. Вместо това, това, което е по-добре тези дни е уебсайтове, които използват AJAX. AJAX-- иначе известни като Asynchronous JavaScript и XML, която е само на луксозен начин на казвайки технология или техника, която позволява браузър използвайки JavaScript да направи допълнителни искания HTTP След като страницата се зарежда. И така, какво означава това? Е, това би било вид на досадно в Gmail ако всеки път, когато исках за да проверите пощата си, бяхте буквално удари Control-R или Command-R или щракнете върху бутона за презареждане и цялата страница дяволски ще се презареди. Нали така? Тя ще започне да мига бяло Вероятно за секунда. Вие ще видите глупаво прогрес бара. И само за да видите, ако имате нова поща, цялата уеб страница и URL адреса ти си най-ще трябва да се презареди. Но това не е това, което се случва в Gmail. Нали така? Когато получите нов имейл в Gmail, това, което се случва на екрана? Това просто показва, нали? Тя просто магически се появява като нов ред в таблицата. Това всъщност е свързано с прилична сума на сложност. В действителност, ако мислите за това дърво, които въпреки че е просто един тук, Gmail-- и аз ще трябва да погледнем най-кодът да бъде sure-- Вероятно има HTML маса или може би неподреден списък, който го прави всеки един от вашите пощенски кутии имейли като. И така, ако си представим това има е дърво в паметта, когато сте използване на Gmail, която изглежда вид вид като този, когато Google осъзнава, ох, имате нов имейл, това не е така Искам да възстанови цялото дърво. Вместо това, тя иска да намери възела в дървото, което представлява пощенската си кутия и просто да вмъкнете нов възел. Така че много подобен на pset пет, където можете Трябваше да вмъкнете възли в хеш таблица, по подобен начин прави Google, чрез JavaScript код, който я е написал, траверс това дърво, разбера къде е, че входящата част на прозореца, и след това се добавя нов ред. И нов ред означава само едно или повече нови възли в едно дърво. И така AJAX е тази техника който дава възможност за точно това. След като посети URL, обаче луд дълго и да е, и след като е на страницата бил натоварен, все още можете да вземете повече данни от internet-- дали е имейл или керемида на map-- го вземете зад кулисите и след това я поставете в страницата така, че човекът не е така наистина трябва да го чакаме. Facebook Messenger работи по същия начин. Всеки брой на друга websites-- О, всъщност, дори и това. Искам да кажа, това е, честно казано, вид досадно разполагат тези дни. Ако започна да търсите cats-- това е вид ужасно преживяване за потребителя. Тя просто започва да търси мен. Ами това, което го прави? URL адресът, наистина не се е променило тъй като аз започнах да пишете. Но какво се случва от другата страна на wire-- OK, хмм интересно. Какво се случва от другата страна на тел тук ще става все по-странно. ДОБРЕ. Така че нека да вървим напред и да се запознаят елемент и отидете в раздела Network и се опитват да направят това техническа и по-малко за котки. Като пиша, буквално, котки and-- какво се случва per-- аз няма да кликнете върху него. Всичко е наред. Така че тук, какво се случва всеки път I въведете символ, както изглежда? Подобно, ниско ниво? Какво се случва с всеки един от тези, знаци съм пишете на клавиатурата ми? Да? АУДИТОРИЯ: [недоловим]. DAVID Malan: Точно така. Всеки един от тези символи е Ще Google, един по един. Те са изграждане на низ на техния сървър, който представлява всичко, което съм въвели в този момент. И всеки път, когато въведете друг характер, те използвате тяхната тайна сос от Търсене по алгоритъм и да разбера, значи тази котка страница или тази котка страница или други подобни? Така че в известен смисъл, това ми дава с по-добър опит в това, че дори не трябва да завърши мисълта си. И наистина, той е полезна нещо, автоматично довършване като цяло. Ако техните алгоритми са достатъчно добри и ако моите търсения са достатъчно очевидни, Не трябва да въведете цялата дума. Те ще ми каже какво е е аз съм всъщност търсите. Така че това, което Google призовава за незабавни търсене е само с помощта на AJAX, използване на код, който им позволява да направите заявка допълнително съдържание чрез уеб браузър зад кулисите, използващи тази нов език, JavaScript. Така че ние имаме оставени няколко минути. И нека ми се обади на моя приятел Колтън се качи на сцената, тъй като тя изглеждаше особено забавно за последен път да се въведе технология че някои от вас проявиха интерес в за окончателните проекти. Мислехме, че ще бъде забавно да се въвеждат до доброволец, все пак, днес да ви покажа един допълнение към тази, която позволява you-- да, За първи път видях тази ръка. Хайде нагоре. Много добре направено. Добра работа. Отивам да проектира тази на на екрана в един момент. Какво е вашето име за всички? EFA: Аз съм Efa. DAVID Malan: Etha? EFA: Efa. DAVID Malan: Efa? EFA: Да. DAVID Malan: Радвам се да ви видя. Всичко е наред. Позволете ми да се получи това готово. Хайде на над към средно с Колтън тук. Какво Колтън има в ръцете си днес е с дистанционно управление. Така че, вместо просто да стоя там в триизмерен свят се оглежда като Колтън е направил, сега може Efa действително се разхожда с върви нагоре, надолу, наляво и надясно като Nintendo или Xbox контролер. EFA: Отивам да падне от сцената. DAVID Malan: Аз искам престои приблизително тук. Но това е риск. ДОБРЕ. Така че продължавайте напред и сложи тези на. Нека да вървим напред и да превключите на екрана тук. Нека намаляване на осветлението. И Колтън, нека дойде щанд до вас. Искате ли да се обясни тук с микрофона какво правим? Заповядай. COLTON: Разбира се. Така че в момента ние сме зареждане на Oculus, Предполагам operating-- не работи система, но основната програма, където можете да получите достъп до всички игри и приложения, които са във вашата библиотека. Така че точно сега, то трябва да се каже, докоснете тъчпада, за да започне. Touchpad ще бъде на дясната страна на слушалката. Така че продължавайте напред и tap-- EFA: О, човече. DAVID Malan: Да, там ще отида. Качеството Efa се виждат е много по-високо качество. Това е само Wi-Fi тук. COLTON: Така че това, което сте ще искате да направите, се погледне към върха десен ъгъл на екрана. Да, това игра на самия горния десен ъгъл. И тогава, когато сте избора го докоснете тъчпада отново. Мисля си Dreadhalls. И след това тук е A-- тук, нека ме държи очилата за вас. Така че аз просто му даде контролер. Така че сега той може да контролира играта. Той може да се движи около и подобни неща. Така че продължавайте напред и погледни нагоре към върха. Трябва да видите New Game. Така че продължавайте напред и да можете да направите това. Сега, вие трябва да бъдете в състояние да контролира себе си с контролера, както и, веднага след като играта се зарежда тук. Това може да е малко по-страшно. EFA: Сега ли да ми кажете. ДОБРЕ. COLTON: Добре. Така се потвърди, че можете да се движите. ДОБРЕ. Можете да се движите. Perfect. Така че, ако погледнете надолу, имате карта. Карта ви показва къде се намирате. Можете да потърсите из стаята. Вие можете напълно да се обърнеш. Да, точно така. Обърни се. Така че гледам да си ляв. Мисля, че има нещо, което може взема на един барел в стаята. EFA: Как да получите най- Карта от пътя? COLTON: Погледни нагоре. Само погледнете нагоре. Всичко е наред. Ето. Сега отидете напред и просто се обърни. Така изглеждат по-далеч от ляво. Продължавайте да се движите наляво. Продължавай да търсиш наляво. Продължавай. Да. EFA: О, по този начин. COLTON: Да. Отидете към него с контролера. Ето. Сега тя трябва да се каже, го вземете. Ето. Вдигни го. Всичко е наред. Сега, нека да се измъкнем от тази стая. Давай напред и да се разходите до тази врата. Така че ти започваш да hold-- се казва задръжте бутона, за да го принуди отворена. Така че продължавайте напред и задръжте бутона. Да, принуждавайки го отворите. Всичко е наред. Добра работа. Сега се разхожда из стаята. Така че аз отивам да напусне останалата нагоре за вас и да видим какво можете да разберете. EFA: Аз не отивам в тъмната стая. О, чакай. Сега аз трябва да сляза тъмния коридор? OK, Връщам [недоловим]. COLTON: Добре. Някои повече елементи, за да вдигнеш. Изглежда, че някои монети. Това е шперцове. Така че, ако се намери заключена врата, можете да използвате това. Страх ли те е? EFA: Не още. COLTON: OK. Pretend-- да. Просто се преструвам, че си всъщност стои там. И ако включите around-- ти трябва да свикнеш с това. Но това има смисъл. DAVID Malan: И докато Efa продължава да играе, тъй като бихме могли да направим това по цял ден, всички ние можем пръсти тук. Но ние имаме две други двойки, ако искате да дойде и да играе. В противен случай, ще видим можете следващата сряда. Благодарим Ви, че в нашия доброволец днес. [Аплодисменти] [MUSIC - "Зайнфелд ТЕМА"] SPEAKER 1: Ами, аз съм поставяне на нова PL монтирате на. Току-що промених на OLPF-- SPEAKER 2: Така че това, което точно правиш? SPEAKER 1: Е, всеки един от these-- тук, аз ще ви покажа това тук. Можете да я видите тук. SPEAKER 3: Мисля, че съм добър с тях. Искаш ли още? SPEAKER 4: Не, аз съм добре. [Недоловим]. SPEAKER 3: Не, [недоловим]. Вземи си. SPEAKER 1: Различен цвят. SPEAKER 2: OK. SPEAKER 1: Така че в крайна сметка това, което прави, е да го настройва цветовете of--