Метод map - трансформация массива на JavaScript
Метод map позволяет применить заданную
функцию для каждого элемента массива. При
этом метод не изменяет исходный массив, а
возвращает измененный.
Метод в параметре получает функцию, которая
выполнится для каждого элемента массива.
То, что вернет эта функция через return
для элемента массива, станет новым значением
этого элемента (см. примеры).
В функцию можно передавать 3 параметра.
Если эти параметры есть (они не обязательны),
то в первый автоматически попадет элемент
массива, во второй попадет его номер в массиве
(индекс), а в третий - сам массив.
Синтаксис
let новый массив = массив.map(function(элемент, индекс, массив) {
код
return измененный элемент;
});
Пример
Создадим массив, каждый элемент которого вдвое больше соответствующего элемента начального массива:
let arr = [1, 2, 3, 4, 5];
let res = arr.map(function(elem) {
return elem * 2;
});
console.log(res);
Результат выполнения кода:
[2, 4, 6, 8, 10]
Пример
Создадим массив, каждый элемент которого получается так - значение элемента умножается на его порядковый номер в массиве:
let arr = [1, 2, 3, 4, 5];
let res = arr.map(function(elem, index) {
return elem * index;
});
console.log(res);
Результат выполнения кода:
[0, 2, 6, 12, 20]
Пример
При необходимости в третий параметр можно передать сам массив:
let arr = [1, 2, 3, 4, 5];
let res = arr.map(function(elem, index, arr) {
тут будет доступен массив arr
});
Пример
Метод map можно использовать и для
перебора многомерных массивов. Пусть, к примеру,
дан вот такой массив:
let arr = [[1, 2, 3], [4, 5, 6], [7, 8, 9]];
Давайте переберем этот массив через
map и выведем его элементы в консоль:
let arr = [[1, 2, 3], [4, 5, 6], [7, 8, 9]];
let result = arr.map(function(elem) {
console.log(elem);
});
В результате console.log выведет [1,
2, 3], потом [4, 5, 6], потом
[7, 8, 9].
Как вы видите, в переменную elem попадают
подмассивы. Давайте теперь применим метод
map к каждому подмассиву и возведем
каждый его элемент в квадрат:
let arr = [[1, 2, 3], [4, 5, 6], [7, 8, 9]];
let result = arr.map(function(elem) {
return elem.map(function(num) {
return num * num;
});
});
console.log(result);