Metoda map

Metoda map pozwala zastosować określoną funkcję dla każdego elementu tablicy. Przy tym metoda nie zmienia oryginalnej tablicy, a zwraca zmienioną.

Metoda w parametrze otrzymuje funkcję, która wykona się dla każdego elementu tablicy. To, co zwróci ta funkcja przez return dla elementu tablicy, stanie się nową wartością tego elementu (zob. przykłady).

Do funkcji można przekazywać 3 parametry. Jeśli te parametry istnieją (nie są obowiązkowe), to w pierwszy automatycznie trafi element tablicy, w drugi trafi jego numer w tablicy (indeks), a w trzeci - sama tablica.

Składnia

javascriptlet nowaTablica = tablica.map(function(element, index, tablica) {
  kod
  return zmienionyElement;
});

Przykład

Stwórzmy tablicę, w której każdy element jest dwukrotnie większy od odpowiadającego mu elementu tablicy początkowej:

javascriptlet arr = [1, 2, 3, 4, 5];

let res = arr.map(function(elem) {
  return elem * 2;
});

console.log(res);

Wynik wykonania kodu:

javascript[2, 4, 6, 8, 10]

Przykład

Stwórzmy tablicę, w której każdy element otrzymuje się tak - wartość elementu jest mnożona przez jego numer porządkowy w tablicy:

javascriptlet arr = [1, 2, 3, 4, 5];

let res = arr.map(function(elem, index) {
  return elem * index;
});

console.log(res);

Wynik wykonania kodu:

javascript[0, 2, 6, 12, 20]

Przykład

W razie potrzeby w trzeci parametr można przekazać samą tablicę:

javascriptlet arr = [1, 2, 3, 4, 5];

let res = arr.map(function(elem, index, arr) {
  tutaj będzie dostępna tablica arr
});

Przykład

Metodu map można używać również do przeglądania tablic wielowymiarowych. Niech, na przykład, będzie dana taka tablica:

javascriptlet arr = [[1, 2, 3], [4, 5, 6], [7, 8, 9]];

Przejdźmy tę tablicę przez map i wypiszmy jej elementy w konsoli:

javascriptlet arr = [[1, 2, 3], [4, 5, 6], [7, 8, 9]];

let result = arr.map(function(elem) {
  console.log(elem);
});

W wyniku console.log wypisze [1, 2, 3], potem [4, 5, 6], potem [7, 8, 9].

Jak widać, do zmiennej elem trafiają podtablice. Teraz zastosujmy metodę map do każdej podtablicy i podnieśmy każdy jej element do kwadratu:

javascriptlet 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);

Zobacz też