[Играет музыка] 

Дэвид Малан: Это CS50. Это начало недели девять. И это то, что будет иметь был 200-летия г Буля. Так что это ребята кому мы упоминали довольно несколько раз об использовании Логические переменные истинные и ложные, 1 и 0 и тому подобное. И это было Google, дань с ним сегодня. Он превратился бы 200. Так что, если вы хотите, чтобы присоединиться к нам на обед CS50, взглянуть на ссылку на веб-сайте курса. И такие лица, как и друзья это ждет вас здесь, в Кембридже. Лица, как они ждут Вас в Нью-Хейвене. И в самом деле, Кен Нью-Хейвен любезно то, что называется Анимированные GIF Илая здесь недавно lunch-- GIF еще другой графический формат файла, с которой вы familiar--, что выглядит немного что-то подобное. Так просто последовательность of-- ОК. Здесь никто в Кембридже не смеется. Но в Нью-Хейвене, это это действительно смешно, не так ли? Все в порядке. 

Так что присоединяйтесь к нам там. Здесь, в Гарварде, В частности, это среда, если вы студент-второкурсник или первокурсник even-- или даже junior-- мышление решений переключатель в компьютер наука, знать, что там будет Будьте CS консультирование справедливо это Среда, вскоре после класса в 4:00 вечера в компьютере наука здание Максвелл Дворкин. Мы поставить это на курс-х сайт завтра, как хорошо. Пончики, я сказал, будет подан. 

Все в порядке. Так смешно story-- я тыкать вокруг в Интернете, и я нашел некоторые старые архивы моего бывшего сайта. И получается out-- вокруг этого Время, кажется, очень своевременно так я понимаю, что выборы UC около готовиться снова. Так что я побежал за UC, потерял несчастно. И, может быть, это было в части, почему. Так что это был мой веб-сайт в то время. По какой-то причине, я думал, что это было хорошая идея, прежде, чем говорить людям, что моя платформа была, и почему они должны голосовать за меня, что у них есть нажать, чтобы войти, чтобы найти, что информация, которая в ретроспективе это вид жуткий. Я действительно не знаю, что это было. 

Но это, конечно, не помочь моей кампании. Я также обнаружил, что старший год-- меня была эта календарь Маппет. Маппет-шоу были отчасти в моде в то время. Или, может быть, они не были. Я был календарь Маппет тогда. И я думал, что это было бы здорово, чтобы имя мой компьютер в сети Гарварда frogman.student.harvard.edu. В то время, мы все однозначно идентифицируемые имена хостов. А вы могли бы выбрать несколько тщеславие имя вместо своего имени. И я пошел с пловца по некоторым причинам. 

И тогда я started-- я провел много времени нажатия через эти ссылки этим утром. И это была моя страница о, который в настоящее время вид кажется очаровательны. Но это также свидетельствует о том, чтобы просто как далеко технология пришла. Я имею в виду, назад в день, 486 было что-то. В эти дни, это супер, супер, супер медленно и хорошо менее чем вы могли бы иметь в своем собственные карманы в эти дни. Там больше там, что был еще более неловко. Поэтому я оставляю его на что. Но это был мой первый набег в web-- о, нет. Это не было. Мой первый реальный набег в веб-программировании был этот сайт, который я просто забыл. В какой-то момент, я узнал, как сделать повторяющиеся фоновые изображения. И так я нашел это черепица эффективно, как хоккеиста, футбол, гольф и шар, или что бы это ни для сайта Фрош IMS. И это было на самом деле, действительно первый веб-проект на основе я взял on-- Я думаю, что, может быть, студент-второкурсник год, младший год-- после того, CS50 и CS51, один из общих последующих по классам. Я заметил, глядя в в архивах что один из моих преемников и друзья, Ли, вроде изменилось авторское право к себе. Но это было действительно то, что Я должен владеть замешательство. Но в то время, это был первый сайт, как я сказал несколько недель назад, с помощью которого мог первокурсник зарегистрироваться очной спорта здесь. И так получается, что фоновые изображения так не такая хорошая идея. Но полотно было новым, и все, что мы экспериментировали. И это то, что я по-видимому, сделал в то время. Все в порядке. Так что без дальнейших церемоний, мы переключаем Шестерни сегодня, чтобы дать вам, на самом деле, заключительная часть, что вы могли бы найти особенно полезно для конечных проектов но также, что начнет сделать весь мир паутину чувствую себя немного более понятным. В самом деле, мы собираемся представить еще один язык программирования называется JavaScript, что похоже и отличается по-разному от языках мы смотрели на до сих пор. 

Так C, напомним, это компилируемый язык. Вы должны запустить его через компилятор. Вы исходный код объекта Код, или нулей и единиц. И те и нули те, которые ваш процессор, Центральный процессор, на самом деле понять. PHP, напротив, не компилируемый язык. Это что? Это интерпретируемый язык. Так что какая-то программа называется интерпретатор, который должен прочитать it-- сверху снизу, слева right-- и выяснить, что все ваш синтаксис делает и означает, является ли это петля или состояние или любое другое число программирования строит. Так вот это интерпретируемый язык. 

Тогда мы ввели HTML. И HTML даже не язык программирования. Мы бы назвали это что? Язык разметки, который находится всего своего рода причудливый способ сказать это не программные конструкции, такие как мы видели, даже назад в день нуля. Там нет петель. Там нет условий. Это действительно язык о разметке данных и форматирования или структурирования его в некотором роде. 

УС, тем временем, аналогично не является языком программирования. Это даже более эстетически ориентированной. И это позволяет сортировать тонкой настройки такие вещи, как размер шрифта и цвета и размещение, и все, что. Тогда мы имели 

SQL. Так SQL действительно программирования язык в некотором смысле, хотя с учетом специально для баз данных. Но даже если мы только познакомить вас с выбрать и вставить и удалить и обновить и несколько других, Оказывается, можно на самом деле написать функции или процедуры, так как они называется, в SQL, которые выглядят и действуют совсем как функции PHP и C. Так знаете, что существует. Но мы даже не возиться с ними как мы только что поцарапать поверхность здесь. И тогда JavaScript, последний из наши языки официально представила. Так JavaScript, тоже интерпретируемый язык. И тех, кто знаком, сделать Вы хотите, чтобы отличить его с некоторыми характеристика и от C и PHP? Чем она отличается? 

АУДИТОРИЯ: Это не составлен. 

Дэвид Малан: раз сказать? 

АУДИТОРИЯ: Это не составлен. 

Дэвид Малан: Это не составлен. Так что, тоже интерпретируется. Так что это не составлен. Но что делает его немного как PHP. Но он по-прежнему отличается от PHP в некотором поразительным образом по крайней мере, в том, как мы будем его использовать. Да? 

АУДИТОРИЯ: Это работает на стороне клиента. 

Дэвид Малан: Она работает на стороне клиента, обычно. Это действительно отличительная характерно для нас прямо сейчас. С была на стороне сервера в том смысле, что мы сделали все, что в CS50 IDE. PHP сих пор было серверный поскольку как это, тоже, получает interpreted-- не составлен, но interpreted-- внутри CS50 IDE, что, конечно, просто сервер или серверы в облаке. 

