Вебинары Разобраться в IT Реферальная программа
Программирование Аналитика Дизайн Маркетинг
06 Июл 2023
2 мин
537

Использование функции map для объектов в JavaScript

Часто в процессе работы с JavaScript возникает необходимость преобразовать каждое значение в объекте. Например, возьмем объект, где ключи — это названия

Часто в процессе работы с JavaScript возникает необходимость преобразовать каждое значение в объекте. Например, возьмем объект, где ключи — это названия продуктов, а значения — их цены.

let productPrices = { 'apple': 1, 'banana': 2, 'cherry': 3 }

И предположим, что нам нужно увеличить каждую цену на 10%. Как это можно сделать?

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

function mapObject(obj, mapFn) {
    return Object.keys(obj).reduce(function(result, key) {
        result[key] = mapFn(obj[key]);
        return result;
    }, {});
}

Эта функция работает следующим образом:

  1. Object.keys(obj) возвращает массив ключей объекта.
  2. reduce проходит по каждому ключу и создает новый объект result.
  3. mapFn(obj[key]) применяет функцию mapFn к каждому значению объекта.
  4. Результат mapFn устанавливается как новое значение для ключа в объекте result.
  5. В конце reduce возвращает объект result как результат.

Теперь мы можем использовать эту функцию для увеличения цен на 10%:

let newPrices = mapObject(productPrices, function(price) {
    return price * 1.1;
});

// newPrices теперь равно { 'apple': 1.1, 'banana': 2.2, 'cherry': 3.3 }

Это всего лишь один из способов решения данной проблемы. В JavaScript есть множество других подходов и методов, которые можно использовать для обработки и преобразования объектов.

Тест на профориентацию
За 10 минут узнайте, как ваш опыт пригодиться в IT индустрии
Подробнее
Тест на профориентацию

Добавить комментарий