02

JS: объекты

JavaScript: объекты, массивы, функции

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

Порядок выполнения лабораторной работы:

  1. Изучить:
    • синтаксис создания функций (объявление функции, функциональное выражение, стрелочные функции), параметры/аргументы, возврат значения;
    • массивы (методы pop/push, shift/unshift, перебор for .. of, метод forEach);
    • объекты (ключ: значение, перебор for .. in, методы delete, keys, values, entries);
    • объект Math, его свойства и методы.
  2. Для выполнения работы необходимо:
    • В репозитории с прошлого занятия, переключиться назад на ветку main и только после этого создать и переключиться на ветку lab2 и работать в ней.
    • Создать документ html с H1 заголовком «ФИО - Лабораторная работа №2».
    • Решить предложенные задачи используя JS. Перед решением задачи напишите “тесты” с помощью console.assert(condition, сообщение) минимум по 4 assert: 2 на положительный сценарий и 2 на отрицательный.
    • Подключить решения к созданной странице.
  3. Зафиксировать результаты работы с помощью системы контроля версий git и отправить ветку lab2 в репозиторий на github.
  4. Загрузить проект на Render через ручную загрузку (manual deploy).

Требования к JS:

  • Все задачи имеют решение и требуемый в них вывод.
  • Отсутствуют ошибки в консоли браузера при работе с веб-страницей.

Результаты выполнения лабораторной работы:

Результаты работы проверены наставником.

Статическая веб-страница на хостинге, со структурой и оформлением, которая соответствует требованиям и сохранена в системе контроля версий.

Источники

Задачи

Работа с объектом

Напишите код, который создает объект, выводит список этих свойств и сообщение вида “Студент Имя Фамилия учится в номер группе”. Список свойств требуется получить, используя метод или цикл.

Пример объекта:

let student = {
   group: 201,
   lastName: "Иванов",
   firstName: "Иван"
};

Пример вывода:

> Список свойств: group, lastName, firstName
> Студент Иван Иванов учится в 201 группе

Сэндвичи с сыром

Для сэндвича требуется два ломтика хлеба и один ломтик сыра. Напишите функцию, которая посчитает максимально возможное количество сэндвичей. Информация о количестве ингридиентов хранится в объекте. В функции можно использовать деструктуризацию объекта (деструктурирующее присваивание).

Пример работы:

countSandwiches({bread: 5, cheese: 6}) -> 2

Функция конвертации температуры

Код из первой задачи прошлой лабораторной работы переработать в функцию convertTemperature, которая принимает два параметра: значение температуры и направление преобразования. Функция возвращает в виде строки температуру в других единицах измерения.

Пример работы:

convertTemp(32, 'toC') -> '0 C'
convertTemp(10, 'toF') -> '50 F'

Абсолютное значение

Напишите функцию absValue без Math.abs(x), которая в качестве параметра принимает число и возвращает его абсолютное значение (по модулю).

Пример работы:

absValue(-2) -> 2
absValue(100) -> 100
absValue(0) -> 0

Случайные числа

Используя методы объекта Math создать функцию, которая возвращает целое случайно сгенерированное число в диапазоне от min до max.

Пример работы:

randomNumber(0, 10) -> 3
randomNumber(-10, 10) -> -4

Значения из массива

Используя функцию из прошлой задачи, реализовать функцию, которая возвращает случайные значения из массива в заданном количестве в виде нового массива.

Пример работы:

sampleArray([1,2,3,4], 2) -> [3, 4]
sampleArray([1,2,3,4], 3) -> [2, 2, 1]

Фильтрация массива

Напишите функцию, которая является аналогом метода filter у массива. Функция в качестве параметров принимает сам массив и функцию-фильтр, а возвращает новый массив с элементами прошедшими отбор. Элемент прошел отбор, если функция-фильтр вернула истину для него.

Передаваемая функция-фильтр должна работать с одним параметром и возвращать истину или ложь.

В качестве функции-фильтра можете проверять минимальную/минимальную длину строки или деление без остатка.

Пример работы:

function isFirstV(name) {
  return name.startsWith('V')
}

myFilterArray(['Short', 'VeryLong'], isFirstV) -> ['VeryLong']

Вопросы для защиты

  1. Как создаются функции?
  2. Как выполняется блок кода внутри функции?
  3. Как хранятся данные в массиве?
  4. Какие методы массивов вы знаете?
  5. Как обратиться к элементу массива?
  6. Как можно перебирать элементы массива?
  7. Что такое объект?
  8. Как получить значение из свойства объекта?
  9. Для чего используется объект Math?
  10. Приведите примеры свойств и методов в Math.
  11. Как запустить режим отладки и какие в нем есть возможности перемещения по коду?