Задачи к уроку 1.9: ES6 (ECMAScript 6) и его возможности

Задачи к уроку 1.9: ES6 (ECMAScript 6) и его возможности

18.02.2023
513
В данной статье мы рассмотрим задачи для закрепления материала к уроку 1.9, связанных с возможностями новой версии языка JavaScript - ES6 (ECMAScript 6).

Задача №1

Напишите функцию, которая принимает два аргумента и возвращает их сумму.

Решение:

function sum(a, b) {
  return a + b;
}

Описание решения:

В данном решении мы используем новый синтаксис определения функций в ES6, используя ключевое слово function, а также стрелочную функцию =>.

Задача №2

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

Решение:

const filterEven = (arr) => arr.filter(num => num % 2 === 0);

Описание решения:

В данном решении мы используем метод filter() для создания нового массива, содержащего только четные числа из исходного массива. Мы также используем стрелочную функцию =>, чтобы определить функцию-фильтр.

Задача №3

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

Решение:

const capitalize = (str) => str.replace(/\\b\\w/g, l => l.toUpperCase());

Описание решения:

В данном решении мы используем регулярное выражение, чтобы выбрать первую букву каждого слова в строке, и метод replace(), чтобы заменить каждую выбранную букву на ее заглавный эквивалент.

Задача №4

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

Решение:

// Создаем массив объектов со студентами, содержащими информацию о имени, возрасте и среднем балле.
const students = [
  {name: 'Alex', age: 22, averageGrade: 3.5},
  {name: 'Maria', age: 21, averageGrade: 4.2},
  {name: 'John', age: 23, averageGrade: 4.8},
  {name: 'Anna', age: 20, averageGrade: 3.9},
  {name: 'David', age: 24, averageGrade: 3.2},
];

// Создаем функцию-фильтр, которая принимает массив студентов и возвращает новый массив, содержащий только тех студентов, у которых средний балл выше 4.
const filterStudents = (students) => students.filter(student => student.averageGrade > 4);

Описание решения:

В данном коде мы создаем массив объектов students, содержащий информацию о студентах (имя, возраст, средний балл). Затем мы создаем функцию-фильтр filterStudents, которая принимает массив студентов и возвращает новый массив, содержащий только тех студентов, у которых средний балл выше 4.

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

Задача №5

Напишите функцию, которая принимает объект и возвращает новый объект, в котором ключи и значения поменяны местами.

Решение:

// Пример объекта, с которым производится работа
const obj = {a: 1, b: 2, c: 3};

// Создаем новый пустой объект
const inverted = {};

// Используем метод Object.keys() для получения массива ключей объекта obj, затем итерируемся по этому массиву с помощью метода forEach()
Object.keys(obj).forEach(key => {
  // Присваиваем каждому значению ключ исходного объекта в качестве ключа нового объекта inverted
  inverted[obj[key]] = key;
});

// Возвращаем новый объект, в котором ключи и значения поменяны местами
return inverted;

Описание решения:

В данном коде мы создаем объект obj, с которым производится работа, и используем метод Object.keys() для получения массива ключей объекта obj. Затем мы создаем новый пустой объект inverted и используем метод forEach() для итерации по массиву ключей объекта obj. Внутри цикла мы присваиваем каждому значению ключ исходного объекта obj в качестве ключа нового объекта inverted. Наконец, мы возвращаем новый объект, в котором ключи и значения поменяны местами.

Задача №6

Напишите функцию, которая принимает массив чисел и возвращает новый массив, в котором каждый элемент увеличен на 1.

Решение:

В данном коде мы создаем функцию incrementArray, которая принимает массив чисел и возвращает новый массив, в котором каждый элемент увеличен на 1.

// Пример массива, с которым производится работа
const arr = [1, 2, 3];

// Создаем функцию-обработчик, которая увеличивает каждый элемент массива на 1
const increment = (num) => num + 1;

// Создаем новый массив, используя метод map() и функцию-обработчик increment
const newArr = arr.map(increment);

// Выводим новый массив в консоль
console.log(newArr); // [2, 3, 4]

В данном примере мы создаем массив arr, с которым производится работа, и определяем функцию-обработчик increment, которая увеличивает каждый элемент массива на 1. Затем мы создаем новый массив newArr, используя метод map() и функцию-обработчик increment. Наконец, мы выводим новый массив в консоль.

Описание решения:

В данном решении мы используем метод map() для создания нового массива, в котором каждый элемент увеличен на 1. Мы также используем стрелочную функцию =>, чтобы определить функцию-обработчик increment. В комментариях к коду приведен пример массива, с которым производится работа, а также пояснения к использованным методам и функциям.

Задача №7

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

Решение:

Данный код содержит функцию mergeObjects, которая принимает два объекта и возвращает новый объект, содержащий свойства обоих объектов.

// Пример объектов, с которыми производится работа
const obj1 = {a: 1, b: 2};
const obj2 = {c: 3, d: 4};

// Создаем функцию-объединитель, которая принимает два объекта и возвращает новый объект, содержащий свойства обоих объектов
const mergeObjects = (obj1, obj2) => ({...obj1, ...obj2});

В данном коде мы создаем объекты obj1 и obj2, с которыми производится работа. Затем мы создаем функцию-объединитель mergeObjects, которая принимает два объекта и возвращает новый объект, содержащий свойства обоих объектов.

Для объединения объектов мы используем оператор spread (...), который разворачивает свойства объектов в новом объекте, и возвращаем результат.

Описание решения:

В данном решении мы используем оператор spread (...) для объединения свойств двух объектов в новом объекте. Мы также используем фигурные скобки ({ }) для создания нового объекта и круглые скобки для оборачивания выражения с оператором spread.

Задача №8

Напишите функцию, которая принимает массив строк и возвращает новый массив, содержащий только те строки, которые содержат подстроку "JS".

Решение:

В данном коде мы создаем функцию filterJS, которая принимает массив строк и возвращает новый массив, содержащий только те строки, которые содержат подстроку "JS".

// Пример массива, с которым производится работа
const arr = ["JavaScript", "Python", "Ruby", "Java"];

// Создаем функцию-фильтр, которая принимает массив строк и возвращает новый массив, содержащий только те строки, которые содержат подстроку "JS"
const filterJS = (arr) => arr.filter(str => str.includes("JS"));

// Создаем новый массив, используя метод filter() и функцию-фильтр filterJS
const newArr = filterJS(arr);

// Выводим новый массив в консоль
console.log(newArr); // ["JavaScript"]

Описание решения:

В данном примере мы создаем массив arr, с которым производится работа. Затем мы создаем функцию-фильтр filterJS, которая принимает массив строк и возвращает новый массив, содержащий только те строки, которые содержат подстроку "JS". Мы также создаем новый массив newArr, используя метод filter() и функцию-фильтр filterJS. Наконец, мы выводим новый массив в консоль.

Задача №9

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

Решение:

const uniqueNumbers = (arr) => [...new Set(arr)];

Описание решения:

В данном решении мы используем конструктор Set() для создания уникального набора значений из исходного массива arr, а затем оператор "spread" (...) для преобразования набора обратно в массив.

Заключение

Как мы видим, ES6 (ECMAScript 6) предоставляет множество удобных возможностей для работы с языком JavaScript. Определение функций с помощью стрелочных функций, использование методов map(), filter() и reduce(), оператор "spread" (...) и многое другое позволяет нам писать более эффективный и удобочитаемый код.