JavaScript: junior

В данной статье мы разберем важную концепцию языка JavaScript — вложенные функции и замыкания. Вы узнаете, как функции, определенные внутри других функций, могут получать доступ к переменным внешней области видимости и почему это полезно. Мы рассмотрим примеры кода, которые демонстрируют, как замыкания помогают структурировать программу, сохранять состояние и эффективно управлять данными.

👉🏻Навигация по всем материалам в Telegram

Вопрос 1

Переменные типа «число» в JavaScript могут содержать...

Варианты ответа:

Только положительные числа
Только целые числа
Только числа с плавающей точкой
Только целые числа произвольной длины
Как целые числа, так и числа с плавающей точкой

Обоснование:
В языке JavaScript переменные типа number могут содержать как целые числа, так и числа с плавающей точкой. Этот тип данных основан на спецификации IEEE 754, которая поддерживает представление чисел в виде 64-битных значений. Кроме того, number может содержать специальные значения, такие как NaN (Not a Number) и Infinity, но в рамках вопроса это не затрагивается.

📌Правильный ответ: 5. Как целые числа, так и числа с плавающей точкой.

Вопрос 2

Как называется область видимости в JavaScript, которая позволяет объявлять переменные, доступные только внутри блока, где они были определены?

Варианты ответа:

Область видимости объекта
Область видимости цикла
Функциональная область видимости
Блочная область видимости
Глобальная область видимости

Обоснование:
В JavaScript блочная область видимости была введена с использованием ключевых слов let и const (начиная с ECMAScript 6). Эти переменные доступны только внутри блока, в котором они определены, включая конструкции if, for, и другие блоки кода, ограниченные фигурными скобками {}. Это отличает их от переменных, объявленных с помощью var, которые имеют функциональную область видимости.

📌Правильный ответ: 4. Блочная область видимости.

Вопрос 3

Перед вами поставили задачу написать веб-приложение «Крестики-нолики». По техническому заданию вам необходимо сохранять состояние игры. Например, вы можете сохранить текущего игрока, расположение крестиков и ноликов на игровом поле и другие данные, чтобы игра могла быть возобновлена после перезагрузки страницы. Какой тип хранилища вы подберете?

Варианты ответа:

sessionStorage
IndexedDB
Атрибуты форм (Form Attributes)
LocalStorage
Куки (cookies)

Обоснование:
Для сохранения данных, которые должны быть доступны после перезагрузки страницы, оптимальным выбором будет использование LocalStorage. Этот тип хранилища позволяет сохранять данные в браузере на постоянной основе, пока они не будут явно удалены.

sessionStorage сохраняет данные только в рамках текущей сессии, то есть при закрытии вкладки данные теряются, поэтому он не подходит для указанной задачи.
IndexedDB — мощное хранилище, подходящее для работы с большими объемами данных. Однако для задачи сохранения простого состояния игры это избыточное решение.
Атрибуты форм (Form Attributes) и куки (cookies) менее удобны и менее производительны по сравнению с LocalStorage, особенно если учитывать объём данных и необходимость быстрого доступа к ним.

📌Правильный ответ:
4. LocalStorage.

Вопрос 4

Чему будет равен z после выполнения следующего кода?Ы

Варианты ответа:

Обоснование:
Оператор % в JavaScript возвращает остаток от деления. В данном случае:

x = 5
y = 2
Рассчитаем остаток:
5÷2=25 \div 2 = 25÷2=2 (целая часть от деления)
Остаток равен 5−(2×2)=15 - (2 \times 2) = 15−(2×2)=1.

Таким образом, результат переменной z будет равен 1.

📌Правильный ответ:

Вопрос 5

Какой оператор используется для логического И (AND)?

Варианты ответа:

||
^
&&
&
!

Обоснование:
В JavaScript логический оператор И (AND) обозначается двойным амперсандом &&. Этот оператор возвращает true, если оба операнда являются истинными (truthy).

|| — логический оператор ИЛИ (OR).
^ — побитовый оператор XOR (исключающее ИЛИ).
& — побитовый оператор И (AND), но не логический.
! — логический оператор НЕ (NOT).

📌Правильный ответ:
3. &&.

Вопрос 6

Что нужно вставить на место пропуска, чтобы выражение возвращало true с учетом типа данных?

Варианты ответа:

= =
<>
! =
= = =
=