Но в JavaScript, даже хотя вам вы собираетесь чтобы начать писать его, скажем, PSET восемь и, возможно, окончательное projects-- вы собирается верно это в CS50 IDE и сохранить его файлов, находящихся CS50 IDE, IDE CS50 и, в свою очередь, облако серверов на котором он размещается, не собирается интерпретировать или выполнять код. Скорее всего, это будет отправлено в неизменном виде до браузере. И это то будет И.Е. или Chrome или Firefox или Safari или что-то на самом деле интерпретирует, что это сверху вниз, слева направо. Так Основными отличительными характерно для сегодняшнего дня является то, что JavaScript является стороне клиента и PHP, например, Был на стороне сервера. Теперь, это имеет интересные последствия для, как, интеллектуальной собственности и кто можете увидеть код. И в самом деле, вы можете пойти в Интернете и посмотреть, наиболее любой код, который кто-то написано в JavaScript. Иногда это читается, иногда это затемненный. Но об этом в свое время. 

Так JavaScript, достаточно красиво, это супер похоже, синтаксически, чтобы С. И так же, как PHP, нет Основная функция. Если вы хотите, чтобы начать писать Код JavaScript, как вы увидите сегодня, Вы просто начать писать. Но это, вы увидите, в частности, полезно в контексте веб-браузеров. Тем не менее, мой маленький disclaimer-- обычно earlier-- было сказать, что вы можете более сегодня использование JavaScript на стороне сервера с помощью фантазии рамки под названием Node.js что некоторые из собственных приложений CS50 в написаны на. Проверьте 50 фактически использует Node.js. Но мы собираемся сосредоточиться на JavaScript на стороне клиента здесь на. 

Так вот набор условий в PHP. К сожалению, на самом деле in--, что Заявление, тоже правильно. Здесь же набор условия в JavaScript. Синтаксически это идентична С и PHP. Выражения г Буля являются, Аналогично, синтаксически идентичны как C и PHP. У нас также есть переключатели в JavaScript, что выглядят идентично. У нас есть для петель, которые структурированы одинаково, в то время как петли, делать, пока петли. 

Этот немного отличается. PHP имел для каждой конструкции что вы могли бы использовать или будут использовать в PSET семь, может быть. JavaScript имеет эту специальную версию для того, где вы в буквальном смысле что-то сказать как для переменной ключ в объект, который очень кратким способом сказать, если я получил object-- и мы говорить о них еще раз в moment-- и я хочу, чтобы перебрать все из пар ключ-значение внутри, Я не должны выяснить, как численно индексировать их с нуля, одной, два три. 

Я могу сказать, что это в буквальном смысле. И на каждой итерации, JavaScript для меня будет обновлять ключ переменной чтобы быть первым ключом, то в следующем ключ, то следующий ключ, то следующий ключ, и так далее. И я могу получить на его стоимости обработкой объект в JavaScript, как мы увидим, как будто что это Ассоциативный массив в PHP. В самом деле, если вы, наконец, завернутый ваш против того, что вокруг ассоциативный массив в PHP, вы можете думать о нем, как сейчас идентичны объекта в JavaScript. Но это немного упрощение. 

Массивы смотрите, достаточно красиво, идентичны в PHP для одного символа, за исключением. Там одна вещь, хватает здесь что мы видели на прошлой неделе с PHP. Что опущен? Да? Нет знак доллара. Так мы вернулись к более нормальным мир, где переменные не имеют знаки доллара. Но вы префикс их с Вар, обычно. И вар означает переменную. И так же, как PHP является свободно typed-- которой есть виды, Есть числа и строки и плавает и так forth-- JavaScript аналогично имеет виды. Но это слабо типизированным, что мы, программистам не нужно указывать их. Мы просто должны быть в курсе что существуют различные типы. 

Переменные, meanwhile-- вот как мы могли бы объявить "привет, мир" в виде строки. Обратите внимание, что это совпадает с PHP, но не знак доллара. И это то, что мы начать видеть больше сегодня, в результате чего у вас есть объект с ключами и значениями. И если вы хотите, чтобы попытаться вывести из последнего week-- синтаксис немного отличается. Но немного здравомыслия check-- сколько ключи это объект, кажется, есть? Так я вижу четыре. Я вижу два. 

Так это на самом деле два. Так что это коллекция из двух пар ключ-значение. Ключ символ, значение которого FB. Ключ цена, значение которого 101.53. Так что те две пары ключ-значение. И помните, PHP-- и это снова только вид синтаксической разницы. Это не все, что интеллектуально интересным. PHP мог бы написать это же вещь, как follows-- цитатой, равна. И я изменить их на квадратные скобки. И тогда я могу изменить это в кавычках слово, "цена." И тогда я не использовать двоеточие. Что я использую на прошлой неделе? Да, знак равенства стрелка фанки обозначения. 

И тогда я сделал то же самое здесь. То же самое здесь. И это все. Так что это нормально, если это не имеет действительно затонул в памяти только еще и потому, что это действительно интеллектуально неинтересным. Это просто синтаксические различия. Но идеи точно то же самое. Внутри этой переменной цитата JavaScript это коллекция пар ключ-значение, один из которых является символом, одна из которых является цена. И я могу получить при тех значениях со следующим синтаксисом. Так же, как в PHP, я мог сделать что-то like-- пусть мне сделать это окно немного больше. Так же, как в PHP, я мог сделать this-- о, черт возьми. Давай. 

Так же, как в PHP-- Хорошо, мы просто использовать Даритель заметки. Так же, как в PHP, я могу сделать $ цитата $ цитата ["символ"], и это поможет мне значение "символ". В JavaScript, это будет идентичны, в результате чего я могу просто сделать это. Единственное, что это хватает знак доллара. 

Так достаточно хорошо, то, что есть не все, что много нового синтаксиса. Так что сегодня мы ориентируемся на, действительно, некоторые из идей и приложений. И первый такой приложение, которое вы могли бы видели, если вы нырнули в PSET семь уже этот синтаксис. Таким образом, в PSET семь, если у Вас есть видел или не видел еще, знаю, что есть файл, который мы даем Вы назвали config.json-- JavaScript Object Notation. Зачем? Мы хотели, чтобы быть в состоянии предоставить Вам с шаблон с некоторых пар ключ-значение. Мы хотели, чтобы быть в состоянии дать вам список хоста, название сервера. Мы хотели, чтобы дать вам Место для вашего имени пользователя и заполнитель для вашего пароля. Если вы не видите это еще не о чем беспокоиться. Подробнее об этом в PSET семь [? спекуляция ?] А потом, Очевидно, мы хотим вас заполнить в-DOS потому что, когда вы входите в CS50 IDE, каждый из вас иметь свой собственный логин и пароль. 

