Map-metodi

map-metodin avulla voit soveltaa annettua funktiota jokaiselle taulukon elementille. Samalla metodi ei muuta alkuperäistä taulukkoa, vaan palauttaa muunnetun.

Metodi saa parametrina funktion, joka suoritetaan jokaiselle taulukon elementille. Se, mitä tämä funktio palauttaa return-komennolla taulukon elementille, tulee kyseisen elementin uudeksi arvoksi (ks. esimerkit).

Funktiolle voidaan välittää 3 parametria. Jos nämä parametrit ovat olemassa (ne eivät ole pakollisia), niin ensimmäiseen pääsee automaattisesti taulukon elementti, toiseen sen numero taulukossa (indeksi), ja kolmanteen - itse taulukko.

Syntaksi

javascriptlet uusi_taulukko = taulukko.map(function(elementti, indeksi, taulukko) {
  koodi
  return muunnettu_elementti;
});

Esimerkki

Luodaan taulukko, jonka jokainen elementti on kaksi kertaa vastaavan alkutaulukon elementin arvo:

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

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

console.log(res);

Koodin suorituksen tulos:

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

Esimerkki

Luodaan taulukko, jonka jokainen elementti saadaan näin - elementin arvo kerrotaan sen järjestysnumerolla taulukossa:

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

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

console.log(res);

Koodin suorituksen tulos:

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

Esimerkki

Tarvittaessa kolmannelle parametrille voidaan antaa itse taulukko:

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

let res = arr.map(function(elem, index, arr) {
  täällä taulukko arr on käytettävissä
});

Esimerkki

map-metodia voidaan käyttää myös moniulotteisten taulukoiden läpikäymiseen. Olkoon esimerkiksi annettu tällainen taulukko:

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

Käydään läpi tämä taulukko map-metodilla ja tulostetaan sen elementit konsoliin:

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

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

Tuloksena console.log tulostaa [1, 2, 3], sitten [4, 5, 6], sitten [7, 8, 9].

Kuten näet, muuttujaan elem tulevat alitaulukot. Sovelletaan nyt metodia map jokaiseen alitaulukkoon ja korotetaan jokainen sen elementti toiseen potenssiin:

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

Katso myös