Академический Документы
Профессиональный Документы
Культура Документы
Выразительный JavaScript.
Современное веб-программирование
3-е издание
Серия «Для профессионалов»
Перевела с английского Е. Сандицкая
ББК 32.988.02-018
УДК 004.738.5
Хавербеке Марейн
Х12 Выразительный JavaScript. Современное веб-программирование. 3-е изд. — СПб.:
Питер, 2020. — 480 с.: ил. — (Серия «Для профессионалов»).
ISBN 978-5-4461-1226-5
«Выразительный JavaScript» позволит глубоко погрузиться в тему, научиться писать красивый и эффективный
код. Вы познакомитесь с синтаксисом, стрелочными и асинхронными функциями, итератором, шаблонными
строками и блочной областью видимости.
Марейн Хавербеке — практик. Получайте опыт и изучайте язык на множестве примеров, выполняя упражне-
ния и учебные проекты. Сначала вы познакомитесь со структурой языка JavaScript, управляющими структурами,
функциями и структурами данных, затем изучите обработку ошибок и исправление багов, модульность и асин-
хронное программирование, после чего перейдете к программированию браузеров.
Права на издание получены по соглашению с No Starch Press. Все права защищены. Никакая часть данной книги не
может быть воспроизведена в какой бы то ни было форме без письменного разрешения владельцев авторских прав.
Информация, содержащаяся в данной книге, получена из источников, рассматриваемых издательством как надежные.
Тем не менее, имея в виду возможные человеческие или технические ошибки, издательство не может гарантировать
абсолютную точность и полноту приводимых сведений и не несет ответственности за возможные ошибки, связанные с
использованием книги. Издательство не несет ответственности за доступность материалов, ссылки на которые вы мо-
жете найти в этой книге. На момент подготовки книги к изданию все ссылки на интернет-ресурсы были действующими.
Изготовлено в России. Изготовитель: ООО «Прогресс книга». Место нахождения и фактический адрес:
194044, Россия, г. Санкт-Петербург, Б. Сампсониевский пр., д. 29А, пом. 52. Тел.: +78127037373.
Дата изготовления: 12.2019. Наименование: книжная продукция. Срок годности: не ограничен.
Налоговая льгота — общероссийский классификатор продукции ОК 034-2014, 58.11.12 —
Книги печатные профессиональные, технические и научные.
Импортер в Беларусь: ООО «ПИТЕР М», 220020, РБ, г. Минск, ул. Тимирязева, д. 121/3, к. 214, тел./факс: 208 80 01.
Подписано в печать 08.12.19. Формат 70×100/16. Бумага офсетная. Усл. п. л. 38,700. Доп. тираж. Заказ 0000.
Оглавление
Введение...............................................................................................................17
О программировании..........................................................................................18
Почему так важен язык программирования........................................................ 20
Что такое JavaScript............................................................................................23
Код и что с ним делать.......................................................................................24
Обзор этой книги................................................................................................25
Условные обозначения.......................................................................................26
Глава 1. Значения, типы и операторы ................................................................ 27
Значения............................................................................................................28
Числа.................................................................................................................28
Арифметика........................................................................................................30
Специальные числа............................................................................................31
Строки................................................................................................................31
Унарные операции..............................................................................................33
Логические значения..........................................................................................34
Сравнение................................................................................................... 34
Логические операторы................................................................................ 35
Пустые значения................................................................................................36
Автоматическое преобразование типов.............................................................. 36
Упрощенное вычисление логических операторов............................................... 38
Резюме...............................................................................................................39
Глава 2. Структура программы ........................................................................... 40
Выражения и инструкции.................................................................................... 40
Привязки............................................................................................................41
Имена привязок..................................................................................................43
Окружение.........................................................................................................44
Функции.............................................................................................................44
Функция console.log............................................................................................45
Возвращение значений.......................................................................................45
Оглавление 7
Последовательность выполнения....................................................................... 46
Условное выполнение.........................................................................................47
Циклы while и do................................................................................................49
Код с отступами..................................................................................................51
Циклы for...........................................................................................................51
Принудительный выход из цикла........................................................................ 52
Быстрое обновление привязок............................................................................ 53
Диспетчеризация по значению с помощью switch............................................... 54
Использование прописных букв.......................................................................... 55
Комментарии......................................................................................................55
Резюме...............................................................................................................56
Упражнения........................................................................................................57
Построение треугольника в цикле............................................................... 57
FizzBuzz....................................................................................................... 57
Шахматная доска........................................................................................ 58
Глава 3. Функции ............................................................................................... 59
Определение функции........................................................................................59
Привязки и области видимости........................................................................... 61
Вложенные области видимости........................................................................... 62
Функции как значения........................................................................................63
Декларативная запись........................................................................................63
Стрелочные функции..........................................................................................64
Стек вызовов......................................................................................................65
Необязательные аргументы................................................................................ 66
Замыкание..........................................................................................................68
Рекурсия.............................................................................................................69
Разрастание функций.........................................................................................73
Функции и побочные эффекты........................................................................... 75
Резюме...............................................................................................................76
Упражнения........................................................................................................77
Минимум..................................................................................................... 77
Рекурсия..................................................................................................... 77
Подсчет букв............................................................................................... 78
Глава 4. Структуры данных: объекты и массивы ................................................ 79
Белка-оборотень................................................................................................80
Наборы данных..................................................................................................80
Свойства............................................................................................................81
Методы...............................................................................................................82
Объекты.............................................................................................................83
Изменяемость.....................................................................................................86
Дневник оборотня..............................................................................................88
Вычисление корреляции.....................................................................................90
8 Оглавление
Генераторы...................................................................................................... 234
Цикл событий................................................................................................... 235
Дефекты асинхронного программирования....................................................... 237
Резюме............................................................................................................. 238
Упражнения...................................................................................................... 239
Где скальпель?.......................................................................................... 239
Построение Promise.all.............................................................................. 239
Глава 12. Проект: язык программирования ...................................................... 241
Синтаксический анализ.................................................................................... 241
Интерпретатор................................................................................................. 246
Специальные формы........................................................................................ 248
Среда выполнения............................................................................................ 250
Функции........................................................................................................... 251
Компиляция...................................................................................................... 252
Немного мошенничества................................................................................... 253
Упражнения...................................................................................................... 254
Массивы.................................................................................................... 254
Замыкание................................................................................................ 255
Комментарии............................................................................................. 255
Исправление области видимости............................................................... 255
Глава 13. JavaScript и браузер . ........................................................................ 257
Интернет и другие сети.................................................................................... 258
Web.................................................................................................................. 259
HTML................................................................................................................ 260
HTML и JavaScript............................................................................................. 263
В «песочнице».................................................................................................. 264
Совместимость и браузерные войны................................................................. 265
Глава 14. Объектная модель документа ........................................................... 266
Структура документа........................................................................................ 266
Деревья............................................................................................................ 268
Стандарт.......................................................................................................... 269
Перемещения по дереву................................................................................... 270
Поиск элементов.............................................................................................. 272
Изменение документа....................................................................................... 273
Создание узлов................................................................................................. 273
Атрибуты.......................................................................................................... 275
Разметка........................................................................................................... 276
Стили............................................................................................................... 278
Каскадные стили.............................................................................................. 280
Селекторы запросов......................................................................................... 282
Позиционирование и анимация........................................................................ 283
Резюме............................................................................................................. 286
12 Оглавление
Упражнения...................................................................................................... 286
Построение таблицы................................................................................. 286
Элементы по имени тега........................................................................... 287
Кошка и ее шляпа..................................................................................... 287
Глава 15. Обработка событий .......................................................................... 289
Обработчики событий....................................................................................... 289
События и DOM-узлы........................................................................................ 290
Объекты событий............................................................................................. 291
Распространение событий................................................................................ 292
Действия по умолчанию................................................................................... 293
События клавиш............................................................................................... 294
События мыши................................................................................................. 296
Щелчки кнопкой мыши.............................................................................. 296
Движения мыши........................................................................................ 297
Сенсорные события................................................................................... 299
События прокрутки........................................................................................... 300
События фокуса............................................................................................... 301
Событие загрузки............................................................................................. 302
События и цикл событий.................................................................................. 303
Таймеры........................................................................................................... 304
Устранение повторных срабатываний............................................................... 305
Резюме............................................................................................................. 307
Упражнения...................................................................................................... 307
Воздушный шарик..................................................................................... 307
След мыши................................................................................................ 308
Вкладки..................................................................................................... 308
Глава 16. Проект: игровая платформа ............................................................. 309
Игра................................................................................................................. 309
Технология....................................................................................................... 310
Уровни............................................................................................................. 311
Чтение уровня.................................................................................................. 312
Акторы............................................................................................................. 314
Инкапсуляция как бремя................................................................................... 318
Рисование........................................................................................................ 318
Движение и столкновения................................................................................ 324
Изменение акторов........................................................................................... 328
Отслеживание нажатий клавиш........................................................................ 330
Игра в действии............................................................................................... 331
Упражнения...................................................................................................... 333
Игра окончена........................................................................................... 333
Приостановка игры................................................................................... 333
Монстр...................................................................................................... 334
Оглавление 13
Было время, когда языковые интерфейсы, такие как командные строки BASIC
и DOS 1980-х и 1990-х годов, являлись основным способом взаимодействия
с компьютерами. Затем они повсеместно были заменены визуальными ин-
терфейсами — такие интерфейсы проще освоить, хотя они предоставляют
меньше свободы. Но компьютерные языки все еще сохраняются — надо только
знать, где искать. Один из таких языков, JavaScript, встроен во все современ-
ные браузеры и, таким образом, доступен практически на любом устройстве.
О программировании
В этой книге я не только объясню JavaScript, но и познакомлю вас с основ-
ными принципами программирования. Программировать, оказывается,
трудно. Основные правила просты и понятны, но программы, построенные
на основе таких правил, со временем становятся достаточно сложными,
вводят собственные правила и собственную сложность. Вы сами создаете
свой лабиринт, в котором потом будет легко заблудиться.
Временами чтение этой книги будет вам даваться с трудом. Если вы нови-
чок в программировании, то вам встретится много незнакомого материала,
который придется переварить. Многие его части будут сочетаться между
собой, так что вам потребуется усвоить эти дополнительные связи.
Мораль этой истории в том, что одна и та же программа может быть создана
длинной или короткой, нечитаемой и читаемой. Первая версия нашей про-
граммы была совершенно непонятной, тогда как последняя написана почти
на обычном английском языке: «запишите (log) сумму (sum) чисел в диа-
пазоне (range) от 1 до 10». (В следующих главах вы научитесь определять
операции, такие как sum и range.)
Хороший язык программирования помогает программисту, позволяя ему
говорить о действиях, которые должен выполнить компьютер, на более
высоком уровне. Язык программирования дает возможность опустить
детали, предоставляет удобные строительные блоки (такие как while
и console.log), позволяет определять собственные строительные блоки
(такие как sum и range) и легко компоновать их.
Что такое JavaScript 23
Важно отметить, что JavaScript никогда не имел ничего общего с языком про-
граммирования под названием Java. Похожее название было продиктовано
не здравым смыслом, а маркетинговыми соображениями. Когда появился
JavaScript, язык Java активно продавался и приобретал популярность. Кто-
то решил, что будет хорошей идеей бесплатно прокатиться на волне чужого
успеха. Теперь приходится за это расплачиваться.
Однако у такой гибкости есть свои преимущества. Она оставляет место для
множества приемов, которые невозможны в более жестких языках, и, как
мы увидим (например, в главе 10), ее можно использовать для преодоления
отдельных недостатков JavaScript. Хорошо изучив язык и поработав с ним
некоторое время, я по-настоящему полюбил JavaScript.
24 Введение
Тот факт, что язык развивается, означает, что браузеры должны постоянно
идти с ними в ногу, и если вы используете старый браузер, он может не под-
держивать все функции. Разработчики языка стараются не вносить никаких
изменений, которые могли бы нарушить работоспособность существующих
программ, поэтому старые программы на новых браузерах по-прежнему
будут работать. В книге я использую версию JavaScript 2017 года.
Условные обозначения
Моноширинным шрифтом в этой книге набраны элементы программ — ино-
гда это самостоятельные фрагменты, а иногда упоминания в тексте частей
ближайшей программы. Программы (некоторые из них вы уже видели)
написаны следующим образом:
function factorial(n) {
if (n == 0) {
return 1;
} else {
return factorial(n - 1) * n;
}
}
Удачи!
1 Значения, типы
и операторы
0 0 0 0 1 1 0 1
128 64 32 16 8 4 2 1
Значения
Представьте себе море битов, океан битов. В энергозависимом хранилище
данных (рабочей памяти) обычного современного компьютера более 30 мил-
лиардов бит. В энергонезависимом хранилище (на жестком диске или его
эквиваленте), как правило, их на несколько порядков больше.
Чтобы создать значение, достаточно просто вызвать его по имени. Это удоб-
но — вам не приходится собирать строительные материалы для значений или
платить за них. Вы просто вызываете его, и — вжжух — оно у вас есть. Разуме-
ется, значения создаются из ничего. Каждое должно храниться где-то, и если
вы хотите использовать огромное количество значений одновременно, то вам
может не хватить памяти. К счастью, это становится проблемой, только если все
значения нужны вам одновременно. Как только значение больше не использу-
ется, оно исчезает, оставляя после себя свободные биты для повторного приме-
нения в качестве строительного материала следующему поколению значений.
Числа
Значения числового типа, что неудивительно, являются числовыми значе-
ниями. В программе JavaScript они записываются так:
13
Числа 29
Для очень больших или очень маленьких чисел также можно использовать
экспоненциальную запись с добавлением буквы е (от слова «экспонента»),
за которой следует экспонента числа:
2.998e8
Арифметика
Основное, что обычно делают с числами, — выполняют арифметические
действия. Арифметические операции, такие как сложение или умножение,
принимают два числовых значения и производят из них новое число. Вот
как они выглядят в JavaScript:
100 + 4 * 11
Специальные числа
В JavaScript есть три специальных значения, которые считаются числами,
но ведут себя не как обычные числа.
NaN означает «не число», хотя это значение числового типа. Такой результат
можно получить, если, например, попытаться вычислить 0/0 (разделить
ноль на ноль), Infinity - Infinity или выполнить любую другую числовую
операцию, которая не дает осмысленного результата.
Строки
Следующий основной тип данных — это строка. Строки используются для
представления текста. Их записывают, заключая содержимое в кавычки.
`В море`
"На волнах океана"
'Плавает в океане'
Конечно, бывают ситуации, когда нужно, чтобы обратная косая черта в стро-
ке была просто обратной косой, а не специальным кодом. Если две обратные
косые черты идут подряд, они сливаются и в результирующем строковом
значении останется только одна. Например, строку «Символ новой строки
записывается как "\n".» можно записать так:
"Символ новой строки записывается как \"\\n\"."
Унарные операции
Не все операторы обозначаются одним символом. Отдельные записываются
словами — как, например, оператор typeof, результатом которого является
строковое значение, соответствующее типу значения, предоставленного
оператору.
console.log(typeof 4.5)
// → number
console.log(typeof "x")
// → string