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

ДАГ Lloyd: Итак, теперь мы старые профи на веб-программирования, верно? И мы рассмотрели несколько языки в отдельных видео. А теперь давайте сделаем еще один, JavaScript. 

Первая хорошая новость, JavaScript это современный программирования язык так же, как PHP, чьи Синтаксис является производным от C, так что это хорошее место, чтобы начать. Это примерно как старый, как PHP, а также, Существуя около 20 лет. Он был изобретен около в то же время, как PHP. И JavaScript на самом деле довольно основополагающее значение для пользовательского опыта в Интернете. На самом деле, есть трех языках, что я скажет рода составляют Пользователь опыт взаимодействия с веб-сайта, HTML, CSS, JavaScript, и. И вот теперь давайте поговорим Немного о JavaScript. 

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

Чтобы записать JavaScript, похожий на открытии копирование файла C с точкой C расширением или PHP файл с расширением точка PHP, все, что нужно сделать, это открыть файл с расширением файла точка JS. Мы не должны иметь какой-то особый разделители, как мы делали в PHP. Такого рода углом Кронштейн знак вопроса PHP что мы привыкли, что от пути, Мы говорим нашим браузер, что у нас есть, JavaScript является в том числе это в HTML тега, и мы увидим немного о как сделать, что через минуту. 

Другое дело, что делает JavaScript отличается, однако, является то, что он работает на стороне клиента. Так вспоминаю с PHP, что мы никогда не могли действительно увидеть РНР, что подчеркнул сайта. Если мы когда-либо рассматривал исходный код страницы, мы бы только посмотреть HTML, который был генерируемых этой PHP. Но в JavaScript работает на стороне клиента. Ваш JavaScript, работает на вашем компьютере. И вот почему вы можете сделать вещи, как добавить блокаторы. Правильно? Блокировка рекламы обычно делается убийство все JavaScript что работает на определенном сайте. И потому, что он должен запустить на клиентском компьютере стороне, вы можете просто остановить JavaScript для запуска полностью. Это также означает, что когда вы используете сайт, который включает в себя JavaScript, Вы должны отправить источник JavaScript Код, как часть вашего ответа HTTP клиенту, когда они запрашивают их. И поэтому вы можете не хотите использовать JavaScript сделать действительно чувствительные вещи как проходящего информации о паролях пользователей спине и вперед, потому что они на самом деле собирается получить весь исходный код, не только HTML, который генерируется, такие, как было бы в случае с скажем PHP. 

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

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

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

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

Так что я пошел вперед и открыл свой CS50 IDE и я уже запускать Apache чтобы начать мой сервер работает. И у меня есть этот файл открытое называется home.html. И я буду увеличивать немного здесь. И в принципе, вы можете видеть Home.html это просто куча кнопок. И я утверждая в верхней здесь что это раздел JavaScript материалы. Таким образом, есть куча кнопок здесь, но то, что эти кнопки на самом деле? 

Ну, мы направимся к моему IED, и я home.html открыть здесь. В самом начале, вот где я связывая во всех моих исходных файлов JavaScript. Правильно? Так что я anonymous.js, clock.js, Я использую атрибут источника в тег сценария, чтобы связать в файле. Так что я не написал ни JavaScript непосредственно в этом файле, но я вытащил во всех JavaScript я написал отдельно. И если мы прокрутите вниз здесь, это все должны выглядеть немного знакомы с немного нового синтаксиса. Мы имеем здесь тег заголовка для функции и затем кнопку. У меня есть входа, кнопка типа, и, видимо, когда я нажимаю его, Я собираюсь позвонить некоторым функция сигнала тревога дату. И это, как мы можем рода перепутать немного JavaScript и HTML. Они на самом деле играют довольно красиво вместе, и так, по-видимому, когда Я нажмите на эту кнопку, я собираюсь чтобы вызывать некоторые функции оповещения дату. И точно так же есть я определил поведения для всех других кнопок, которые находятся на этой странице home.html, которые мы будем держать возвращения чтобы в ходе этого видео. Но давайте вернемся на здесь и взглянуть в clock.js, который является Файл JavaScript, что я писал, что есть эта первая функция мы собираемся, чтобы взглянуть на. Как вы можете видеть, я начинаю свой JavaScript функционировать с функцией ключевых слов, и я дал этот имя, это называется оповещения Дата. Внутри есть, я, кажется, создать Новый локальная переменная называется текущая дата. И я собираюсь назначить равное на новую дату. И мы могли бы получить в много деталь, как к тому, что дата, и действительно настолько JavaScript большой, что мы не можем охватить все в одном видео. Но достаточно сказать, это будет вернуться к мне элемент данных, который инкапсулирует текущую дату и время. Я хранения, что в переменной, что я по-видимому, собирается предупредить текущую дату. 

