JavaScript: middle

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

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

Вопрос 1

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

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

1. 14
2. Ошибка
3. 10
4. 12
5. 7

Обоснование:

1. Анализ выражения:
• x.concat(y) создает новый массив, объединяя массивы x и y. Результат: [1, 2, 3, 4, 5, 6].
• Доступ к элементу [1] массива [1, 2, 3, 4, 5, 6] возвращает значение 2.
• 2 * 2 вычисляется как 4.
• y.length возвращает длину массива y, которая равна 3.
• 4 + 3 вычисляется как 7.
2. Ошибок в коде нет: Все операции корректны, и код выполняется без проблем.

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

Вопрос 2

Какое из следующих утверждений НЕВЕРНО относительно типов данных и хранения данных в JavaScript?

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

1. Куки (cookies) могут быть только на клиентской стороне и используются для хранения информации о состоянии пользователя. Они имеют ограничение по размеру в несколько мегабайтов и могут быть подписаны для обеспечения целостности данных.
2. sessionStorage сохраняет данные только в рамках текущего сеанса работы браузера и удаляет их после закрытия вкладки или окна.
3. В JavaScript есть специальные типы данных для работы с датами и временем, такие как Date, Time и DateTime.
4. Переменная в JavaScript может быть объявлена с использованием одного из трех ключевых слов: let, const или var.
5. localStorage используется для хранения данных на клиентской стороне браузера без ограничений по сроку хранения.

Обоснование:

1. Первое утверждение:
• Частично корректное. Куки действительно используются на клиентской стороне для хранения состояния пользователя, но максимальный размер куки обычно составляет 4 КБ, а не несколько мегабайтов.
2. Второе утверждение:
• Корректное. sessionStorage ограничен текущим сеансом браузера и удаляет данные после закрытия вкладки или окна.
3. Третье утверждение:
• Неверное. В JavaScript есть только один специальный тип данных для работы с датами — Date. Типы Time и DateTime не существуют.
4. Четвертое утверждение:
• Корректное. Переменные в JavaScript действительно можно объявить с помощью ключевых слов let, const или var.
5. Пятое утверждение:
• Корректное. localStorage используется для хранения данных на клиентской стороне и не имеет ограничений по сроку хранения.

📌Правильный ответ:
3. В JavaScript есть специальные типы данных для работы с датами и временем, такие как Date, Time и DateTime.

Вопрос 3

Какое из следующих утверждений логически НЕВЕРНО?

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

1. typeof null ! = = 'object'
2. 'apple' ! = = 'string1'
3. 5 >= '3'
4. 7 < 11
5. 'cat' ! = = "dog"

Обоснование:

1. typeof null ! = = 'object':
• Неверное утверждение. typeof null всегда возвращает 'object', поэтому правильное выражение: typeof null === 'object'.
• Это утверждение логически неверно.
2. 'apple' ! = = 'string1':
• Корректное. 'apple' и 'string1' — это разные строки, так что выражение возвращает true.
3. 5 >= '3':
• Корректное. В JavaScript при сравнении число '3' (строка) автоматически приводится к числу. Таким образом, 5 >= 3 возвращает true.
4. 7 < 11:
• Корректное. 7 действительно меньше 11, выражение возвращает true.
5. 'cat' ! = = "dog":
• Корректное. 'cat' и "dog" — это разные строки, так что выражение возвращает true.

📌Правильный ответ:
1. typeof null ! = = 'object'

Вопрос 4

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

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

1. false
2. true
3. ReferenceError: array2 is not defined
4. NaN
5. undefined

Обоснование:

1. Сравнение массивов в JavaScript:
• В JavaScript массивы являются ссылочными типами данных.
• Операция строгого равенства (===) для ссылочных типов сравнивает ссылки, а не значения внутри массива.
• В данном коде array1 и array2 указывают на разные объекты в памяти, несмотря на одинаковое содержимое массивов.
2. Результат:
• Ссылки на array1 и array2 различны, поэтому array1 === array2 возвращает false.
3. Ошибок в коде нет: Оба массива определены корректно, поэтому исключений не возникает.

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

Вопрос 5

Вам нужен оператор, который подойдет для целей:

• Выполнения различных действий в зависимости от условия
• Быстрого переключения между условиями нескольких возможных значений
• Сравнения строго по значению и типу данных

Какой оператор лучше использовать?

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

1. switch-case
2. for
3. if-else
4. do-while
5. while

Обоснование:

1. switch-case:
• Этот оператор идеально подходит для выполнения действий в зависимости от значений.
• Он позволяет быстро переключаться между различными условиями.
• В выражениях case выполняется строгое сравнение (===), что соответствует требованию строго по значению и типу данных.
2. for:
• Этот оператор используется для циклического выполнения кода и не предназначен для выбора действий на основе условий.
3. if-else:
• Также может использоваться для выполнения условий, но менее удобен, когда требуется переключение между множеством значений, поскольку приводит к длинным вложенным конструкциям.
4. do-while и while:
• Это операторы циклов и не подходят для выполнения условий или переключения между значениями.