Обоснование:
Оператор строгого равенства === проверяет равенство не только значений, но и типов данных. В данном случае число 5 (тип number) и строка '5' (тип string) имеют разные типы, поэтому только оператор == (нестрогое равенство) мог бы вернуть true, выполняя преобразование типов. Однако в вопросе уточняется, что проверка должна учитывать тип данных, поэтому подходит только ===.

= = проверяет равенство значений, игнорируя тип.
<> — некорректный оператор в JavaScript.
! = и ! = = — операторы неравенства.
= — это оператор присваивания.

📌Правильный ответ:
4. = = =.

Вопрос 7

Что произойдет при выполнении следующего кода?

Варианты ответа:

Зависит от значения переменной x
В консоль будет выведено «x находится в диапазоне от 5 до 15»
В консоль будет выведено «x не находится в диапазоне от 5 до 15»
Будет выброшена ошибка синтаксиса
Ничего не произойдет, так как код содержит ошибку

Обоснование:
Код проверяет условие, используя логический оператор && (И). Для переменной x = 10, условие x > 5 && x < 15 выполняется, так как:

x>5x > 5x>5 возвращает true,
x<15x < 15x<15 также возвращает true.

Поскольку оба условия истинны, выполняется тело первого блока if, и в консоль выводится:

Код синтаксически корректен, ошибок в нем нет.

📌Правильный ответ:
2. В консоль будет выведено «x находится в диапазоне от 5 до 15».

Вопрос 8

У вас есть задача, в которой:

Важно, чтобы при любых обстоятельствах блок кода выполнялся минимум один раз.
Есть динамические условия, которые могут изменяться в ходе выполнения блока кода.
Количество итераций заранее неизвестно.

Какой тип оператора оптимально использовать для решения этой задачи?

Варианты ответа:

for
оператор ?
if else
while
рекурсия

Обоснование:
Для выполнения блока кода как минимум один раз независимо от условия, а затем выполнения цикла на основании динамического условия, оптимальным выбором является оператор do...while, который, однако, в списке вариантов не указан. Среди предложенных вариантов подходит while, так как он выполняет цикл на основе условий, которые могут изменяться, хотя он не гарантирует выполнение кода хотя бы один раз.

Рассмотрение вариантов:

for используется для случаев, когда известно количество итераций, что не подходит для задачи.
оператор ? (тернарный оператор) предназначен для выбора одного из двух значений и не связан с циклами.
if else выполняет условные ветки, но не организует циклы.
рекурсия может использоваться, но это менее эффективное и сложное решение для данной задачи.

📌Правильный ответ:
4. while.

(Оптимальный вариант вне списка — do...while, если предполагается выполнение блока кода минимум один раз.)

Вопрос 9

Какой из перечисленных вариантов объявления функции с параметрами является верным?

Варианты ответа:

function myFunction(parameters) {}
function myFunction() {}
function myFunction {parameters}
function myFunction = () => parameters
function myFunction(parameters)

Обоснование:
Для объявления функции в JavaScript с использованием ключевого слова function необходимо соблюдать следующий синтаксис:

Рассмотрим варианты:

Вариант 1: Правильный синтаксис для определения функции с параметрами.
Вариант 2: Правильный синтаксис для функции без параметров.
Вариант 3: Неверный синтаксис, так как отсутствуют круглые скобки и фигурные скобки использованы некорректно.
Вариант 4: Неверный синтаксис, так как используется стрелочная функция, но она записана с ошибкой. Правильный синтаксис для стрелочной функции:

Вариант 5: Неверный синтаксис, так как отсутствует тело функции {}.

📌Правильный ответ:

function myFunction(parameters) {}.

Вопрос 10

Какое значение будет выведено в консоль при выполнении кода?

Варианты ответа:

10
20
30
40
Ошибка: переменная не определена

Обоснование:
В данном коде используется концепция замыкания (closure). Функция innerFunction имеет доступ к переменной x, определенной в функции outerFunction, благодаря области видимости JavaScript. Переменная y объявлена внутри innerFunction и используется локально.

Во время выполнения:

Значение x равно 10,
Значение y равно 20.
Оператор console.log(x + y) суммирует x и y, результатом является 10 + 20 = 30.

Код корректен и не содержит ошибок.

📌Правильный ответ:
3. 30.

Заключение

Понимание вложенных функций и замыканий играет ключевую роль при работе с JavaScript, особенно в современном веб-разработке. Замыкания позволяют эффективно использовать области видимости, создавая гибкий и чистый код. Их применение широко распространено в обработчиках событий, модулях, функциях обратного вызова и других аспектах программирования. Используя вложенные функции и замыкания, вы сможете разрабатывать более надежные и структурированные приложения.