Таким образом, мы могли бы использовать полтора десятка или больше различных форматов файлов. Мы могли бы использовать файл .txt. Мы могли бы использовать файл CSV с. Мы могли бы используется INI-файл, XML-файл, целая куча больше Сокращения, что Вы не могли бы когда-либо слышал. Это своего рода произвольное в конце дня. Но супер популярны в эти дни является текст формат, называемый JSON-- JavaScript Object Notation--, что выглядит как это. Это немного загадочным, но обратите внимание, шаблоны. Вы начинаете с открытым кудрявых скобка, и вы в конечном с тем же. Внутри что-то, что. Это пара ключ-значение. Так что это объект, который я глядя на на экране здесь который имеет один ключ, который имеет одно значение. И только выведение на основе предыдущая модель, что ключевым здесь? База данных, вещь, чтобы левый толстой кишки. 

Теперь, значение бывает а несколько строк на этот раз. Но значение начинается с курчавыми готовиться и заканчивается с фигурной скобки. Так что вы могли бы предложить это Тип значения базы данных? Словарь или просто более лаконично, объект. Правильно? Это своего рода структуры данных, можно использовать и другие структуры в себе. Так что, если все это дело мы Вызов object-- и объект это всего лишь кучка ключ-значение pairs-- значение самой базы данных является объектом. Значение базы данных имеет целый букет из пар ключ-значение, первый из которых это хозяин, то назвать, то имя пользователя, пароль, то, каждый из которых значения, между тем, это просто скучно строка в двойных кавычках. 

Таким образом, даже если это не супер ясно только пока, знаю, что это всего лишь стандарт, довольно скучно способ хранения данных в стандартном формате. Но общие ошибки, которые вы может сделать, даже в PSET семь, маленькие глупые вещи, как, если вас случайно опустить запятую там. Это собирается привести в файле не обязательно быть читаемым. Если вы случайно опустить вещи, как котировки, он не собирается быть читаемым. Так что это довольно nitpicky формат, но это тот, который очень часто. И мы решили использовать его, хотя Вы не использовать любой JavaScript в противном случае, в PSET семь. 

Все в порядке. Так что помните эту картину. Мы говорили, в HTML, что код может выглядеть следующим образом. Это язык разметки гипертекста [Неразборчиво] для всего "Hello, World". Но тогда мы предложили Некоторое время назад, что, если это поможет, Вы могли бы начать думать об этом уже в виде дерева. В самом деле, углубление что мы использовать только ради читаемости в или ради стиля в на левая можете вид быть переведены в этом дереве, где вы есть специальный корневой узел, который мы обычно называют документ, ниже которого корень HTML-элемент или тэг, HTML, который затем два дети, голова и тело. 

А потом, в свою очередь, глава имеет название. И название имеет текстовое значение. И тело подобно имеет текстовое значение. Так что, если вы чувствуете себя комфортно поговорка что да, вы могли бы взять эту HTML и нарисовать картину, как это, правая сторона хороший ментальная модель, потому что теперь что у нас есть JavaScript, программирование язык, который браузеры выполнять и интерпретировать для вас, Оказывается, что то, что мы собираемся сделать в коде это начать манипулировать это Структура дерева в памяти. Мы не должны строить дерево в памяти. Мы не должны делать вид Структура данных PSET пять-стиль Сложность. Браузер, достаточно красиво, на интерпретации HTML сверху вниз, влево или вправо, буквально собирается передать нам эквивалента указатель к этому всему дереву бесплатно. Это делает всю тяжелую работу. Это то, что Mozilla и Apple, и другие сделали для нас. 

И с JavaScript мы будем быть в состоянии контролировать и изменять и делать интересные вещи что дерево, иначе известный как DOM или объектной модели документов. Какие вещи? Ну, получается, что в JavaScript, есть этот список стирка события, которые могут иметь место. И мы действительно не использовали, что Слово с недели нулю и PSET нулю, когда мы говорили о пустом. Большинство из вас, вероятно, не использовать событие в вашей царапинам проекта. Но вы, возможно, помните простой Марко Поло Например, когда у нас было два спрайты, один из которых сказал, Марко. Другой из которых затем, при прослушивание и слышать, что событие, сказал, Поло. Если нет, не стесняйтесь оглянуться назад, что далеко назад. 

Но это просто говорят, и вы можете вид вывести из названий этих вещи, JavaScript, оказывается, собирается дать нам возможность слушать для мыши спускаясь или мыши подойдя или ключ спускаясь или клавишу вверх или onsubmit onselect или что-то onresizing. Другими словами, любое физическое действие что человек может взять с браузером что вы делаете каждый день, вы можете написать Код для который слушает тех событий а затем делает что-то подходящее. 

Например, если вы используете Google Maps, что произойдет, если щелкнуть и переместить мышь, как правило,? Если вы щелкните и перетащите? Да? В точку. Карта начинает двигаться. Таким образом, вы можете сортировать, видят то, что здесь, что там. И как Google реализовать это? Ну, по-видимому, они используя пару этих события слушатели, один, что говорит, слушайте на мыши down-- поэтому, когда пользователь физически толкает его трекпад или его или ее мышкой вниз. И тогда мы ищем что-то вроде движения или какой-либо другой случай, который позволяет захватить сопротивления. И в самом деле, это так же перетащить в этом точка точка точка список возможных вариантов. 

Таким образом, это будет мощным способ начать отвечать пользователю даже прежде, чем он или она на самом деле кликов то явное, как представить. Но мы собираемся представить пара темы попасть. Но сначала, давайте переход в какой-то реальный код. Так что я собираюсь пойти вперед и открыть дом-0, который является очень простой пример здесь, что если я просто увеличить имеет этот вход здесь для меня. И я собираюсь идти вперед и ввести в "Давид" на мое имя и нажмите кнопку Отправить. 

А потом, хотя вроде дешево, я есть это приглашение, которое появляется, что говорит, "привет David!" Так что это своего рода как наш "привет, мир" что мы сделали некоторое время назад в C и даже в PHP, потому что я динамически выводится мое имя. Я могу сделать имя кого-то другого здесь. Я мог бы просто изменить это, как Ханна, нажмите кнопку Отправить. И в самом деле, маленькие всплывающие изменения. 

Теперь, всплывающие окна являются одним из самым распространенным особенности в Интернете. И в самом деле, еще в в день всплывающие блокаторы вошли в моду, потому что вы будет идти в какой-то website-- возможно, под вопросом place-- что бы потом вдруг начать забрасывать экран с целой кучей всплывающих окон. И так эта способность выскакивать Окна в перед пользователем не была особенно хорошо принят человечеством. Так вот почему вы видите это предотвратить самое, который только делает все это дело некрасиво. Итак, мы собираемся, чтобы нуждаться в лучший способ, чтобы побудить пользователя. Но сейчас, что, кажется, работает. Так что просто интуитивно, что Кажется, что здесь происходит? Я иду вперед и нажмите кнопку Отправить, а то что-то происходит, ясно. Но то, что не происходит, что случилось На прошлой неделе в любое время я нажал представить? Что не произошло на экране? Сожалею? Обновить. URL-адрес не изменится. Я сказал, что это был дом-0, и я все еще в Доме-0. Как правило, мы получить изменилось в другой Ссылка, как register.php или тому подобное. 

