​Итерирование по сущностям: map

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

Функция/метод map реализована во многих ныне используемых языках программирования. Скажем так, реализация функций map, reduce и filter дает языку хоть какое-то право называться функционально-поддерживаемым. Так вот, одна из этих функций — map, используется для перебора массива. В JavaScript это метод класса Array.

a = [1, 2, 3].map(callback, context) 

Самое важное про map:
- метод массива
- принимает в себя callback функцию и контекст
- возвращает новый массив

Метод map проитерируется по всему массиву и применит callback функцию к каждому из элементов массива с указанным контекстом context. Тут важно понимать, что контекст — не обязательный параметр. Чаще всего метод применяется без него.

Что за функцию мы применяем? Это обычная callback функция, которая принимает в себя 3 параметра: элемент, его индекс и копию итерируемого массива:

a = [1, 2, 3].map((element, index, array) => {
    console.log(`${element} is the ${index} element of ${array}`)
})

// Output: 
1 is the 0 element of 1,2,3
2 is the 1 element of 1,2,3
3 is the 2 element of 1,2,3

Но только есть один нюанс:

console.log(a)

// output
[ undefined, undefined, undefined ]

Дело в том, что наша callback функция не возвращает никакого значения. Чтобы получить новый массив необходимо вернуть новое значение. Разберем тривиальный пример:

a = [1, 2, 3].map(element => element ** 2)
console.log(a)

// output
[1, 4, 9]

Теперь мы получили квадраты от значений массива.

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

#javascript #web #theory #useful