Ну, то, что делает предупреждение текущая дата выглядит? Давайте взглянем на сам файл назад на в окне браузера. Итак, еще раз, это кнопка, что я связали с этой, по имени функции. И я нажмите его там и посмотрите, что он сделал, это насторожило. Это выскочил этот вид коробки, говоря что меня текущее время, по-видимому, это 4 ноября в 10:43:43 утра. И если я нажимаю его снова, теперь это спустя несколько секунд, верно? Так вот все это делает функция. Когда я нажимаю эту кнопку, его всплывает предупреждающее сообщение для меня. Так что на самом деле не слишком много, чтобы функции что отличается от PHP, просто немного нового синтаксиса который поставляется с работы с JavaScript. 

Массивы в JavaScript являются довольно проста. Чтобы объявить массив, вы используете синтаксис квадратных скобок что мы знакомы из PHP. И похоже на PHP, мы Также можно смешивать типы данных. Так что это массив, и из этих массивов будет совершенно законным JavaScript. Один вот и все целые числа, и один, что смешивают различные типы данных. 

Что-то очень разные в JavaScript, правда? Это понятие объекта. Так что, возможно, вы слышали о объектно-ориентированного программирования. Мы не делаем многое из этого в CS50, но мы сделаем немного о нем Здесь в контексте JavaScript. Теперь JavaScript имеет возможность вести себя как объектно-ориентированного программирования языком, но он сам не исключительно объектно-ориентированный язык программирования. И это снова приходит назад, почему я сказал, это может быть очень сложным, чтобы узнать JavaScript, как ваш первый программирования Язык, потому что это не действительно подходят конкретной парадигмы. 

С другой стороны это функциональный язык программирования. Если мы хотим, чтобы, функции вроде большого босса человека, верно? Они диктуют, что происходит все остальное. Мы хотим изменить переменные, мы называем функции. Мы делаем то, к функциям. Объекты вместо, В объектно-ориентированном языке, объекты вроде стать звездой и функции становятся своего рода вторичным. Но то, что является объектом, то, что это понятие объекта? Ну, если это поможет, думаю, Об этом на первого рода из, как структуры C или структуры что мы узнали прежде. В C, структура содержит число полей, и, возможно, сейчас мы могли бы начать называть эти свойства полей. Но свойства никогда действительно стоять на своих собственных, не так ли? Если я определить структуру для автомобиля как это со следующими двумя поля или свойства, один А.Н. число за год автомобиля и еще 10 символов Строка для модели автомобиля, Я могу сказать, что-то вроде этого, Я могу объявить новую переменную типа структура автомобиля Херби. И тогда я могу что-то сказать как herbie.year равна 1,963, и herbie.model равна Beetle. Ничего страшного. Я использую поля в контекст структуры, но я никогда не мог просто что-то вроде этого. Правильно? Я не могу использовать имя поля зависит от структуры. Это своего рода фундаментальной вещи. 

Так поля является основополагающее значение для структуры Си очень похожи на свойства бытия основополагающее значение для объектов JavaScript. Но то, что делает их Особенно интересно является то, что объекты могут также иметь что называются методы, которые действительно просто красивое слово для функций, которые присущи объекту, а также. Так что это функция, которая может быть только вызывается в контексте объекта. Только объект, который определил эта функция внутри ИТС, если вы думаете о структура, функция определяется в тех определении Фигурные скобки структуры. Так это значит только то что-то структуре. И это своего рода то, что мы делаем Здесь с объектами и методами. Это в основном, как мы определения функций, имеет смысл только на конкретный объект, и поэтому мы назвать это методом объекта. И мы никогда не можем назвать это Функция зависит от объекта, так же, как мы не можем сказать, год или модель зависит от структуры в С 

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

Вы также можете думать об объекте вроде как ассоциативный массив, который мы знакомы из PHP. Запомнить ассоциативный массив позволяет чтобы у нас пары ключ-значение, а не иметь индексов 0, один, два, три, и так далее, как мы привыкли с C массивы. Ассоциативные массивы можно сопоставить слова, например, в видео PHP, мы говорим о Начинка пиццы. И таким образом, мы имели массив называемые пиццы, и мы был сыр был ключ и $ 8.99 был значение, а затем пепперони был ключевым, $ 9.99 был значение, и так далее. И таким образом мы можем также подумать о объект рода похожи на ассоциативной массивом. И этот синтаксис здесь будет создавать новый объект называется Херби с двумя свойства внутри него. Год, который присваивается значение 1963, и модель, которая присваивается строка Жук. 

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

