JavaScript и TypeScript
Все объяснения, задачи и лабораторная в одном месте.
Можно сохранить страницу в PDF через печать браузера. Для печати разборы ответов раскрываются автоматически.
1. Значения, scope, closures и modules
Объяснение
Лексическое окружение определяет доступные имена. Замыкание сохраняет доступ к переменным внешней функции. let создаёт блочную область, а const запрещает переприсваивание ссылки, но не изменение объекта.
Задача для самостоятельного решения
Можно ли выполнить push для массива, объявленного const?
Показать разбор ответа
Да: меняется объект, а не привязка имени. Присвоить имени другой массив нельзя. Для неизменяемых данных нужны правила копирования или дополнительные ограничения.
2. Объекты, прототипы и классы
Объяснение
Свойства ищутся сначала у объекта, затем в цепочке прототипов. Метод получает this в зависимости от вызова. Стрелочная функция захватывает this из окружающей области.
Задача для самостоятельного решения
Почему переданный отдельно метод иногда теряет this?
Показать разбор ответа
При вызове function reference без объекта прежний receiver не сохраняется. Используйте bind, обёртку или подходящую стрелочную функцию.
3. Promises, event loop и async/await
Объяснение
Promise представляет будущий результат. await приостанавливает async-функцию, но не блокирует весь поток JavaScript. Microtasks выполняются после текущего стека до следующей обычной задачи.
Задача для самостоятельного решения
В каком порядке появятся A, Promise.then(B), C?
Показать разбор ответа
A, C, B: синхронный стек завершается до callback promise. Длительные вычисления в callback всё равно блокируют интерфейс.
4. TypeScript types, narrowing и generics
Объяснение
TypeScript проверяет программу до исполнения, но стирает типы при компиляции. Narrowing уточняет тип после проверки. Type assertion не преобразует данные и не валидирует JSON.
Задача для самостоятельного решения
Сделает ли response as User неверный JSON корректным User?
Показать разбор ответа
Нет. Проверяйте поля и типы во время исполнения; затем возвращайте подтверждённую структуру. Assertion лишь сообщает компилятору предположение автора.
5. Ошибки, тесты и package management
Объяснение
Исключение в async-функции превращается в rejected Promise. Тест должен ждать асинхронный результат. Lockfile фиксирует разрешённые версии зависимостей для воспроизводимой установки.
Задача для самостоятельного решения
Почему тест без await может ложно пройти?
Показать разбор ответа
Он закончится до завершения Promise и до ошибки. Верните Promise тестовому runner или используйте await внутри async-теста.
6. Архитектура, сборка и производительность
Объяснение
Границы модулей ограничивают знание о деталях. Состояние интерфейса, доменные вычисления и сетевой слой проще проверять отдельно. Размер bundle влияет на загрузку и время разбора скрипта.
Задача для самостоятельного решения
Как сократить первоначальную загрузку редкого экрана?
Показать разбор ответа
Динамический import позволяет загружать его по требованию. Измерьте waterfall и время интерактивности; чрезмерное дробление может увеличить число последовательных запросов.
Лабораторная работа
Подготовка
Браузерная консоль или Node.js для JavaScript-примера.
Учебный пример
console.log("A");
Promise.resolve().then(() => console.log("B"));
console.log("C");
function parsePrice(value) {
if (typeof value !== "number" || !Number.isFinite(value) || value < 0)
throw new Error("Ожидается неотрицательная цена");
return value;
}
console.log(parsePrice(100));Как работает пример и что ожидать
Вывод A, C, 100, затем B. Promise callback выполняется после синхронного стека. Проверка цены работает во время исполнения и отклоняет NaN, бесконечность и отрицательные значения; простая TS-аннотация такой проверки не выполняет.
Итоговая работа
Перепишите интерфейсы на TypeScript, сохранив runtime-валидацию. Добавьте форму поиска с отменой устаревшего запроса, обработкой ошибки и тестами порядка ответов. Разделите данные сервера и локальное состояние UI.
Проверка результата
1. Опишите исходные данные и условия запуска, чтобы другой человек мог повторить работу.
2. Приложите результат обычного сценария и сравните его с ожидаемым.
3. Проверьте неверный вход, граничный случай и отказ зависимости, если она есть.
4. Объясните выбранное решение и известное ограничение.
5. Сохраните исправления после самопроверки вместе с примером, который раньше не работал.
Как оценить работу
По каждому пункту поставьте 0 (не выполнено), 1 (выполнено с пробелами) или 2 (результат воспроизводим и объяснён). Если обязательный сценарий не работает, вернитесь к нему независимо от общей суммы. Это рубрика самопроверки: сайт не исполняет присланный код и не выдаёт автоматическую оценку проекта.