.map()
— это метод в JavaScript, который создает новый массив с результатами вызова предоставленной функции для каждого элемента в вызывающем массиве. Он не изменяет исходный массив. Вот несколько примеров использования .map()
:
- Основное использование: в этом примере определен массив чисел, и метод
.map()
используется для удвоения каждого элемента в массиве. Метод.map()
принимает в качестве аргумента функцию обратного вызова. Функция обратного вызова получает текущий элемент, индекс текущего элемента и отображаемый массив в качестве своих аргументов. В этом случае нам нужен только текущий элемент, поэтому мы определяем только один аргумент:
let numbers = [1, 2, 3, 4, 5]; let doubledNumbers = numbers.map(function(number) { return number * 2; }); console.log(doubledNumbers); // [2, 4, 6, 8, 10]
2. Использование стрелочной функции. Это похоже на первый пример, но функция, передаваемая методу .map()
, написана с использованием сокращенного синтаксиса стрелочной функции.
let numbers = [1, 2, 3, 4, 5]; let doubledNumbers = numbers.map(number => number * 2); console.log(doubledNumbers); // [2, 4, 6, 8, 10]
3. Использование .map()
с объектом: в этом примере определяется массив объектов, и метод .map()
используется для извлечения свойства name
из каждого объекта и создания нового массива имен.
let users = [ { name: "John", age: 30 }, { name: "Jane", age: 25 } ]; let names = users.map(user => user.name); console.log(names); // ["John", "Jane"]
4. Расширенный пример:
let items = [ { name: 'item1', value: 10 }, { name: 'item2', value: 20 }, { name: 'item3', value: 30 }, { name: 'item4', value: 40 } ]; let total = items.map(item => item.value).reduce((a, b) => a + b); console.log(total); // 100
В четвертом примере .map()
используется для извлечения свойства значения из каждого объекта в массиве items
, а затем метод .reduce()
используется для вычисления суммы всех значений. Метод .map()
возвращает новый массив, содержащий только свойство value
каждого объекта. Метод .reduce()
использует функцию обратного вызова, которая накапливает значения в массиве и возвращает одно значение, в данном случае сумму всех значений.