Но даже когда я уволить эта вещь, нажав кнопку ОК, Обратите внимание, что URL остается полностью на месте. И, в самом деле, если я немного скептически, позвольте мне открыть Chrome. Позвольте мне открыть вкладку Сеть. И заметьте, это пустой на данный момент. Позвольте мне идти вперед и повторно Марию. Там нет сетевого трафика вообще. Так нет HTTP. 

Так на самом деле, если я смотрю на исходном коде для this-- позвольте мне закрыть это окно и перейти к Просмотреть Source. Интересно. Похоже, есть некоторые Новые метки, среди них сценарий. Итак, давайте взглянем в течение CS50 IDE именно то, что я послал к пользователю. 

Так вот давайте is-- сосредоточиться на только HTML. Вот в нижней половине Дом-0.html. И заметьте, что он получил название, голова тег, тег тела, форма тега. Но то, что выскакивает вам как разные, особенно если вы никогда не написано любой JavaScript самостоятельно. Позвольте мне немного прокрутите чтобы прямо здесь. Я получил вход, другой вход для представить. Я получил идентификатор, который является своего рода новый. Но мы видим это CSS. Что еще, безусловно, новый? Да? Хороший. 

Все в порядке. Так, где он говорит onsubmit, заметить, что, кажется, следует. Это является атрибутом в HTML номенклатуры. Его значение это строка в кавычках здесь. И это выглядит немного странно на первый взгляд. Это не HTML. Это не CSS. Это, как вы уже могли догадаться, JavaScript. Так что, похоже, что встроенный в этот Веб-страница является функцией называется Приветствую. И я просто выведение что потому что это слово, приветствую. Он получил открытую Парень, Закрыть Парень, точка с запятой. Похоже, функции C, выглядит как функции PHP. 

И в самом деле, он собирается функция JavaScript. Затем я возвращаюсь ложным. Мы вернемся к что в минуту. Но где эта функция определена? Ну позвольте мне прокрутку вверх в верхней части файла. И хотя это длинная линия, это относительно проста. Позвольте мне масштаба здесь и сосредоточить внимание на этих четырех линий. 

Таким образом, в JavaScript, просто как PHP, вы просто скажем, в буквальном смысле, слово "функция", имя функции, а затем скобки с любым не arguments-- никаких аргументов в этом случае. И нет возврата тип в JavaScript, так же, как PHP. Так что это немного слабее, чем С. Открыть фигурная скобка, недалеко фигурная скобка. Встроенный в JavaScript является function-- не рекомендуется function-- а функция называется оповещения чья единственная цель в жизни это подтянуть, что довольно уродливые подскажите что мы видели минуту назад. 

Теперь это своего рода глотком. Что тут происходит? Итак, давайте начнем с выделить все здесь. Это тот же самый аргумент, чтобы предупредить. И что происходит? Это выглядит просто как строка. И оказывается, в отличие от PHP и в отличие от С, не имеет значения, в JavaScript если вы одинарные кавычки или двойные кавычки. Они будут эквивалентны. И, честно говоря, это просто популярны в эти дни для программистов JavaScript, чтобы всегда использовать одинарные кавычки для какой-то причине. Это только то, что делать. Но мы могли бы использовать двойные кавычки, а также. 

Так плюс новый персонаж. Но те из вас, которые сделали это раньше, что делает плюс в виду? Да. Объединить. Таким образом, мы видели это в PHP. Там просто точка оператор в PHP, что будет объединять две строки вместе. С боль в шее, чтобы сделать это. Напомним, с PSET шесть, который был особенная боль в шее, Вы должны были бы использовать что-то вроде strcat после выделения памяти в стеке или в куче. Вы должны были прыгать через обручи просто соединить две строки. В JavaScript, это супер просто. Просто используйте оператор плюс между ними. 

Таким образом, комплекс вида что, кажется, это потому что в конце Вся эта строка, я просто объединить на восклицательным знаком. Так что, если то, что было выскакивать был "привет, Дэвид," "привет, Ханна," "привет, Мария", и так далее, ясно что средний вещь между двумя плюсы должны дать мне доступ к чему? Что там наверняка? Да. Так что я буду делать вид, здесь ответить на их имя, не так ли? Таким образом, их имя выскочило в финале Результат. Итак, что же это значит? Ну, я предложил ранее в том, что картина, так называемый DOM имеет этот специальный корневой элемент способ наверху называется документ. А теперь, оказывается, что происходит как особый глобальной переменной в JavaScript, встроенный в которой является целая куча полезных функций. Среди полезная функциональность является Возможность получить в любой потомок узла. Эти квадраты или прямоугольники или эллипсы только узлы в дереве, так сказать. 

Так что получается, что встроенный в Документ объект в JavaScript является функцией, иначе известный как Метод, который называется getElementById. Синтаксис для вызова функция в JavaScript что находится внутри объекта или переменная только с точечной нотации. И мы видели это в C то, что синтаксис структурой. Вы видите это в PSET семь, вроде, вроде, когда вы видите CS50 :: запрос. Двоеточие двоеточие в PHP это еще один способ вызова функции, что это внутри какого-либо объекта. 

Но сейчас в JavaScript, это просто точка. И поэтому эта функция, достаточно красиво, вид говорит, что это does-- получить элемент по идентификатору. Элемент это просто другое название для тега или узла в DOM. И поэтому получить элемент, ID "имя" означает this-- вот мой HTML. И на основе этого HTML, то, что узел или что HTML-теги это я собирается программно быть переданы по телефону document.getElementById? 

Да, именно. Я иду, чтобы получить вход элемент существует, чей идентификатор "имя." Так в частности, вы можете думаю, этой функции, getElementById, как способ дать резервное указатель на этот конкретный узел в дереве. Мы не тянет это дерево, но это способ получения доступа к, что прямоугольник или прямоугольник, что по уникальной идентификации его с помощью своей ID. 

Теперь, почему это полезно? Ну, это оказывается что как только вы получили что узел, что прямоугольник из картина, что узел внутри него, в свою очередь, имеет целый букет пары properties-- ключ-значение или данные, одна из которых называется значение. Так буквально, это добро из рот, чтобы объяснить все это. Но в конце дня, все это делает, это дать вам строка, что пользователь ввел в в этом иерархическом порядке. Но я не люблю пара из этих вещей. Или, скорее, есть некоторые любопытство еще. Все, что казалось, на работу. Почему вы думаете, я вернулся ложно после вызова приветствовать? Это выглядит немного некрасиво, что У меня есть два заявления разделенных точкой с запятой. Угадай. Если я удалил вернуться ложным, то, что может произойти, только инстинктивно? К сожалению, еще раз говорю? 

Откройте кучу Windows. Так, может быть, что-то потенциально как это будет происходить. Что еще? Может подать заявку где? Для той же странице. Так, в самом деле, это, что ближе ответить здесь, хотя в отличие от в прошлом, я не указано атрибут действия, которые, как правило, мы должны сделать. Оказывается есть по умолчанию. Если вы не укажете действия, это, как говорят цитату, конец цитаты или название самого файла, который в этом случае будет быть как Дом-0.html. Это просто какая-то вывод, или, скорее, подразумевается. 