Так помним, как в PHP мы имели это понятие А для каждого цикла, что позволит нам перебрать все значения ключа пары ассоциативной Массив, потому что мы не имеют эту способность, чтобы перебирать через 0, один, два, три, четыре, и так далее? JavaScript имеет что-то очень похожее, но это не называется для каждого цикла, это называется по петлями. Так что, если я сказал мне, как Это, вар ключа в объекте, это своего рода похожи на говоря для каждого что-то как-то. Но все, что я делаю здесь итерации через все ключи моей объекта. И внутри фигурных скобки там, я бы использовать объект ключ квадратные скобки для обозначения к значению в этом ключевом месте. 

Кроме того, существует даже другой подход. Если я просто заботятся только о значения, я могу сказать, ключ объекта, и просто использовать ключ внутри. Таким образом, для вар ключа в объект, у меня есть использовать объект квадратные скобки Ключ внутри цикла. Для вар ключ объекта, я могу просто использовать ключ внутри цикла, потому что я просто специально говорить о ценностях там. 

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

ОК, так что мы сюда в моем окне браузера, и я собираюсь открыть до моих инструментов разработчика. Опять же, я просто нажимая F12 чтобы открыть инструменты разработчика. И заметьте, что здесь на топ я выбрал консоль. Так что это понятие из консоли разработчика, и это позволит нам печатать информацию из, вроде терминала, но как вы увидите чуть позже, мы также можем ввести информацию в взаимодействовать с нашей веб-странице. Я собираюсь увеличить немного здесь, и я собираюсь Теперь нажмите на для теста в. И четыре test-- Я не собираюсь показать вам код для него прямо сейчас, но вы получите его, если вы скачать исходный код, который связано с этой video-- Просто для петли в что мы видели только Секунду назад на слайде. 

Так что я собираюсь щелчок, который Кнопка и здесь, вот то, что печатается в Консоль, 0, один, два, три, четыре, пять, шесть. Я не печатать информацию внутри этих местах массива, потому что я использовал для в петле. И в теле цикла я просто распечатать ключ не приемлю ключ. Но если сейчас я очистить консоль, и я переключиться на для теста, и четыре из теста Я говорю, что использовать для петли вместо этого и распечатать ключ, если я нажму, что теперь я получаю фактические элементы внутри моего объекта или мой массив в этом случае. Мой массив дней недели. Я распечатал понедельник, Вторник Среда. Так что разница между а при в петле, которая выводит только ключи, если вы просто использовать ключ внутри тела цикла, и для петли, которая печатает из значений, если вы используете только Ключ внутри тела цикла. 

Ладно, как мы теперь начинаем конкатенации строк и, возможно, смешивать некоторые переменные с интерполяцией как мы были в состоянии сделать в PHP? Ну, мы довольно хорошо знакомы с этим из PHP. Это, как мы хотели бы сделать это с помощью точка оператор для объединения строк. В JavaScript, хотя, мы на самом деле использовать что-то называется плюс оператор, который это, может быть, даже немного больше интуитивно, не так ли? Мы добавляем кучу строк вместе. Итак, давайте голову обратно и увидеть, что это будет печатать, если мы пытаемся вывести вся информация в неделю массива. Все права, поэтому в здесь под конкатенации, У меня есть два варианта, строка здание V1 и затем строка здание V2. И мы увидим, почему мы нужно V2 в секунду. Но я собираюсь нажать на Строка здание V1, который это код, который мы были только взглянуть на, console.log со всеми плюсами. Давайте посмотрим, если печатается то, что мы ожидали. 

Понедельник день номер 01 недели, Вторник, день номер 11 в неделю. Ну, что я пытался там делать было получить это распечатать Понедельник, день номер Один из них, вторник день номер два. Но, похоже, я всегда печати одну. Ну, почему же? Ну, оказывается, еще раз взглянуть в этой маленькой фрагменте кода здесь. Обратите внимание, что мы используем плюс оператор в двух разных контекстах. 

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

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

Итак, давайте поговорим о функциях снова. Я обещал, что мы будет говорить о анонимного функции, и теперь контекст, что наконец, прибыл. Поэтому, прежде чем мы это сделаем, давайте снова говорить о массивах на секунду. Так массивы представляют собой особый Случай объекта. На самом деле, все в JavaScript на самом деле объект. Так функции являются Особый случай объекта, целые числа специальная случай объекта, но массивы специально имеют ряд методов. Помните, потому что они объектов, они могут иметь свойства и методы. Они имеют ряд методов, которые могут быть применены к этим объектам. Там это метод, называемый размер, array.size, которые будут возвращаться в Вы, как Вы могли бы ожидать количество элементов в массиве. array.pop, вроде как наше понятие появляются от стека, если вы помните, из нашего стеки видео, удаляет последний элемент из массива. Array.push добавляет новый элемент до конца массив. Array.shift является своего рода как DQ, это сращивания из самый первый элемент массива. 

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