📌Правильный ответ: 1. switch-case

Вопрос 6

Какую область видимости имеет функция, объявленная с использованием ключевого слова const в JavaScript?

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

1. Область видимости блока
2. Область видимости функции
3. Глобальная область видимости
4. Область видимости модуля
5. Область видимости объекта

Обоснование:

1. Область видимости переменных, объявленных через const:

• Ключевое слово const в JavaScript задает переменные с областью видимости блока. Это означает, что переменная доступна только внутри того блока кода, где она была объявлена (например, внутри {}).

2. Функция, объявленная через const:

• Если функцию объявить через const, она становится доступной только внутри блока, в котором была определена. Например:

3. Исключения:

• Переменные и функции, объявленные с const внутри модуля, имеют модульную область видимости. Но в данном случае вопрос касается общего использования.

📌Правильный ответ: 1. Область видимости блока

Вопрос 7

Какой код необходимо подставить на место пропуска, чтобы в результате получился ответ [20, 40, 60, 80, 100]?

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

1. for (let i = 1; i > array.length; i++)
2. for (let i = 0; i < array.length; i++)
3. for (var i = 0; i > array.length; i = i + 1)
4. for (const i = 0; i < array.length; i++)
5. for (const i = 0; i < array.length; i++)

Обоснование:

Цель:

• Мы хотим пройтись по массиву myArray, умножить каждый элемент массива на 2, чтобы получить результат [20, 40, 60, 80, 100].

Правильная структура цикла:

Цикл for должен:

1. Начинаться с i = 0, так как индексация массива начинается с нуля.
2. Условие должно быть i < array.length, чтобы пройти по всем элементам массива.
3. Инкрементировать i после каждой итерации, используя i++.

Анализ вариантов:

• Вариант 1: for (let i = 1; i > array.length; i++) — Неверно. Индекс начинается с 1, а условие i > array.length сразу делает цикл неработоспособным.
• Вариант 2: for (let i = 0; i < array.length; i++) — Верно. Этот цикл корректно проходит по массиву от начала до конца.
• Вариант 3: for (var i = 0; i > array.length; i = i + 1) — Неверно. Условие i > array.length делает цикл неработоспособным.
• Вариант 4: for (const i = 0; i < array.length; i++) — Неверно. Использование const недопустимо для изменяемой переменной цикла.
• Вариант 5: Дублирует ошибку варианта 4.

📌Правильный ответ: 2. for (let i = 0; i < array.length; i++)

Вопрос 8

Как вы организуете структуру данных для хранения информации о товарах?

Техническое задание:

• Создать место для хранения обобщенной информации о проданных товарах.
• Добавлять новые записи о продажах в раздельные списки данных (сумма продажи, количество проданных единиц).
• Рассчитывать общую прибыль и выводить два списка: все проданные товары и общая прибыль.

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

1. Использую глобальные переменные
2. Использую только объекты
3. Буду хранить данные в виде строк
4. Использую вложенные массивы
5. Использую массив объектов

Обоснование:

Анализ задачи:

• Хранение данных о товарах требует структурированного подхода для доступа к полям (например, названию товара, количеству, цене).
• Необходимо обеспечить возможность добавления новых записей и расчета прибыли.

Анализ вариантов:

• Глобальные переменные: Использование глобальных переменных нежелательно из-за сложности масштабируемости и возможных ошибок. Это плохой выбор.
• Только объекты: Подход возможен, но затруднительно обрабатывать списки записей и добавлять новые товары.
• Хранение данных в строках: Неверно. Строки не подходят для хранения структурированной информации, так как их сложно анализировать и изменять.
• Вложенные массивы: Можно использовать, но затруднительно связывать данные (например, название товара с его количеством и ценой).
• Массив объектов: Это наиболее подходящий способ. Каждый объект может представлять товар с ключами: название, количество, цена. Пример:

Дополнительные возможности: Легко рассчитать общую прибыль

const totalProfit = sales.reduce((acc, item) => acc + item.quantity * item.price, 0);

📌Правильный ответ: 5. Использую массив объектов

Вопрос 9

Какую концепцию наследования в JavaScript демонстрирует код ниже?

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

1. Прототипное наследование
2. Иерархическое наследование
3. Классическое наследование
4. Функциональное наследование
5. Множественное наследование

Обоснование:

1. Анализ кода:
• Объект vehicle содержит метод getInfo.
• Новый объект myCar создается с помощью функции Object.create(vehicle), что устанавливает vehicle как прототип для myCar.
• Свойства model и year добавляются непосредственно в myCar, но метод getInfo вызывается из прототипа.
2. Концепция наследования:
• JavaScript использует прототипное наследование, где объекты наследуют свойства и методы от других объектов (их прототипов).
• В данном случае объект vehicle является прототипом для myCar.
3. Исключения:
• Иерархическое наследование: Эта концепция относится к деревьям наследования, что не явно видно в данном коде.
• Классическое наследование: Используется в языках, таких как Java, но в данном коде явно задействовано прототипное наследование.
• Функциональное наследование: Связано с использованием фабричных функций, что здесь не применяется.
• Множественное наследование: JavaScript не поддерживает прямое множественное наследование.