И поэтому, если я не делаю это, давайте замечать. Позвольте мне сохранить это. И я удалил возвращение ложное. Позвольте мне вернуться к этому примером и силой перезагрузить его. И вы могли видеть мне предложить это на CS50 Обсудить кучу раз. Если что-нибудь когда-либо действуя в стиле фанк и браузеру не ведет, как вы ожидаете, часто вы хотите провести Сдвиг и нажмите Обновить. Это заставит каждый файл, чтобы перезагрузить и не использовать локальный кэш браузера или копия, так что теперь, позвольте мне идти вперед и Открыть мой инспектор, перейдите на вкладку Сеть. Я собираюсь нажмите Заповедник Вход потому что я не хочу, чтобы удалить строки Как только я получу увезли в другом месте. 

Позвольте мне идти вперед здесь и введите Andi, нажмите кнопку Отправить. Все в порядке. Это, кажется, как и ожидалось. Он говорит: "привет, Энди." Позвольте мне нажмите кнопку ОК. Интересно. Обратите внимание, что страница изменилась, хотя на исходную страницу. Обратите внимание на URL вид изменился. Он добавил, вопросительный знак, который обычно является показателем что мы пытались представить что-то. И тогда на дне, еще более явно, здесь актуален запрос HTTP, который получил ответ, что 200 привел меня сюда. 

Так что это не то, что мы хотим сделать, правильно? Потому что я не хочу перезагрузить всю страницу. Я вместо хотел вернуться ложно таким образом, чтобы короткое замыкание поведение по умолчанию браузера, который было, конечно, представить страницу. 

Итак, давайте взглянем на незначительно лучше пример. Это дом версия одного. И обратите внимание на следующее. Это нормально, если вы не обращал внимания все строк кода. Но то, что в корне отличается о реализации этого? Я оговорить это ведет себя то же самое, делает то же самое. Что я, очевидно, сделали по-другому? Да? 

АУДИТОРИЯ: [неразборчиво]. Дэвид Малан: Да. Таким образом, функция определена differently-- другими словами, отсутствующих из формы, там на линии 7-- или не достаточно, линия 8-- больше не я имею onsubmit атрибут. В предыдущем примере, я должен был это. А потом я буквально написал свою код здесь. И тогда я сказал вернуться ложным. И если это не тереть Вы неправильно все же, она должна начать постольку а, как и в HTML, когда мы начали сотрудничать пообщаться его с CSS в атрибуты стиля, он просто начал получать немного грязный или чувствовать себя немного неправильно. 

Аналогично здесь, если Вы начнете принимать HTML, и затем вы автоматически хлопнуть код JavaScript в середине строки в кавычках, это не будет очень сопровождении. Правильно? Это даже не очевидно на первый место, где код JavaScript, есть. Так что было бы действительно хорошо, как принцип лучшего дизайна, давайте держать наш HTML полностью отделить от нашей JavaScript. 

Таким образом, чтобы сделать это, то, что мы сделать вот following-- мы просто используем HTML для разметки только. И так в версии из этого, все У меня есть форма с уникальным идентификатором. А потом сюда, я, пользуясь специальной особенностью JavaScript в результате чего я могу иметь то, что называется анонимной функцией. Так что получается, что если я буду называть document.getElementById из "демо" это как давать мне указатель этот узел в моем дереве, элемент формы, так сказать. 

Теперь, я просто знаю, от зная немного HTML Теперь мы, прочитав некоторые онлайн справочник, что элемент формы поддерживает целая куча listeners-- событий в Другими словами, список прачечная события слушатели, которые мы видели минуту назад. Я знаю, от чтения документации что onsubmit является действительным событием слушатель для элемента формы. 

Поэтому, как только я знаю, что, это безопасно для меня, чтобы сделать following-- получить этот узел из дерева, элемент формы, и получить доступ к так называемым onsubmit собственности. Таким образом, точка просто означает, это свойство, как особую ценность внутри него. И то, что тип данных это я назначение, по-видимому, чтобы onsubmit, что эффективно переменная внутри этого узла в дереве? Это поле внутри этой структуры. Что тип данных? 

Функция, да. Так что получается, что PHP имеет это. И хотя мы не сказать вам об этом, С также имеет указатели на функции, в способность передавать и назначить функции а сами значений переменных. И мы не собираемся регрессировать назад к C. Но сейчас, оказывается, что на правой стороне здесь, даже если это выглядит немного фанки, это означает, эй-браузер, дать мне функции. Я не собираюсь даже беспокоиться давая это имя, потому что я буквально я собирается назначить давайте называть его адрес этой функции немедленно onsubmit. Другими словами, браузер, вам не нужно знать, что называется эта функция. Вам просто нужно знать, где он находится в памяти. И так достаточно просто есть знак равенства есть и не беспокоить назвав это, как Foo или приветствовать или любое другое слово. А теперь это просто стилистическая вещь. Я мог бы переместить эту фигурную скобку на the-- sorry-- следующей строке как мы обычно делаем CS50. Но в JavaScript, это на самом деле стилистически общего просто держать фигурную скобку, то Первый, на этой первой линии. 

Но далее, есть ничего интересного. Это открытая фигурная скобка только разграничивает начало моей функции. Функция теперь идентичны, за исключением меня есть включены вернуться ложным внутри этой функции. Потому что получается out-- и вы бы только знаю, что это от чтения documentation-- что если функции, что вы назначаете к onsubmit обработчик возвращает ложь, браузер просто знает и соглашается с тем, не представлять форму на сервер. Если она возвращает правда, она представит это к серверу по причинам, которые мы увидим полезны в минуту. 

А потом, после запятой фигурная скобка есть только означает, что я сделано определении функции. Вы знаете, что, как только позвонить как вы слышите представление. Все в порядке. Это по-прежнему возможно вид некрасиво. Так что еще мы можем сделать? 

Ну, это оказывается то в второй версии, которая является last-- и мы просто взгляд на это. На риск принятия это уродливее, оказывается что есть библиотека мир называется JQuery. И JQuery это супер Библиотека JavaScript популярным это так популярны, что большинство любой JavaScript-- это не редкость для людей, чтобы запутать JQuery с JavaScript. Зачем? Сам JavaScript имеет очень многословные способы ведения things-- document.getElementById, dadadadadada. Вы в конечном итоге, очень длинные строки кода. 

Таким образом, человек по имени Джон Resid, кто на самом деле работает на старте до этих дней, вышел с этой библиотекой лет назад, что многие люди внесли свой вклад чтобы назвать JQuery, который изменяет синтаксис следующим образом. И только так вы видели это, потому что вы будете неизменно увидеть это, если делать Окончательный проект веб-интерфейсом, это было бы равносильно способ реализации этой же функции, используя это специальная библиотека. 

Теперь, вместо дразнить это друг от друга в полном объеме, давайте просто посмотрим на некоторые образцы. Этот синтаксис, кажется, есть сколько анонимные функции или безымянные функции или лямбда-функции AKA? Во-вторых, не так ли? И вы знаете, что, даже если Вы не супер удобные с этим, просто тот факт, что говорит функция () дважды. 