Так что давайте, у нас есть этот массив целых чисел. Это называется НУМС, и он получил пять вещи в нем, один, два, три, четыре, 5. Теперь я хочу, чтобы отобразить некоторые Функция на этом массиве. Я хочу, чтобы функция применяется к каждому элементу массива. Ну, давайте скажем, что то, что я хочу, чтобы сделать, это просто в два раза все элементы. Что я мог сделать, это просто использовать цикл для вар я равна 0, я меньше или равно 4, я плюс, плюс, и затем дважды каждый номер. Но я также могу сделать что-то вроде этого. Я могу сказать, НУМС ранее был один два три четыре пять, Сейчас, однако, я бы хотел, чтобы вы применить отображение на этом массиве где я хотел бы вас удвоить каждый номер. И это именно то, то, что здесь происходит. Но заметьте, что я передаю в качестве аргумента для отображения. Это анонимная функция. И заметьте, я не дал эта функция имя, Я только дал ему список параметров. И так это пример из анонимной функции. 

Мы вообще никогда не назвал бы это функция вне контекста карте. Мы определяя его в качестве параметра на карту, и таким образом, мы действительно не должны иметь для него имя, если Единственное, что заботится о карте и это определяется право там внутри карты. И так это анонимная функция. Мы не смогли сделать это раньше. Карта некоторую функцию, что принимает один параметр, Num, и что, что делает функция является возвращается Мнимая раз 2. И так после этого Отображение был применен, это теперь какие Nums внешность как, два, четыре, шесть, восемь, 10. И мы будем трещать на мой окно браузера и просто Взгляни на это очень быстро, как хорошо. 

Так что у меня еще одну кнопку здесь в моей домашней странице называемое двойное. И когда я нажмите дважды, и он говорит мне, прежде чем он был один, два, три, четыре, пять через два, четыре, шесть, восемь, 10. И если я вернусь и нажмите дважды снова, два, четыре, шесть, восемь, 10. А после, четыре, восемь, 12, 16, а затем 20. И что я делаю в этой функции? Ну, если мы просто поп к IDE, и Я тяну мою анонимную функцию, здесь на линии семь через 13, я делать мало-мальски фантазии работу здесь, но я просто распечатав что в настоящее время в массиве. Затем в строке 16, 17, и 18, есть моя карта. Это где я применяю эту удвоение функция каждой элемента. А потом немного дальше вниз, Я просто делаю то же самое Я делал прежде, только теперь я распечатать содержимое массива после этого. Но все, что я сделал здесь просто использовать анонимную функцию на карту через весь массив. 

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

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

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

А потом вот все, что я делаю, распечатки trigger.innerhtml. Ну, в данном случае, в этом Контекст, trigger.innerhtml это то, что написано на кнопке. Просто так случилось, если прыгнуть назад на секунду, что бы быть то, что в период между этими тегами кнопки. Это будет одна кнопка или кнопка два. И давайте взглянем на как это событие будет обработчик смотреть, если у нас было это работает на практике. 

Итак, прежде всего, вы, открыли events.js, что файл JavaScript, где Я определил эту функцию. И как вы можете видеть, это в значительной степени именно то, что мы только что видели на слайде секунду назад. И я буду переходить к Главная страница мы использовали. А у меня вот кнопка одно и кнопку два. И я буду нажмите на кнопку один. Вы нажали на кнопку один, если вы можно увидеть прямо здесь, в боевой готовности. ХОРОШО. Нажмите на кнопку два, вам нажал на кнопку два. 

Таким образом, обе кнопки имеют Вызов же функция, верно? Они оба были начеку имя событие, но этот объект события который создается, когда мы нажимаем на он говорит нам, какая кнопка была нажата. Мы не должны написать два отдельных функции или сделка с наличием пройти любую дополнительную информацию. Мы просто полагаться на то, что JavaScript будет сделать для нас, что для создания, что Сортировать объекта события от нашего имени. Там очень много больше, чтобы JavaScript чем то, что мы рассмотрели в этом видео, но имеющие эти фундаментальное должно вам довольно длинные пути к обучение все, что вам нужно знать об этом интересный язык. Я Дуг Ллойд. Это CS50.