📌Правильный ответ: 1. Прототипное наследование

Вопрос 10

Какой из вариантов ответа точно описывает особенности прототипного наследования в JavaScript?

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

1. Прототипное наследование в JavaScript использует классы для определения наследования и передачи свойств и методов.
2. Прототипное наследование позволяет объекту наследовать свойства и методы другого объекта через прототипное ссылочное соответствие.
3. Прототипное наследование позволяет создавать копии объекта при помощи конструктора.
4. Прототипное наследование в JavaScript позволяет объекту наследовать свойства и методы другого объекта через функциональное ссылочное соответствие.
5. Прототипное наследование обеспечивает наследование только унаследованных свойств и методов прототипа объекта.

Обоснование:

1. Анализ концепции прототипного наследования:
• Прототипное наследование в JavaScript позволяет объектам наследовать свойства и методы от другого объекта, который является их прототипом. Это достигается через ссылку на прототип.
• Механизм реализуется с помощью свойства [[Prototype]], а для работы с ним используются методы, такие как Object.create или Object.setPrototypeOf.
2. Анализ вариантов:
• Вариант 1: Неверно. Хотя JavaScript поддерживает классы (начиная с ES6), они являются синтаксическим сахаром для прототипного наследования. Само прототипное наследование не зависит от классов.
• Вариант 2: Верно. Этот вариант точно описывает суть прототипного наследования, где объект наследует свойства и методы через ссылку на прототип.
• Вариант 3: Неверно. Создание копий объекта не связано с прототипным наследованием.
• Вариант 4: Неверно. Наследование в JavaScript не является функциональным, оно основано на прототипах.
• Вариант 5: Неверно. Прототипное наследование обеспечивает доступ ко всем свойствам и методам объекта-прототипа.

📌Правильный ответ: 2. Прототипное наследование позволяет объекту наследовать свойства и методы другого объекта через прототипное ссылочное соответствие.

Вопрос 11

Какое утверждение об этом коде верно?

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

1. Функция greeting сохраняет значение переменной name только внутри самой функции.
2. Функция sayHello принимает аргумент и возвращает строку.
3. Переменная message будет доступна за пределами функции greeting.
4. Функция sayHello выводит на экран строку, содержащую сообщение приветствия и имя.
5. Функция greeting создает новый объект, содержащий метод sayHello.

Обоснование:

1. Замыкания:
• В данном коде функция greeting возвращает вложенную функцию sayHello, которая сохраняет доступ к переменным из области видимости функции greeting (замыкание).
• Переменные message и name остаются доступными внутри sayHello, даже после завершения выполнения функции greeting.
2. Анализ утверждений:
• 1: Неверно. Замыкание позволяет name быть доступным внутри sayHello, даже после завершения функции greeting.
• 2: Неверно. Функция sayHello не принимает аргументов и ничего не возвращает — она вызывает console.log.
• 3: Неверно. Переменная message является локальной для функции greeting и недоступна за её пределами.
• 4: Верно. Функция sayHello выводит строку Hello, John в консоль, используя значения message и name.
• 5: Неверно. Функция greeting возвращает функцию, а не объект.

📌Правильный ответ: 4. Функция sayHello выводит на экран строку, содержащую сообщение приветствия и имя.

Вопрос 12

В каком из перечисленных случаев стоит использовать Promise?

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

1. При создании условия ветвления (if-else)
2. При определении функции
3. При исполнении цикла
4. При использовании запросов к серверу
5. При объявлении переменных

Обоснование:

Что такое Promise:

1. Promise в JavaScript используется для работы с асинхронными операциями, такими как запросы к серверу, таймеры или чтение файлов.
2. Он представляет объект, который может находиться в одном из трёх состояний:
• Pending (ожидание): операция ещё не завершена.
• Fulfilled (выполнено): операция завершена успешно.
• Rejected (отклонено): операция завершилась с ошибкой.

Когда использовать Promise:

• Для обработки асинхронных операций, особенно когда результат неизвестен на момент вызова.
• Типичный пример — запросы к серверу. Например:

Анализ вариантов:

1: Условие if-else работает синхронно и не требует использования Promise.

2: Определение функции — это синхронная операция. Promise может быть частью функции, но не требуется для её определения.

3: Циклы выполняются синхронно. Для асинхронных операций внутри цикла можно использовать Promise, но сам цикл не требует их.

4: Верно. Запросы к серверу — асинхронная операция, и Promise подходит для её обработки.

5: Объявление переменных выполняется синхронно, поэтому Promise не нужен.

📌Правильный ответ: 4. При использовании запросов к серверу

Заключение

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