И получается, что то, что этот код doing-- и мы будем ссылаться на интернет-ссылок, в конечном счете, по какой-то помощь в этом. Это просто означает, что, когда документ готов, идти вперед и зарегистрироваться следующая функция как представить обработчике HTML элемент, уникальная идея является демо. А потом, когда это произойдет, называть эти две строки кода. И это, к сожалению, более подробный способ сказать вернуться ложным. И мы говорили об этом только потому, что Вы увидите код, как это онлайн. И это ничего не пугайтесь. Но вместо того, имейте в виду, что то, что будет распространен в JavaScript это парадигма. И вот почему мы показываем его сейчас. Все в порядке. Так, не останавливаясь слишком много на этом синтаксисе, есть ли какие-либо вопросы по эти примеры и идеи до сих пор? Все в порядке. Итак, давайте использовать это для чего-то полезного. Создание веб-страницы, просто говорит привет, так и так не все, что интересно, не underwhelm. Этот не собирается быть красивым, но это будет делать что-то полезное. Позвольте мне вернуться к моей директории здесь и открыть, допустим, форма-0.html. 

Итак, пусть это первокурсник очный спортивные странице регистрации без CSS или каком-то смысле дизайна. И я хочу, чтобы идти вперед и Зарегистрируйтесь здесь с паролем. И я собираюсь согласиться с условиями и условия и нажмите Register. И теперь веб-сайт говорит, "Вы зарегистрировано! (Ну не совсем.)" Это кажется, что это работает, но позвольте мне идти вперед и заставить перезагрузки. 

И позвольте мне сказать, нет, вы не нужен мой фактический адрес электронной почты. Или, может быть, мы просто скажем, почту там. Пароль будет, как, 12345. А потом, только потому, что я идиот, теперь это 123456789. И я не собираюсь, чтобы проверить вашу коробку. 

Хм. Все в порядке. Так что несколько возможностей для улучшения здесь. И вы знаете, или будет увидеть в PSET семь, что вы можете написать code-- и вы будете иметь, чтобы написать код в PHP-- защищать против этих видов пользователя ошибки, потому что пользователь явно не сотрудничает. И он или она не дала вам все ценит вы хотели или даже в формате что вы хотели их. Таким образом, вы увидите в PSET семь, что мы могли бы, конечно, есть некоторые если условия, которые говорят Если адрес электронной почты не username@something.edu, Мы могли бы просто сказать, извините, и извиниться перед пользователем много, как вы могли бы быть в PSET семь. Или, если они не проверили эту коробку, Оказывается в PHP, вы можете обнаружить, что, слишком. И, конечно, если пароли не совпадают, как в register.php для PSET семь, вы можете обнаружить, что. Но это боль в шея, что сейчас они просят нам пройти весь путь к серверу. Пользователь информируется об ошибке. И по крайней мере, если вы не используете некоторые причудливые методы, теперь у них есть, чтобы нажать стрелку назад. Не было бы приятно, как много веб-сайтов сегодня, если у вас более непосредственное обратная связь мгновенно? 

Другими словами, позвольте мне перейти к версии Один из них, который собирается быть не красивее. Но у него есть эта функция. Малан, 12345, 123456789, не собирается флажок, зарегистрируйтесь. Пароли не совпадают. Таким образом, даже если это всплывающее окно ugly-- мы можем заменить это в конечном итоге что-то вроде Bootstrap, который вы увидите в PSET семь является очень популярным library-- я обнаружить, что пароли не совпадают. Все в порядке. Ну, позвольте мне исправить как пользователь. Позвольте мне идти вперед и сказать, 12345 12345. Тем не менее, не проверяя соглашение. Вы должны согласиться на сроки и условия. Тогда почему? 

Если мы уже положено что есть способ, и мы обязаны вам в PSET семь обнаружить ошибку Условия, как это серверный, почему я должен утруждать также делать это в JavaScript? Что такое аргумент в услуга добавления, что Вы собираетесь, чтобы увидеть, как some-- есть дополнительная сложность. 

Может быть, нет ног. Что бы это могло быть? АУДИТОРИЯ: [неразборчиво]. Дэвид Малан: О, интересно. Потенциальные подвиги. Так, что, если вы не обрабатывает неправильный ввод пользователя, что большой, может быть, это все лучше, если это даже не достичь ваш сервер. Я бы отодвинуть там и скажем, вы должны, вероятно, решить обе эти проблемы. Но это справедливо. Что еще? 

АУДИТОРИЯ: [неразборчиво]. 

Дэвид Малан: Да. Этот код, как мы уже говорили раньше, интерпретируются на стороне клиента. Это не беспокоит сервер, что означает, что не повлиять нагрузку сервера или пропускную способность. А теперь, для маленькой старой меня, это не имеет никакого значимого влияния потому что у меня один пользователь прямо сейчас. 

Но если вы любой сайт приличного размера, особенно большой, как Facebook, тем больше вы можете держать людей от вашего сервера лучше потому сервере, конечно, имеет только конечное количество оперативной памяти, конечное число гигагерц, конечное число вещей он может сделать в единицу времени. Так что, если есть больше людей в мир удара сервер, случайно регистрации неправильно, как хорошо, если вы может сохранить эту нагрузку сервере. Кроме того, особенно на подвижной device-- если вы когда-либо войти в my.harvard или NetID Йельского и т.п., там это задержка с большим количеством сайты, как то, благодаря чему он занимает, как, чертовски секунду или две, иногда. А потом, мой Бог, если вы ошиблись при вводе, то вы должны нанести ответный удар и переделывать. Так что задержка, особенно на медленных сетевых подключений. Но в JavaScript, потому что он работает на клиента и не нужно идти вперед и назад по потенциально медленным интернетом подключение, вы можете получить мгновенная обратная связь почти. 

Итак, давайте посмотрим на это. Позвольте мне открыть форма-0 и посмотреть на HTML здесь. И давайте посмотрим, что происходит. Это форма которого действие register.php. Я только с помощью получить так что я мог увидеть адрес. Но для паролей, мы, безусловно, хотим чтобы изменить это, чтобы создавать в реальности. Вот поле ввода типа текста. Вот еще один вход поле типа пароля. Вот, если вы никогда не видели, вход типа флажок. 

Но нет JavaScript здесь вообще. Это только HTML, что идет register.php. Но в версии одной, где я начал получать эти всплывающие окна, давайте посмотрим, что на самом деле здесь происходит. В версии одного, то, что Я собираюсь see-- I Я думал, может парализовать достаточно с достаточно слов, но я выбежал. 

