Программирование роботов . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 279
Программирование звука . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 279
Программирование игр . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 279
Обмен кодом с помощью JSFiddle . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 280
ГЛОССАРИЙ . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 281
ОБ АВТОРЕ . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 286
БЛАГОДАРНОСТИ . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 287
Посвящается Филли
(и Оладушку)
В В Е Д Е Н И Е
Эта книга научит вас писать программы на JavaScript — одном из попу-
лярных языков программирования. А освоив язык программирования,
вы станете программистом — человеком, который не просто пользуется
компьютерами, а управляет ими. Научившись программированию, вы
сможете вертеть компьютерами как хотите, и они всегда будут послушно
следовать вашим указаниям.
Изучить именно JavaScript — отличная идея, потому что этот язык
используется повсюду. Его поддерживают браузеры Chrome, Firefox
и Internet Explorer. Возможности JavaScript позволяют программистам
делать из обычных веб-страниц полноценные интерактивные приложе-
ния и видеоигры. Но это еще не все: JavaScript также работает на интер-
нет-серверах и даже может использоваться для управления роботами
и другими устройствами.
Для кого эта книга?
Эта книга предназначена для всех, кто хочет изучить именно JavaScript
или же просто начать программировать с нуля. Она написана для детей,
но может стать первым самоучителем по программированию для человека
любого возраста.
Работая с книгой, вы будете постепенно узнавать новое, закреплять
прочитанное и двигаться дальше и дальше. Начав с простых типов
данных, вы перейдете к более сложным, по пути освоив управляющие
конструкции и функции. После этого вы научитесь писать код, реаги-
рующий на перемещения мышки или нажатия клавиш, и наконец позна-
комитесь с элементом canvas, который позволяет создавать рисунки
и анимации — любые, какие только пожелаете!
11
Как читать эту книгу
Самое главное, читайте по порядку! Может быть, этот совет звучит
странно, однако нередко людям не терпится сразу перейти к чему-нибудь
занимательному, например к созданию игр. Но поверьте — вам будет
гораздо проще создать игру, если вы все-таки будете читать с начала,
глава за главой, так как каждый новый раздел основывается на материа ле
предыдущих.
Языки программирования похожи на обычные языки. Вы, наверное,
знаете — чтобы овладеть языком, нужно выучить грамматику и запом-
нить достаточно много слов. Это требует времени. Это же правило рабо-
тает и с JavaScript — чтобы научиться пользоваться этим языком, нужно
постоянно исследовать код и писать на нем программы. По мере того
как вы будете писать больше и больше, вы обнаружите, что пользуетесь
командами все более естественно, и в конце концов сможете свободно
выражать свои мысли в коде.
Я настоятельно рекомендую тестировать примеры кода по мере чте-
ния книги. Если вам не до конца понятно, как код работает, попробуйте
вносить в него небольшие изменения и смотреть, как изменится резуль-
тат. Если же ваши правки не приводят к ожидаемому эффекту, постарай-
тесь выяснить, почему это происходит.
Обязательно выполняйте задания из разделов «Попробуйте сами»
и «Упражнения». Вводить в компьютер код из книги — отличное начало,
но по-настоящему вы станете понимать программирование только
тогда, когда начнете писать собственный код. Если задания покажутся
вам интересными, не останавливайтесь! Придумывайте свои задачи
по усовершенствованию написанных вами программ.
Вы можете найти примеры выполнения заданий и исходный код
игр по адресу www.nostarch.com/javascriptforkids или на странице книги
на сайте www.mann-ivanov-ferber.ru. Постарайтесь заглядывать в решения
лишь после того, как выполните задания, чтобы сравнить свой подход
с моим. И только если вы зашли в тупик, обратитесь за подсказкой. Однако
помните, что это лишь варианты решения — в JavaScript существует мно-
жество способов выполнить одну и ту же задачу, так что не беспокойтесь,
если ваше решение получится совсем не похожим на мое.
Если вы встретите слово, значение которого не понимаете, загляните
в глоссарий в конце книги.
Что вас ждет?
Глава 1 содержит краткое введение в JavaScript. Кроме того, вы узна-
ете, как писать код в консоли Google Chrome.
Глава 2 расскажет про переменные и основные типы данных
в JavaScript: числа, строки и булевы значения.
12 Введение
Глава 3 посвящена массивам, предназначенным для хранения набо-
ров других элементов данных.
Глава 4 расскажет об объектах, содержащих пары «ключ-значение».
Глава 5 — это введение в HTML, язык для создания веб-страниц.
Глава 6 научит, как управлять выполнением кода с помощью кон-
струкций if, циклов for и других структур.
Глава 7 покажет, как на основе изученного материала создать про-
стую игру на отгадывание слов — «Виселицу».
Глава 8 научит писать собственные функции, что позволит группи-
ровать фрагменты кода и использовать их повторно.
Глава 9 — это введение в jQuery, инструмент, облегчающий управле-
ние веб-страницами из JavaScript-кода.
Глава 10 научит, как использовать таймеры, интервалы и обработ-
чики событий, делая код более интерактивным.
Глава 11 использует функции, jQuery и обработчики событий для
создания игры «Найди клад!».
Глава 12 научит элементам объектно-ориентированного про грам-
мирования.
Глава 13 расскажет об элементе canvas, позволяющем создавать
графические изображения на веб-страницах.
Глава 14 на основе способов анимации из главы 10 покажет, как соз-
давать анимации на «холсте» canvas,
тогда как
Глава 15 научит, как управлять этими анимациями с клавиатуры.
В главах 16 и 17 вы создадите полноценную игру «Змейка», исполь-
зуя все знания, полученные в предыдущих пятнадцати главах!
Послесловие подскажет, куда двигаться дальше при изучении
программирования.
Глоссарий даст определения множества новых слов, которые вам
встретятся.
Повеселитесь!
И еще один момент, о котором не стоит забывать: веселитесь! Про грам-
мирование может быть увлекательным, творческим занятием, как рисо-
вание или игры (а работая с книгой, вы изрядно порисуете и поиграете).
Как только вы научитесь программировать, для вас не будет иных пре-
град, кроме собственного воображения. Добро пожаловать в потряса-
ющий мир компьютерного программирования — и желаю вам отлично
провести время!
Ч АС Т Ь I
Основы
Ч АС Т Ь I
Ос
Осно
н в
о ы
в
1
Ч Т О ТА КО Е J AVA S C R I P T ?
Компьютеры — необычайно мощные машины, способные
делать потрясающие вещи. Например, они могут играть
в шахматы, обслуживать тысячи интернет-страничек и менее
чем за несколько секунд выполнять миллионы сложных
вычислений. Однако сами по себе компьютеры неразумны,
и делают они лишь то, что прикажут люди. Мы сообщаем
компьютерам, что нам от них нужно, с помощью наборов
инструкций, которые называются программами. Без про-
грамм компьютеры вообще ничего не умеют!
Знакомьтесь: JavaScript
Более того, компьютеры не знают ни английского, ни русского, ни других
естественных языков; и компьютерные программы создают на специ-
альных языках программирования. Одним из таких языков является
JavaScript. Даже если вы слышите про JavaScript впервые, вы опреде-
ленно заходили на сайты, которые его используют. Например, JavaScript
может управлять внешним видом странички или делать так, чтобы стра-
ница реагировала на нажатие клавиши или перемещение мышки.
Такие сайты, как Gmail, Facebook и Twitter, используют JavaScript для
облегчения работы с почтой, отправки комментариев или улучшения
навигации. К примеру, когда вы, читая в Twitter сообщения от @nostarch,
проматываете страничку вниз и видите все больше и больше сообщений,
это происходит благодаря JavaScript.
Чтобы понять, чем же так хорош JavaScript, достаточно посетить
несколько сайтов:
17
• JavaScript позволяет проигрывать музыку и создавать яркие визу-
альные эффекты. Например, вы можете полетать в интерактивном
видеоклипе от студии HelloEnjoy на песню Элли Голдинг Lights
(http://lights.helloenjoy.com/), рис. 1.1.
Рис. 1.1. В клипе Lights нужно управлять искрящимся курсором
• С помощью JavaScript можно создавать инструменты для творчества.
Patatap (http://www.patatap.com/) — это нечто вроде виртуальной
драм-машины, которая издает всевозможные шумы и звуки, а также
проигрывает забавные анимации, рис. 1.2.
Рис. 1.2. Зайдя на страничку Patatap, нажимайте на разные клавиши, чтобы услышать