Примерные вопросы для зачета с оценкой по дисциплине «Разработка web-приложений на языке JavaScript»
Структура оценивания
- Вопрос 1-го типа — 20 баллов
- Вопрос 2-го типа — 20 баллов
- Вопрос 3-го типа — 60 баллов
Задание 1 (вопросы 1-го типа, 20 баллов)
Ответить на теоретические вопросы, дать определения, классификации, перечисления.
- Что означает термин «Web как платформа» и какие основные компоненты в него входят?
- В чём состоит модель client–server и как распределяется ответственность между клиентом и сервером?
- Что такое browser runtime и какую роль в нём играет JavaScript?
- Чем отличается статический сайт от динамического?
- В чём принципиальная разница между web-сайтом, web-приложением и SPA?
- Какова роль JavaScript во frontend-архитектуре?
- Как используется JavaScript на backend-стороне?
- Что означает термин Fullstack-разработка?
- Для чего применяются библиотеки и фреймворки в экосистеме JavaScript?
- Что такое HTTP и какую задачу он решает в web-приложениях?
- В чём различие между HTTP и HTTPS?
- Что такое HTTP-метод и какие методы используются чаще всего?
- Что означают HTTP-статусы ответа?
- Как работает модель запрос–ответ?
- Почему JSON стал основным форматом обмена данными в web?
- Что понимается под REST как архитектурным стилем?
- Что такое CORS и зачем он нужен?
- Для чего используется среда разработки VS Code?
- Какие задачи решают DevTools браузера?
- Зачем нужно форматирование кода?
- Какую роль играют Prettier и ESLint?
- Что такое отладка и зачем она необходима?
- Что такое ECMAScript и как он связан с JavaScript?
- Для чего используется директива
use strict? - Какие основные типы данных существуют в JavaScript?
- В чём различие между
letиconst? - Что такое область видимости переменных?
- Что понимается под неявным преобразованием типов?
- Какие основные управляющие конструкции используются в JavaScript?
- Что такое функция и какую роль она играет в структуре программы?
Задание 2 (вопросы 2-го типа, 20 баллов)
Развёрнутые аналитические вопросы с пояснениями и примерами.
- Почему JavaScript стал универсальным языком как для клиента, так и для сервера?
- В каких случаях использование SPA оправдано, а в каких — избыточно?
- Почему браузер не может напрямую работать с базой данных?
- Как изменится архитектура приложения, если отключить JavaScript?
- Почему web-приложение рассматривается как часть информационной системы?
- Почему ошибка CORS проявляется в браузере, но не на сервере?
- Как HTTP-статусы помогают разработчику в отладке приложения?
- Чем опасна передача данных без HTTPS?
- Почему REST не является стандартом, но широко используется?
- В каких случаях JSON может быть неудачным форматом обмена?
- Почему «рабочий» код может считаться плохим с точки зрения качества?
- Какие риски возникают при отсутствии форматирования кода в команде?
- Почему умение читать сообщения об ошибках важнее, чем запоминание синтаксиса?
- Как отладчик помогает понять логику выполнения программы?
- Почему автоматические инструменты не заменяют понимание кода?
- Почему неявные преобразования типов считаются источником ошибок?
- В каких ситуациях использование
constпредпочтительнееlet? - Почему понимание приоритета операторов важно для корректной логики?
- Как
use strictвлияет на надёжность кода? - Почему даже простое взаимодействие с пользователем требует проверки данных?
- Почему сложные бизнес-правила нельзя реализовать без условий и циклов?
- Как пошаговый разбор кода помогает находить логические ошибки?
- Почему алгоритм «на бумаге» полезен до написания кода?
- В чём опасность избыточных
breakиcontinue? - Почему меню с условиями — хороший учебный пример алгоритма?
- Почему массив объектов часто сравнивают с таблицей сущностей информационной системы?
- Как асинхронность влияет на восприятие интерфейса пользователем?
- Почему обработка ошибок сети является частью бизнес-логики?
- В чём преимущество делегирования событий по сравнению с прямыми обработчиками?
- Почему качество кода и валидация форм критичны для реальных web-приложений?
Задание 3 (вопросы 3-го типа, 60 баллов)
Практико-ориентированные задания, требующие анализа, проектирования и разработки кода.
Задание 1.
Кейс
В рамках web-приложения реализуется модуль первичной проверки числовых данных.
Система получает и хранит массив чисел, сформированный из пользовательского ввода, файла или автоматически сгенерированных значений. Для последующей аналитической обработки требуется определить минимальное корректное значение, удовлетворяющее заданному условию.
В качестве критерия корректности в данном кейсе используется принадлежность числа к чётным значениям, что позволяет отработать навыки фильтрации данных и базовой алгоритмической обработки массива.
Задание
Разработайте программу на языке JavaScript, которая:
- принимает одномерный массив целых чисел;
- последовательно анализирует элементы массива;
- отбирает только чётные значения;
- определяет минимальное чётное число среди отобранных элементов;
- корректно обрабатывает ситуацию, при которой в массиве отсутствуют чётные числа.
Алгоритм должен быть реализован с использованием базовых конструкций языка JavaScript
(условные операторы, циклы или методы работы с массивами).
Результат
- если в массиве присутствуют чётные числа — в консоль выводится минимальное чётное значение;
- если чётные числа отсутствуют — в консоль выводится сообщение:
«Чётные числа не найдены».
Дополнительно фиксируется корректность работы программы на различных наборах данных
(пустой массив, массив с одним элементом, массив с отрицательными числами).
Задание 2.
Кейс
В разрабатываемом web-приложении реализуется модуль первичной обработки пользовательских данных.
Одним из обязательных параметров является возраст пользователя, который используется для логической классификации и последующей настройки поведения системы (доступ к функциям, отображение интерфейса, аналитика).
Возраст вводится пользователем в явном виде и требует проверки корректности и отнесения к одной из заранее определённых категорий.
Задание
Разработайте программу на языке JavaScript, которая:
- принимает значение возраста, введённое пользователем;
- проверяет корректность введённых данных (числовое значение, неотрицательное);
- на основе значения возраста определяет категорию пользователя:
- ребёнок — возраст до 18 лет;
- взрослый — возраст от 18 до 64 лет включительно;
- пенсионер — возраст 65 лет и старше;
- реализует логику проверки с использованием условных операторов.
Результат
- в консоль выводится категория пользователя в соответствии с введённым возрастом;
- при некорректном вводе (отрицательное число, нечисловое значение) выводится диагностическое сообщение об ошибке;
- логика корректно обрабатывает граничные значения (18 и 65 лет).
Задание 3.
Кейс
В информационной системе учёта заказов формируется массив данных, содержащий суммы оформленных заказов.
Данный массив используется для расчёта финансовых показателей: выручки за период, контроля корректности данных и подготовки аналитических отчётов.
Каждый элемент массива представляет собой числовое значение — сумму отдельного заказа. Для получения агрегированного показателя требуется вычислить общую сумму всех заказов.
Задание
Разработайте программу на языке JavaScript, которая:
- принимает одномерный массив числовых значений, представляющих суммы заказов;
- последовательно обрабатывает элементы массива;
- выполняет суммирование всех значений;
- корректно обрабатывает особые случаи:
- пустой массив;
- массив с одним заказом;
- наличие нулевых значений.
При реализации используйте базовые конструкции языка JavaScript
(циклы или методы работы с массивами).
Результат
- в консоль выводится итоговая сумма всех заказов;
- при отсутствии заказов выводится значение 0 либо диагностическое сообщение о пустом массиве;
- корректность расчёта подтверждается на нескольких тестовых наборах данных.
Задание 4.
Кейс
В web-приложении реализуется модуль анализа текстовых данных, поступающих от пользователя.
Строка может представлять собой имя, комментарий, сообщение формы обратной связи или произвольный текст. Для предварительной обработки и анализа требуется определить количество гласных букв, содержащихся во введённой строке.
Подсчёт гласных используется как упрощённый пример работы со строками, символами и условиями, а также для демонстрации алгоритмов посимвольного анализа текста.
Задание
Разработайте программу на языке JavaScript, которая:
- принимает строку, введённую пользователем;
- выполняет посимвольный анализ строки;
- определяет, является ли каждый символ гласной буквой;
- учитывает как строчные, так и прописные буквы;
- корректно обрабатывает особые случаи:
- пустая строка;
- строка без гласных;
- наличие пробелов, цифр и специальных символов.
Для реализации используйте базовые средства языка JavaScript
(циклы, условные операторы, методы работы со строками).
Результат
- в консоль выводится количество гласных букв, найденных в строке;
- при отсутствии гласных выводится значение 0;
- программа корректно работает независимо от регистра символов.
Задание 5.
Кейс
В информационной системе управления пользователями хранится список учётных записей.
Каждый пользователь описывается набором свойств, включая идентификатор, имя и роль в системе (например: user, admin, moderator). Роль определяет уровень доступа и набор доступных функций.
Для выполнения административных операций и контроля прав доступа требуется получить отдельный список пользователей, обладающих ролью администратора.
Задание
Разработайте программу на языке JavaScript, которая:
- принимает массив объектов пользователей;
- анализирует свойство, определяющее роль пользователя;
- отбирает только тех пользователей, у которых роль равна
admin; - формирует новый массив, содержащий только пользователей-администраторов;
- корректно обрабатывает особые случаи:
- отсутствие пользователей с ролью
admin; - пустой массив пользователей;
- наличие нескольких пользователей с разными ролями.
Для реализации используйте базовые конструкции языка JavaScript
(циклы или методы обработки массивов).
Результат
- в консоль выводится массив пользователей с ролью
admin; - если администраторы отсутствуют, выводится пустой массив либо диагностическое сообщение;
- исходный массив пользователей не изменяется.
Задание 6.
Кейс
В web-приложении предусмотрена регистрация и ввод контактных данных пользователя.
Одним из обязательных полей является адрес электронной почты (email), который используется для идентификации пользователя, восстановления доступа и отправки уведомлений.
Для обеспечения качества данных и предотвращения ошибок при вводе необходимо реализовать проверку корректности email-адреса на этапе обработки пользовательского ввода.
Задание
Разработайте программу на языке JavaScript, которая:
- принимает строковое значение email, введённое пользователем;
- выполняет проверку формата email с использованием регулярного выражения (RegExp);
- учитывает наличие обязательных элементов email-адреса:
- имя пользователя;
- символ
@; - доменное имя и доменную зону;
- корректно обрабатывает особые случаи:
- пустая строка;
- отсутствие символа
@; - некорректный формат доменной части;
- наличие недопустимых символов.
Результат
- если email соответствует заданному шаблону, в консоль выводится сообщение:
«корректный»; - если формат email не соответствует требованиям, в консоль выводится сообщение:
«некорректный»; - проверка работает независимо от регистра символов и не приводит к аварийному завершению программы.
Задание 7.
Кейс
В процессе обработки числовых данных в web-приложении используется массив значений, полученных из внешнего источника (пользовательский ввод, файл, результат вычислений).
В ряде сценариев отрицательные значения считаются некорректными или недопустимыми и могут приводить к искажению результатов последующих расчётов.
Для нормализации данных требуется заменить все отрицательные числа в массиве на значение 0, сохранив при этом структуру массива.
Задание
Разработайте программу на языке JavaScript, которая:
- принимает одномерный массив чисел;
- последовательно анализирует каждый элемент массива;
- определяет, является ли значение отрицательным;
- заменяет все отрицательные значения на
0; - корректно обрабатывает особые случаи:
- пустой массив;
- массив, не содержащий отрицательных чисел;
- массив, состоящий только из отрицательных значений.
При реализации используйте базовые конструкции языка JavaScript
(условные операторы, циклы или методы обработки массивов).
Результат
- в консоль выводится обновлённый массив с заменёнными значениями;
- все исходные отрицательные числа преобразованы в
0; - порядок элементов массива сохранён.
Задание 8.
Кейс
В web-приложении реализуется интерактивный элемент пользовательского интерфейса — кнопка.
Для анализа активности пользователя и отработки навыков работы с событиями требуется организовать подсчёт количества нажатий на кнопку в рамках одной сессии.
Счётчик кликов используется как базовый пример взаимодействия JavaScript с DOM-элементами и обработки пользовательских событий.
Задание
Разработайте клиентский скрипт на языке JavaScript, который:
- находит кнопку на HTML-странице;
- инициализирует переменную для хранения количества кликов;
- обрабатывает событие нажатия на кнопку;
- увеличивает значение счётчика при каждом клике;
- динамически обновляет отображаемое значение счётчика на странице.
Реализация должна использовать стандартные средства работы с DOM и обработчики событий.
Результат
- при каждом нажатии на кнопку счётчик увеличивается на 1;
- текущее количество кликов отображается на странице без её перезагрузки;
- интерфейс корректно реагирует на многократные нажатия кнопки.
Задание 9.
Кейс
В информационной системе управления товарами хранится массив данных о продукции.
Каждый товар представлен объектом, содержащим основные характеристики, включая наименование и цену. Данный массив используется для анализа ассортимента, контроля цен и формирования управленческой отчётности.
Для выполнения аналитической операции требуется определить товар с максимальной ценой среди всех представленных позиций.
Задание
Разработайте программу на языке JavaScript, которая:
- принимает массив объектов товаров;
- анализирует числовое свойство, определяющее цену товара;
- сравнивает значения цен между элементами массива;
- определяет товар с наибольшей ценой;
- корректно обрабатывает особые случаи:
- пустой массив товаров;
- массив с одним товаром;
- наличие нескольких товаров с одинаковой максимальной ценой.
При реализации используйте базовые конструкции языка JavaScript
(условные операторы, циклы или методы обработки массивов).
Результат
- в консоль выводится объект товара с максимальной ценой;
- если массив пуст, выводится диагностическое сообщение;
- исходный массив товаров не изменяется.
Задание 10.
Кейс
В web-приложении реализуется модуль проверки числовых значений, вводимых пользователем.
Одна из базовых математических операций — определение, является ли введённое число простым. Такая проверка используется в учебных целях, а также в задачах валидации и анализа числовых данных.
Число считается простым, если оно больше 1 и делится без остатка только на 1 и само себя.
Задание
Разработайте программу на языке JavaScript, которая:
- принимает числовое значение, введённое пользователем;
- проверяет корректность введённых данных (целое число, больше 1);
- определяет, имеет ли число делители, отличные от 1 и самого числа;
- реализует алгоритм проверки простоты числа с использованием цикла и условных операторов;
- корректно обрабатывает особые случаи:
- число меньше или равно 1;
- нецелое или нечисловое значение.
Результат
- если число является простым, в консоль выводится сообщение:
«простое»; - если число является составным, в консоль выводится сообщение:
«составное»; - при некорректном вводе выводится диагностическое сообщение.
Задание 11.
Кейс
В web-приложении выполняется обработка текстовых данных, представленных в виде массива строк.
Такие данные могут поступать из пользовательского ввода, формы, файла или внешнего источника и требуют предварительной структуризации перед дальнейшим использованием.
Для упорядочивания информации необходимо отсортировать строки по их длине, что позволяет отработать навыки сравнения элементов, работы со строками и применения алгоритмов сортировки.
Задание
Разработайте программу на языке JavaScript, которая:
- принимает одномерный массив строк;
- определяет длину каждой строки;
- сортирует строки по возрастанию их длины;
- сохраняет порядок строк одинаковой длины;
- корректно обрабатывает особые случаи:
- пустой массив;
- массив из одной строки;
- наличие пустых строк.
При реализации используйте базовые средства языка JavaScript
(методы сортировки массивов или алгоритмическую реализацию сортировки).
Результат
- в консоль выводится массив строк, отсортированный по длине;
- строки упорядочены от наименьшей длины к наибольшей;
- исходный массив при необходимости остаётся неизменным.
Задание 12.
Кейс
В web-приложении для управления задачами (to-do список) хранится массив объектов задач.
Каждая задача содержит признак состояния выполнения, отражаемый логическим флагом completed.
Данный признак используется для анализа прогресса пользователя, формирования статистики и визуального отображения состояния задач.
Для получения сводной информации требуется определить количество задач, которые были успешно выполнены.
Задание
Разработайте программу на языке JavaScript, которая:
- принимает массив объектов задач;
- анализирует логическое свойство
completedу каждой задачи; - подсчитывает количество задач, у которых значение
completedравноtrue; - корректно обрабатывает особые случаи:
- пустой массив задач;
- отсутствие выполненных задач;
- наличие задач с некорректным или отсутствующим флагом
completed.
При реализации используйте базовые конструкции языка JavaScript
(циклы или методы обработки массивов).
Результат
- в консоль выводится числовое значение — количество выполненных задач;
- при отсутствии выполненных задач выводится значение 0;
- исходный массив задач не изменяется.
Задание 13.
Кейс
В web-приложении реализуется модуль регистрации пользователя.
Одним из ключевых требований безопасности является проверка корректности пароля на этапе ввода.
Минимальные правила сложности пароля позволяют снизить риск использования слишком простых и небезопасных комбинаций.
В данном кейсе требуется проверить пароль по двум базовым критериям: минимальная длина и наличие хотя бы одной цифры.
Задание
Разработайте программу на языке JavaScript, которая:
- принимает строковое значение пароля, введённого пользователем;
- проверяет, что длина пароля не меньше заданного минимального значения (например, 8 символов);
- проверяет наличие хотя бы одной цифры в составе пароля;
- реализует проверку с использованием условных операторов и/или регулярных выражений;
- корректно обрабатывает особые случаи:
- пустая строка;
- пароль, не содержащий цифр;
- пароль, длина которого меньше минимально допустимой.
Результат
- если пароль удовлетворяет всем условиям, в консоль выводится сообщение о корректности пароля;
- если хотя бы одно условие не выполнено, выводится сообщение о некорректности пароля с указанием причины;
- проверка выполняется без аварийного завершения программы и корректно обрабатывает любой пользо
Задание 14.
Кейс
В web-приложении выполняется обработка числовых данных, представленных в виде массива значений.
Подобные данные могут использоваться для расчёта статистических показателей, анализа результатов измерений или обработки пользовательского ввода.
Одним из базовых агрегирующих показателей является среднее арифметическое, которое позволяет получить обобщённую характеристику набора чисел.
Задание
Разработайте программу на языке JavaScript, которая:
- принимает одномерный массив числовых значений;
- последовательно обрабатывает элементы массива;
- вычисляет сумму всех элементов;
- рассчитывает среднее арифметическое значений;
- корректно обрабатывает особые случаи:
- пустой массив;
- массив из одного элемента;
- наличие нулевых и отрицательных значений.
При реализации используйте базовые конструкции языка JavaScript
(циклы или методы обработки массивов).
Результат
- в консоль выводится среднее арифметическое значение элементов массива;
- при пустом массиве выводится диагностическое сообщение либо значение 0;
- расчёт выполняется корректно для любых допустимых входных данных.
Задание 15.
Кейс
В web-приложении реализуется модуль анализа текстовых данных, вводимых пользователем.
Строка может представлять собой слово, фразу или произвольную последовательность символов. Для проверки корректности ввода и демонстрации алгоритмов работы со строками требуется определить, является ли введённая строка палиндромом.
Палиндромом считается строка, которая читается одинаково слева направо и справа налево с учётом нормализации данных.
Задание
Разработайте программу на языке JavaScript, которая:
- принимает строку, введённую пользователем;
- выполняет предварительную обработку строки:
- приведение к единому регистру;
- при необходимости — удаление пробелов и небуквенных символов;
- сравнивает исходную строку с её перевёрнутой версией;
- определяет, является ли строка палиндромом;
- корректно обрабатывает особые случаи:
- пустая строка;
- строка из одного символа;
- наличие пробелов и знаков препинания.
Для реализации используйте базовые средства языка JavaScript
(методы работы со строками, циклы или массивы).
Результат
- в консоль выводится логическое значение:
- true — если строка является палиндромом;
- false — если строка не является палиндромом;
- проверка выполняется корректно независимо от регистра символов;
- программа не изменяет исходные данные пользователя.
Задание 16.
Кейс
В учебной информационной системе хранится массив объектов «студент», каждый из которых описывает обучающегося и содержит данные об успеваемости.
Объекты могут включать такие свойства, как имя студента, группа и итоговый балл (оценка, рейтинг или средний балл).
Для анализа учебных результатов и формирования рейтингов требуется определить студента с максимальным баллом среди всех записей.
Задание
Разработайте программу на языке JavaScript, которая:
- принимает массив объектов студентов;
- анализирует числовое свойство, отражающее балл студента;
- сравнивает значения баллов между объектами массива;
- определяет студента с наибольшим баллом;
- корректно обрабатывает особые случаи:
- пустой массив студентов;
- массив, содержащий одного студента;
- наличие нескольких студентов с одинаковым максимальным баллом.
При реализации используйте базовые конструкции языка JavaScript
(циклы или методы обработки массивов).
Результат
- в консоль выводится объект студента с максимальным баллом;
- если массив пуст, выводится диагностическое сообщение;
- исходный массив студентов остаётся неизменным.
Задание 17.
Кейс
В web-приложении реализуется модуль числового анализа, принимающий данные от пользователя.
Одной из базовых математических операций является определение всех делителей введённого числа. Такая функциональность используется при изучении алгоритмов, валидации данных и решении задач теории чисел.
Делителем считается целое число, на которое исходное число делится без остатка.
Задание
Разработайте программу на языке JavaScript, которая:
- принимает целое числовое значение, введённое пользователем;
- проверяет корректность введённых данных (целое число, не равное нулю);
- последовательно проверяет возможные делители числа;
- формирует массив всех делителей исходного числа;
- корректно обрабатывает особые случаи:
- число, равное 1;
- отрицательное число;
- некорректный пользовательский ввод.
При реализации используйте базовые конструкции языка JavaScript
(циклы, условные операторы, операции деления по модулю).
Результат
- в консоль выводится массив всех делителей введённого числа;
- делители выводятся в порядке возрастания;
- программа корректно обрабатывает все допустимые входные данные.
Задание 18.
Кейс
В информационной системе управления товарами хранится список продукции, представленной в виде массива объектов.
Каждый товар содержит основные характеристики, включая наименование и цену. Для анализа ассортимента, формирования подборок и фильтрации данных используется ценовой порог, задаваемый пользователем или системой.
Требуется выделить из общего списка только те товары, цена которых превышает заданное пороговое значение.
Задание
Разработайте программу на языке JavaScript, которая:
- принимает массив объектов товаров;
- принимает числовое значение порога цены;
- сравнивает цену каждого товара с заданным порогом;
- отбирает товары, цена которых строго больше порогового значения;
- формирует новый массив отфильтрованных товаров;
- корректно обрабатывает особые случаи:
- пустой массив товаров;
- отсутствие товаров, удовлетворяющих условию;
- некорректное значение порога цены.
При реализации используйте базовые конструкции языка JavaScript
(циклы или методы обработки массивов).
Результат
- в консоль выводится массив товаров, цена которых превышает заданный порог;
- если подходящие товары отсутствуют, выводится пустой массив либо диагностическое сообщение;
- исходный массив товаров не изменяется.
Задание 19.
Кейс
В web-приложении реализуется модуль обработки календарных данных, вводимых пользователем.
Дата может использоваться для планирования событий, формирования отчётов или анализа временных данных. Для корректного отображения информации системе необходимо определить, на какой день недели приходится введённая дата.
Задание
Разработайте программу на языке JavaScript, которая:
- принимает дату, введённую пользователем (в строковом или числовом формате);
- преобразует введённое значение в объект даты JavaScript;
- определяет день недели для указанной даты;
- сопоставляет числовое значение дня недели с его текстовым названием;
- корректно обрабатывает особые случаи:
- некорректный формат даты;
- пустой ввод;
- граничные календарные значения.
При реализации используйте стандартные возможности работы с датами в JavaScript.
Результат
- в консоль выводится название дня недели, соответствующее введённой дате;
- при некорректном вводе выводится диагностическое сообщение;
- программа корректно работает для любых допустимых дат.
Задание 20.
Кейс
В web-приложении осуществляется обработка числовых данных, представленных в виде массива значений.
В процессе сбора данных из разных источников или при пользовательском вводе в массиве могут появляться повторяющиеся элементы, что затрудняет дальнейший анализ и приводит к искажению результатов.
Для нормализации данных необходимо удалить все дубликаты, оставив в массиве только уникальные значения.
Задание
Разработайте программу на языке JavaScript, которая:
- принимает одномерный массив чисел;
- анализирует элементы массива и выявляет повторяющиеся значения;
- формирует новый массив, содержащий только уникальные числа;
- сохраняет порядок первого появления элементов;
- корректно обрабатывает особые случаи:
- пустой массив;
- массив с одним элементом;
- массив, состоящий только из одинаковых значений.
При реализации используйте базовые средства языка JavaScript
(циклы, условные операторы или встроенные структуры данных).
Результат
- в консоль выводится массив чисел без повторяющихся значений;
- каждый элемент в результирующем массиве представлен в единственном экземпляре;
- исходный массив не изменяется.
Задание 21.
Кейс
В учебном web-приложении реализуется модуль работы с числовыми данными, вводимыми пользователем.
Одной из базовых задач для отработки алгоритмического мышления и работы с циклами является формирование таблицы умножения для заданного числа.
Полученная таблица может использоваться как для учебных целей, так и для визуальной демонстрации работы программного алгоритма.
Задание
Разработайте программу на языке JavaScript, которая:
- принимает числовое значение, введённое пользователем;
- проверяет корректность введённых данных (число);
- формирует таблицу умножения для данного числа в заданном диапазоне (например, от 1 до 10);
- использует циклические конструкции для генерации строк таблицы;
- обеспечивает вывод результата в удобном для восприятия виде.
Результат
- таблица умножения выводится в консоль либо отображается на странице;
- каждая строка таблицы содержит множители и результат умножения;
- программа корректно обрабатывает некорректный ввод пользователя.
Задание 22.
Кейс
В образовательном web-приложении хранится массив числовых оценок обучающихся.
Для анализа успеваемости и формирования отчётных данных требуется преобразовать числовые оценки в категориальные значения, соответствующие принятой шкале оценивания (от 2 до 5).
Категоризация оценок позволяет упростить представление результатов и использовать их для статистической обработки.
Задание
Разработайте программу на языке JavaScript, которая:
- принимает массив числовых оценок;
- анализирует каждое значение массива;
- преобразует числовые оценки в категориальные значения в диапазоне от 2 до 5 в соответствии с заданными правилами;
- формирует новый массив категорий;
- корректно обрабатывает особые случаи:
- пустой массив;
- некорректные значения оценок;
- граничные значения шкалы.
При реализации используйте условные операторы и/или методы обработки массивов.
Результат
- в консоль выводится массив категорий, соответствующих исходным оценкам;
- каждая оценка преобразована в допустимую категорию (2–5);
- исходный массив оценок остаётся неизменным.
Задание 23.
Кейс
В web-приложении на странице размещено несколько однотипных кнопок, объединённых в общий контейнер.
Количество кнопок может изменяться динамически (добавление или удаление элементов во время работы приложения). Назначение отдельного обработчика события для каждой кнопки в таком случае является неэффективным.
Для оптимизации обработки пользовательских действий требуется реализовать механизм делегирования событий, при котором один обработчик, назначенный контейнеру, реагирует на клики по вложенным элементам.
Задание
Разработайте клиентский скрипт на языке JavaScript, который:
- определяет общий контейнер, содержащий кнопки;
- назначает один обработчик события
clickна контейнер; - определяет, по какому элементу была выполнена операция клика;
- обрабатывает событие только в случае клика по кнопке;
- корректно работает при динамическом добавлении новых кнопок в контейнер.
При реализации используйте механизм всплытия событий и свойства объекта события.
Результат
- обработчик корректно реагирует на клики по всем кнопкам внутри контейнера;
- отдельные обработчики для каждой кнопки не используются;
- логика обработки событий остаётся корректной при изменении количества кнопок на странице.
Задание 24.
Кейс
В web-приложении осуществляется обработка текстовых данных, представленных в виде массива строк.
Такие данные могут формироваться на основе пользовательского ввода, результатов поиска, комментариев или иных текстовых источников. Для анализа и нормализации информации требуется определить наиболее длинную строку в наборе данных.
Задание
Разработайте программу на языке JavaScript, которая:
- принимает одномерный массив строк;
- определяет длину каждой строки;
- сравнивает длины строк между собой;
- находит строку с максимальной длиной;
- корректно обрабатывает особые случаи:
- пустой массив;
- массив, содержащий одну строку;
- наличие нескольких строк одинаковой максимальной длины.
При реализации используйте базовые конструкции языка JavaScript
(циклы или методы обработки массивов).
Результат
- в консоль выводится самая длинная строка из массива;
- если массив пуст, выводится диагностическое сообщение;
- исходный массив строк остаётся неизменным.
Задание 25.
Кейс
В web-приложении выполняется обработка числовых данных, представленных в виде массива значений.
Такие данные могут поступать из пользовательского ввода, файла или внешнего источника и требуют предварительной классификации для дальнейшего анализа.
Одной из базовых операций является разделение чисел на чётные и нечётные, что позволяет продемонстрировать навыки условной логики и работы с массивами.
Задание
Разработайте программу на языке JavaScript, которая:
- принимает одномерный массив чисел;
- последовательно анализирует каждый элемент массива;
- определяет, является ли число чётным или нечётным;
- формирует два отдельных массива:
- массив чётных чисел;
- массив нечётных чисел;
- корректно обрабатывает особые случаи:
- пустой массив;
- массив, содержащий только чётные или только нечётные числа;
- наличие отрицательных и нулевых значений.
При реализации используйте базовые конструкции языка JavaScript
(условные операторы, циклы или методы обработки массивов).
Результат
- в консоль выводятся два массива: чётных и нечётных чисел;
- каждый элемент исходного массива включён ровно в один из результирующих массивов;
- порядок элементов внутри массивов сохраняется.
Задание 26.
Кейс
В учебном web-приложении реализуется модуль математических вычислений, принимающий числовые данные от пользователя.
Одной из базовых алгоритмических задач является вычисление факториала числа, что позволяет отработать навыки использования циклов, рекурсии и проверки корректности входных данных.
Факториал натурального числа ( n ) определяется как произведение всех целых чисел от 1 до ( n ).
Задание
Разработайте программу на языке JavaScript, которая:
- принимает числовое значение, введённое пользователем;
- проверяет корректность введённых данных (целое неотрицательное число);
- реализует алгоритм вычисления факториала (итеративный или рекурсивный);
- корректно обрабатывает особые случаи:
- значение 0 (факториал равен 1);
- отрицательное число;
- нецелое или нечисловое значение.
При реализации используйте базовые конструкции языка JavaScript
(циклы, условные операторы или функции).
Результат
- в консоль выводится значение факториала введённого числа;
- при некорректном вводе выводится диагностическое сообщение;
- вычисление выполняется корректно для всех допустимых входных значений.
Задание 27.
Кейс
В информационной системе учёта заказов хранится массив данных о заказах клиентов.
Каждый заказ содержит информацию о клиенте и сумме заказа. Для формирования аналитических отчётов и контроля финансовых показателей требуется агрегировать данные по каждому клиенту.
Необходимо рассчитать общую сумму заказов для каждого клиента на основе массива заказов.
Задание
Разработайте программу на языке JavaScript, которая:
- принимает массив объектов заказов;
- анализирует свойства, идентифицирующие клиента и сумму заказа;
- группирует заказы по клиентам;
- вычисляет суммарную стоимость заказов для каждого клиента;
- формирует объект, в котором:
- ключ — идентификатор или имя клиента;
- значение — общая сумма его заказов;
- корректно обрабатывает особые случаи:
- пустой массив заказов;
- клиент с одним заказом;
- несколько заказов одного клиента;
- некорректные или отсутствующие суммы.
При реализации используйте базовые конструкции языка JavaScript
(циклы или методы агрегации данных).
Результат
- в консоль выводится объект, содержащий суммы заказов по каждому клиенту;
- для каждого клиента отображается итоговая сумма его заказов;
- исходный массив заказов остаётся неизменным.
Задание 28.
Кейс
В web-приложении реализуется модуль первичной обработки текстовых данных, вводимых пользователем.
Строка может представлять собой предложение, абзац или произвольный текст, содержащий слова, пробелы и знаки препинания. Для анализа текста и получения статистических показателей требуется определить количество слов во введённой строке.
Подсчёт количества слов используется для оценки объёма текста, анализа пользовательского контента и демонстрации работы со строками.
Задание
Разработайте программу на языке JavaScript, которая:
- принимает строку, введённую пользователем;
- выполняет предварительную обработку строки (удаление лишних пробелов, нормализация);
- разделяет строку на слова по разделителям (пробелы, при необходимости — знаки препинания);
- подсчитывает количество слов;
- корректно обрабатывает особые случаи:
- пустая строка;
- строка, состоящая только из пробелов;
- несколько пробелов между словами.
При реализации используйте базовые средства языка JavaScript
(методы работы со строками и массивами).
Результат
- в консоль выводится числовое значение — количество слов во введённой строке;
- при отсутствии слов выводится значение 0;
- подсчёт выполняется корректно независимо от количества пробелов между словами.
Задание 29.
Кейс
В web-приложении используется массив однотипных объектов, полученных из внешнего источника (например, ответ API, результат чтения файла или данные формы).
Каждый объект содержит уникальный идентификатор id, по которому требуется обеспечить быстрый доступ к данным.
Для оптимизации структуры хранения необходимо преобразовать массив объектов в объект, где ключами будут значения id, а значениями — соответствующие объекты.
Задание
Разработайте программу на языке JavaScript, которая:
- принимает массив объектов;
- проверяет наличие уникального свойства
idу каждого объекта; - преобразует массив в объект следующего вида:
- ключ — значение
id; - значение — исходный объект;
- корректно обрабатывает особые случаи:
- пустой массив;
- отсутствие свойства
idу объекта; - повторяющиеся значения
id.
При реализации использууйте базовые конструкции языка JavaScript
(циклы или методы агрегации данных).
Результат
- в консоль выводится объект, сформированный на основе массива по полю
id; - каждый объект доступен по своему идентификатору;
- исходный массив объектов остаётся неизменным.
Задание 30.
Кейс
В web-приложении пользователь заполняет форму (например, регистрация, обратная связь, оформление заказа).
Перед отправкой данных необходимо корректно считать значения полей, проверить их на соответствие требованиям и только после этого подтвердить успешную обработку или вывести сообщение об ошибке.
Цель кейса — отработать навыки работы с DOM, событиями формы и базовой валидацией пользовательского ввода.
Задание
Разработайте обработчик формы на языке JavaScript, который:
- перехватывает событие отправки формы (
submit) и предотвращает стандартную отправку страницы; - получает значения всех необходимых полей формы (например:
name,email,password); - выполняет валидацию данных по правилам:
- обязательные поля не должны быть пустыми;
emailдолжен соответствовать формату email (RegExp);- пароль должен иметь минимальную длину (например, 8 символов) и содержать хотя бы одну цифру;
- формирует список ошибок (если они есть), чтобы пользователь понял, что исправить;
- при успешной проверке выводит сообщение об успешной отправке/обработке данных.
Дополнительно предусмотреть обработку крайних случаев: пробелы в начале/конце, пустые строки, некорректные символы.
Результат
- при корректном заполнении формы выводится сообщение: «Успех: данные приняты» (в консоль или на страницу);
- при ошибках выводится сообщение «Ошибка» с перечислением причин (например: «email некорректен», «пароль слишком короткий»);
- обработка происходит без перезагрузки страницы, поведение формы контролируется JavaScript.