В версии одно-- мы идем. В версии одной, обратите внимание на following-- и не лучшая реализация, но это мой первый. Обратите внимание, что ниже Форма, у меня есть сценарий тег. И сценарий тег означает, эй, браузер, вот приходит код в, обычно JavaScript. А теперь обратите внимание, что я делаю. На line-- я могу едва прочитать it-- линии 32, он говорит, вар form-- так что дайте мне переменная называется форма. А потом получить document.getElementId из "регистрации". Что это? Ну, позвольте мне назад здесь. И заметьте, ах, я дал вид элемента произвольная, но описательный идея регистрации. Так что это дает мне переменная, позволяет мне захватить этот узел, что прямоугольник в дереве называется форму. form.onsubmit средства, эй-браузер, регистрации прослушивателя события в этой форме. Другими словами, когда эта форма представлены, выполнить следующий код. Это не нужно, потому что имя почему вы должны знать имя? Вам просто нужно знать, что для выполнения, следовательно это анонимный или лямбда функции. И, что функция все из этих строк здесь. И теперь, чтобы быть честным, даже если вы возможно, не когда-либо написанных JavaScript прежде, это просто С и PHP логика. Так что, если form.email.value == "" - так что если поле пустым электронная почта, кричать на пользователя с "Вы должны свой адрес электронной почты ". Иначе, если form.password.value пустой крик у пользователя, "Вы должны указать свой пароль." 

Более интересно логически, если form.password.value не равно form.confirmation.value-- куда подтверждение пришли? Позвольте мне назад. Ну, я назвал этот вход поле здесь пароль. И я назвал этот здесь подтверждение. Я мог бы назвать его пароль два или что-нибудь еще. Я просто логически проверки что эти два являются одинаковыми. Else-- оказывается, что это г-н Буль again-- логическое значение, флажок. Так что, если я говорю, восклицательный point-- если не form.agreement.checked, кричать на пользователя, а также. 

Так этот синтаксис вы видите очень распространены в JavaScript, где у вас есть этот точками. Вы начинаете с объекта здесь. Вы нырять глубже, чтобы к свойство, как пароль. И тогда вы получите на его фактической стоимости. И снова, здесь вход. Вот это имя пароль. И его значение независимо от человек на самом деле набрали в. 

Так во всех из них случаи, я вернулся ложными. Но если нет, я вернусь правда. И вот теперь мы видим убедительным использование при Вы вернется ложным остановить то, что делает пользователя и сделать его или ее выбор снова или введите еще раз. В противном случае, мы возвращаемся правда. 

И позвольте мне представить одного Другой вариант это просто чтобы семя его некоторое понимание. Ну, в версии 2 этого форм-2-- Я сделаю это с взмахом руки. Это для тех, любопытно, версия JQuery, тех из вас, кто хотел бы плескаться в этой конкретной библиотеке. Но давайте start-- и любые вопросы? Позвольте мне остановиться на мгновение, потому что Это было быстро и много. 

Но хорошая вещь здесь является то, что все кода в значительной степени то же самое. Новый материал, что является дом? Каковы эти прямоугольники? Каковы эти узлы? Что такое анонимные функции? Что такое обработчик события? Но, к счастью, большинство того, что это просто полный круг, скажем, нулевой неделе. Все в порядке. Так что-то немного более интересным? Ну, в первую очередь, позвольте мне перейти вперед и открыть Google Maps. И вы заметите, что для момент, на долю секунды, заметить, что происходит, когда Я нажмите достаточно быстро. И эта связь в Гарварде так быстро, что вы даже не замечаете его. Но то, что вы вроде как бы увидеть если я нажмите и перетащите очень быстро? Те из вас просмотра онлайн, если вы замедлить это скорость 0,5 ×, Вы можете увидеть это лучше. 

Что происходит просто прежде, чем я нажал и тащили? Позвольте мне попытаться here-- сделаем что-то еще, как 90210. Давайте далеко. Это было очень быстро, слишком. Как насчет Disney World? Там мы идем. ХОРОШО. Что вы видите на доли секунды? Просто, как, квадратов, верно? Заполнители для плитки? 

Ну, что тут происходит? Google Maps является хорошим примером эта технология, что называется AJAX. И это, где мы начнем использовать JavaScript в частности заманчиво путь. Назад в день, было Этот сайт называется MapQuest. И я должен был принято Скриншот этого из 1990-х годов, где, если вы хотите, чтобы искать здесь, на карте, Вы буквально нажмите стрелку наверху, что показал вам, другой квадрат карте. Если вы хотите, чтобы двигаться влево, вы нажал стрелку, который показал вам другой квадрат карте. А некоторые веб-сайты до сих пор это сегодня. Но даже MapQuest получил лучше, как Google Maps. 

Вместо того, что лучше них дни сайты, использующие AJAX. AJAX-- иначе известный как Асинхронный JavaScript и XML и которая является просто причудливый способ сказать технология или метод, который позволяет, используя браузер JavaScript сделать дополнительные запросы HTTP после страница была загружена. Итак, что же это значит? Ну, это было бы своего рода раздражает в Gmail если каждый раз, вы хотели проверять почту, Вы буквально ударил управления R или- Команда-R или нажмите кнопку Reload и страница целом штопать бы перезагрузить. Правильно? Было бы мигать белым вероятно, секунду. Вы бы видели глупые индикатор. И просто чтобы посмотреть, если у вас есть новый почта, вся веб-страница и URL Вы находитесь на придется перезагрузить. 

Но это не то, что происходит в Gmail. Правильно? Когда вы получаете новую электронную почту в Gmail, то, что происходит на экране? Это просто показывает, вверх, вправо? Это просто волшебно появляется как новой строки в таблице. Это на самом деле вовлекает приличное количество сложности. В самом деле, если вы думаете об этом дереве, которые, хотя является простым здесь, Gmail--, и я должен смотреть на код, чтобы быть sure-- вероятно, имеет HTML таблицу или, может быть, неупорядоченный список, что делает каждого из ваших почтовых ящиках письма как. 

И поэтому, если вы себе это есть это дерево в памяти, когда вы с помощью Gmail, который выглядит вид рода как это, когда Google понимает, ох, у вас есть новое сообщение электронной почты, это не хочу, чтобы восстановить все дерево. Скорее всего, он хочет, чтобы найти узел в дерево, которое представляет ваш почтовый ящик и просто вставить новый узел. 

Так очень похож на Pset пять, где вы пришлось вставить узлы в хэш-таблицу, аналогично делает Google, с помощью Код JavaScript, что он написал, траверс этого дерева, выяснить, где является то, что входящие в состав окна, а затем вставить новую строку. И новая строка просто означает одно или более новые узлы в дереве. 

И так AJAX эта техника что позволяет именно это. После того как вы посетили URL, Однако с ума долго это, и после того, как страница имеет был загружен, вы все еще можете захватить больше данных из internet-- ли это по электронной почте или плитка из map-- схватить его за кулисами а затем вставьте его в страницу таким образом, что человек на самом деле не должны ждать. 

Facebook Посланник работает точно так же. Любое количество другой websites-- ой, на самом деле, даже это. Я имею в виду, это, честно говоря, вид раздражает особенность в эти дни. Если я начинаю поиск cats-- это это своего рода ужасной пользовательского опыта. Это просто начинает искать для меня. Ну то, что он делает? URL-адрес действительно не изменился так как я начал печатать. Но то, что происходит поперек wire-- ОК, хм интересно. Что происходит поперек провода здесь просто получает более странным. 

