Илья Борисович Государев - Введение в веб разработку на языке JavaScript

И. Б. ГОСУДАРЕВ

ВВЕДЕНИЕ
В ВЕБРАЗРАБОТКУ
НА ЯЗЫКЕ JAVASCRIPT
Учебное пособие

САНКТПЕТЕРБУРГ
МОСКВА
КРАСНОДАР
2022

УДК 004.43
ББК 32.973.26018.1я73
Г 72

Г 72

Государев И. Б.
Введение в вебразработку на языке JavaScript: Учебное
пособие. — СПб.: Издательство «Лань», 2022. — 144 с.: ил. —
(Учебники для вузов. Специальная литература).
ISBN 9785811435395
В учебнометодическом пособии рассматриваются фундаментальные
основы и прикладные аспекты использования языка JavaScript для клиент
ской и серверной разработки вебресурсов. Проанализированы основные
тенденции развития наиболее распространённого языка клиентского веб
программирования в свете внедрения новых стандартов ECMAScript.
Изучающим язык предложены задания развивающего и проблемного типа,
нацеленные на формирование профессиональных компетенций в области
вебразработки.
Пособие инновационно по своей структуре: все примеры и задания
доступны в его интерактивной части (сайт kodaktor.ru), которая является
зарегистрированным в Роспатенте средством электронного обучения
и содержит не только образцы кода, но и скринкасты по ряду рассматри
ваемых в текстовой части вопросов.

УДК 004.43
ББК 32.973.26018.1я73

Îáëîæêà
Е. А. ВЛАСОВА

© Издательство «Лань», 2022
© И. Б. Государев, 2022
© Издательство «Лань»,
художественное оформление, 2022

ОГЛАВЛЕНИЕ
ВВЕДЕНИЕ
Релевантность пособия
Терминология
Замечание о коде и его стиле
Замечание об инструментах
Рекомендации студенту
Рекомендации преподавателю
Веб-портфолио
ГЛАВА 1. СИНТАКСИС И ОСНОВНЫЕ ПОНЯТИЯ JAVASCRIPT
Подготовка к лекции
Обзор языка JavaScript
Консоль
Операторы, выражения и инструкции
ГЛАВА 2. ЗАВИСИМОСТИ
Менеджмент зависимостей
Запуск зависимостей
ГЛАВА 3. ПЕРЕМЕННЫЕ И ТИПЫ ДАННЫХ
Преобразование типов
Тернарный оператор и ветвление
ГЛАВА 4. ФУНКЦИИ
Линтинг
IIFE и стрелки
ГЛАВА 5. ФУНКЦИЯ КАК ТИП ДАННЫХ
Промисификация
Замыкание
Модели реализации коллбэка
Веб-воркеры
ГЛАВА 6. СТРОКИ И МАССИВЫ
Задачи с массивами
Деструктуризация массива
Оператор rest/spread
ГЛАВА 7. ЛИТЕРАЛЬНЫЕ ОБЪЕКТЫ
Деструктуризация объектов
Методы
Энумерабельность и итерабельность
ГЛАВА 8. ПРОТОТИПЫ И КОНСТРУКТОРЫ
Собственные ключи
Цепочка прототипов
Классы ES2015
super
ГЛАВА 9. МОДУЛЬНОСТЬ И ТРАНСПИЛЯЦИЯ
Транспиляция
Сборка проекта
3

5
5
6
7
7
8
9
10
11
11
13
14
16
24
24
28
32
33
36
40
40
48
52
58
61
61
62
65
69
70
72
77
81
84
86
94
97
98
101
104
106
108
112

ЗАКЛЮЧЕНИЕ
ПРИЛОЖЕНИЕ 1
ПРИЛОЖЕНИЕ 2
ПРИЛОЖЕНИЕ 3
ПРИЛОЖЕНИЕ 4
ЛИТЕРАТУРА

119
120
124
125
135
140

4

ВВЕДЕНИЕ
«Веб-разработка» — это словосочетание, указывающее на область деятельности, которую в английском языке называют web development. Это не то
же самое, что веб-дизайн. Речь не идёт о художественном подходе к вебресурсам, замысле, видении, эргономичности, юзабилити, эстетике. Речь идёт о
создании решений поставленных задач («веб-решений») с помощью языковых
и инструментальных средств, в первую очередь языков программирования и
разметки.
В силу исторических причин язык программирования JavaScript приобрёл
особый статус языка, объединяющего клиентскую и серверную веб-разработку
(см. последнюю главу). Этот факт и побудил посвятить ему данное учебное пособие.

Релевантность пособия
Веб-разработка, находясь на переднем крае IT, является областью, в которой новые сущности и связи между ними возникают буквально ежедневно.
Они возникают в самом вебе (в блогах разработчиков в первую очередь). Некоторые из них исчезают (https://github.com/GossJS/11lines). Любая попытка зафиксировать эти сущности и связи в традиционном виде печатного текста интересна в основном исторически. Данное пособие нужно в первую очередь для
того, чтобы сориентировать читателя в некоторых важных направлениях, предложить примеры терминов, заданий, решений, ресурсов. Оно тоже фиксирует
некоторое состояние дел в области веб-разработки, но не претендует на актуальность, так как это невозможно в принципе. Его электронная составляющая
(сайт Кодактор, см. ниже «Замечание об инструментах») вместе с репозиторием
GossJS служат средством обеспечения актуальности сообщаемой информации
через включённые в текст ссылки.
Если вы видите скриншот окна программы (например, консоли браузера),
то следует понимать, что --">