ХОРОШО. Итак, позвольте мне идти вперед и проверить элемент и перейдите на вкладку Network и попытаться сделать это техническая и меньше о кошках. Поскольку я печатаю, в буквальном смысле, кошки и-- что происходит per-- Я не собираюсь нажмите что. Все в порядке. Так здесь, что происходит каждый раз я введите символ, по-видимому? Как, низкий уровень? То, что происходит с каждым из тех, символы я печатаю на клавиатуре? Да? АУДИТОРИЯ: [неразборчиво]. 

Дэвид Малан: Точно. Каждый из этих символов собирается Google, по одному. Они строят строку на своем сервере, который представляет все, что я набрал в до сих пор. И каждый раз, когда я типа еще один персонаж, они использовать их секретный соус из Алгоритм поиска и выяснить, он имел в виду эту страницу кошки или эту страницу кошка или т.п.? Таким образом, в некотором смысле, это дает мне с лучше опыт, что я даже не нужно завершить свою мысль. И в самом деле, это полезный вещь, автозаполнение в целом. Если их алгоритмы достаточно хорошо и если мои поиски достаточно очевидно, Я не придется набирать целое слово. Они собираются, чтобы сказать мне, что это является на самом деле я искал. Так что Google называет мгновенно Поиск только с помощью AJAX, с помощью кода, который позволяет им запрашивать дополнительный контент через веб-браузер за кулисами с использованием этого Новый язык, JavaScript. Итак, мы имеем пару минут осталось. И позвольте мне вызвать моего приятеля Колтон на сцену, так казалось Особенно весело в последний раз ввести технологию что некоторые из вас выразили заинтересованность в окончательных проектов. Мы думали, что это будет весело, чтобы принести до добровольцем, хотя, сегодня чтобы показать вам дополнение к это позволяет, что you-- да, Я видел эту руку первым. Давай до. Очень хорошо сделано. Отличная работа. Я собираюсь этого проекта на экран в минуту. Ваше имя для всех? 

ОДВ: Я Эфа. 

Дэвид Малан: этанольн? 

ОДВ: Эфа. 

Дэвид Малан: Эфа? 

ОДВ: Да. 

Дэвид Малан: Приятно видеть вас. Все в порядке. Позвольте мне получить это готовы. Приходите к посередине с Колтон здесь. Что Колтон имеет в своих руках сегодня пульт дистанционного управления. Таким образом, вместо просто стоять там в трехмерный мир оглядываясь как это сделал Колтон, теперь Эфа может на самом деле ходить, поднимаясь, вниз, влево и вправо, как у Nintendo или Xbox контроллер. ОДВ: Я собираюсь падать на сцену. Дэвид Малан: я буду стоять примерно здесь. Но это риск. ХОРОШО. Так что вперед и положить на тех,. Позвольте мне идти вперед и перейти к экрану здесь. Позвольте мне тусклый свет. И Колтон, позвольте мне прийти стенд рядом с вами. 

Вы хотите, чтобы объяснить здесь с микрофоном, что мы делаем? Ну вот. 

Колтон: Конечно. Так что сейчас мы погрузка на Окулус, Я думаю, operating-- не работает системы, но основная программа, где Вы можете получить доступ все игры и приложения, которые находятся в вашей библиотеке. Так что сейчас, он должен сказать тачпэду начать. Сенсорная панель будет на правая сторона гарнитуры. Так что вперед и tap-- ОДВ: О, человек. Дэвид Малан: Да, там вы идете. Качество Эфа видит гораздо более высокое качество. Это только Wi-Fi здесь. Колтон: Так что вы собирается хотеть сделать это посмотреть в сторону верхней правой части экрана. Да, это игра на очень верхнем правом углу. А потом, когда вы выбираете это, тачпэду снова. Я думаю, что его Dreadhalls. А потом здесь A-- здесь, пусть мне держать ваши очки для вас. 

Так что я просто дал ему контроллер. Так что теперь он может контролировать игру. Он может передвигаться и тому подобное. Так идут вперед и смотрят на вершине. Вы должны увидеть новую игру. Так что вперед, и вы можете сделать это. Теперь, вы должны быть в состоянии контролировать самостоятельно с контроллером, а также, как только игра загружает здесь. Это может быть немного страшно. 

ОДВ: Теперь вы скажите мне. ХОРОШО. 

Колтон: Ладно. Так подтвердить, что вы можете передвигаться. ХОРОШО. Вы можете передвигаться. Отлично. Так что, если вы посмотрите вниз, у вас есть карта. Карта показывает вам, где вы находитесь. Вы можете посмотреть вокруг комнаты. Вы можете полностью развернуться. Да, именно. Обернись. 

Так что смотрите на ваш слева. Я думаю, что есть что-то вы можете забрать на бочке в комнате. 

ОДВ: Как я могу получить наметить пути? Колтон: Посмотрите. Просто посмотрите вверх. Все в порядке. Там вы идете. Теперь идти вперед и просто развернуться. Так что смотрите дальше налево. Продолжайте двигаться влево. Продолжайте смотреть налево. Продолжать. Да. 

ОДВ: О, это так. 

Колтон: Да. Подойдите к нему с контроллером. Там вы идете. Теперь он должен сказать забрать его. Там вы идете. Возьмите его. Все в порядке. Теперь, давайте выйти из этой комнаты. Идите вперед и идти к той двери. Таким образом, вы будете hold-- он говорит удерживайте кнопку, чтобы заставить его открытым. Так что вперед и удерживайте кнопку. Да, заставляя его открыть. Все в порядке. Отличная работа. Теперь мы идем из комнаты. Так что я собираюсь оставить остальные до Вам и видеть то, что вы узнали. ОДВ: Я не собираюсь в темной комнате. Ой, подождите. Теперь я должен идти по темному коридору? ОК, я собираюсь обратно [неразборчиво]. Колтон: Ладно. Некоторые другие элементы, чтобы забрать. Похоже, несколько монет. Это отмычку. Так что, если вы найдете запертый дверь, вы можете использовать. Ты боишься? 

ОДВ: Пока нет. Колтон: ОК. 

Pretend-- да. Просто вид вы на самом деле стоял. И если вы включите around-- Вы должны привыкнуть к нему. Но это имеет смысл. Дэвид Малан: И в то время Эфа продолжает играть, так как мы могли бы сделать это в течение всего дня, мы все можем цыпочках здесь. Но у нас есть два других пар, если вы хотите, чтобы подойти и играть. В противном случае, мы увидим вы в следующий среду. Спасибо нашему добровольцем сегодня. [Аплодисменты] 

[МУЗЫКА - "Seinfeld ТЕМА"] СПИКЕР 1: Ну, я положить новый PL смонтировать на. Я только что изменил OLPF-- 

СПИКЕР 2: Так что именно вы делаете? 

СПИКЕР 1: Ну, каждый из these-- здесь, я покажу вам этот здесь. Вы можете видеть это прямо здесь. 

СПИКЕР 3: я думаю, что я хорошо с этим. Ты хочешь еще? 

СПИКЕР 4: Нет, я хорошо. [Неразборчиво]. 

СПИКЕР 3: Нет, [неразборчиво]. Есть немного. СПИКЕР 1: Различные цвета. СПИКЕР 2: ОК. СПИКЕР 1: Так в конечном счете то, что его делает это регулирует цвет of--