Notice: This page requires JavaScript to function properly.
Please enable JavaScript in your browser settings or update your browser.Oppiskele Taulukoiden Muuntaminen Map()-Metodilla | Edistyneet Taulukkometodit ja Muunnokset
Javascriptin tietorakenteet

bookTaulukoiden Muuntaminen Map()-Metodilla

Tässä osiossa tarkastellaan useita yleisesti käytettyjä menetelmiä taulukoiden käsittelyyn JavaScriptissä. JS tarjoaa laajan valikoiman menetelmiä, mutta keskitymme erityisesti niihin, jotka ovat korvaamattomia jokapäiväisessä ohjelmoinnissa: map(), filter(), find(), reduce() ja sort(). Nämä menetelmät on valittu niiden käytännöllisen hyödyn vuoksi, sillä ne ratkaisevat yleisiä tilanteita, joita ohjelmointitehtävissä kohdataan.

Kaikki taulukkometodit löydät virallisesta MDN-dokumentaatiosta.

map()

map()-metodi käy läpi alkuperäisen taulukon jokaisen alkion ja soveltaa määriteltyä palautefunktiota tuottaen uuden taulukon.

Perussyntaksi:

array.map((element, index, array) => {
  // Callback body
});
  • element: Käsiteltävä alkio taulukossa;
  • index: Käsiteltävän alkion indeksi taulukossa. Edustaa alkion sijaintia taulukossa;
  • array: Taulukko, johon map()-metodia on kutsuttu. Viittaa alkuperäiseen taulukkoon, jota käydään läpi.

Havainnollistetaan, mitä element, index ja array tarkoittavat:


              
12345

            
const products = ["Ball", "Shoes", "Mouse"];

const modifiedProducts = products.map((element, index, array) => {
  console.log(`Element: ${element}, Index: ${index}, Array: ${array}`);
});
copy

Tärkeitä huomioita map()-metodista:

  • Käy alkuperäisen taulukon läpi alkio kerrallaan;
  • Ei muuta alkuperäistä taulukkoa;
  • Paluuarvo palautetaan uuden taulukon muodostamiseen;
  • Palauttaa uuden taulukon, jonka pituus on sama kuin alkuperäisen.

Taulukon alkioiden muuntaminen

map()-metodi on hyödyllinen, kun jokainen taulukon alkio halutaan muuntaa muuttamatta alkuperäistä taulukkoa. Tarkastele seuraavaa esimerkkiä:


              
12345678910

            
const numbers = [3, 5, 11, 32, 87];

/* Use the `map` method to create a new array (`doubledNumbers`) 
  by doubling each element of the `numbers` array. */
const doubledNumbers = numbers.map((element) => {
  return element * 2;
});

console.log("Initial array:", numbers); // Output: 3, 5, 11, 32, 87
console.log("Modified array:", doubledNumbers); // Output: 6, 10, 22, 64, 174
copy

1. Mitä map()-metodi tekee?

2. Mikä on map()-metodin keskeinen ominaisuus?

3. Alla olevassa esimerkissä, mitä tekee strings.map((element) => (element += "!"))?

question mark

Mitä map()-metodi tekee?

Select the correct answer

question mark

Mikä on map()-metodin keskeinen ominaisuus?

Select the correct answer

question mark

Alla olevassa esimerkissä, mitä tekee strings.map((element) => (element += "!"))?

Select the correct answer

Oliko kaikki selvää?

Miten voimme parantaa sitä?

Kiitos palautteestasi!

Osio 5. Luku 1

Kysy tekoälyä

expand

Kysy tekoälyä

ChatGPT

Kysy mitä tahansa tai kokeile jotakin ehdotetuista kysymyksistä aloittaaksesi keskustelumme

Awesome!

Completion rate improved to 2.27

bookTaulukoiden Muuntaminen Map()-Metodilla

Pyyhkäise näyttääksesi valikon

Tässä osiossa tarkastellaan useita yleisesti käytettyjä menetelmiä taulukoiden käsittelyyn JavaScriptissä. JS tarjoaa laajan valikoiman menetelmiä, mutta keskitymme erityisesti niihin, jotka ovat korvaamattomia jokapäiväisessä ohjelmoinnissa: map(), filter(), find(), reduce() ja sort(). Nämä menetelmät on valittu niiden käytännöllisen hyödyn vuoksi, sillä ne ratkaisevat yleisiä tilanteita, joita ohjelmointitehtävissä kohdataan.

Kaikki taulukkometodit löydät virallisesta MDN-dokumentaatiosta.

map()

map()-metodi käy läpi alkuperäisen taulukon jokaisen alkion ja soveltaa määriteltyä palautefunktiota tuottaen uuden taulukon.

Perussyntaksi:

array.map((element, index, array) => {
  // Callback body
});
  • element: Käsiteltävä alkio taulukossa;
  • index: Käsiteltävän alkion indeksi taulukossa. Edustaa alkion sijaintia taulukossa;
  • array: Taulukko, johon map()-metodia on kutsuttu. Viittaa alkuperäiseen taulukkoon, jota käydään läpi.

Havainnollistetaan, mitä element, index ja array tarkoittavat:


              
12345

            
const products = ["Ball", "Shoes", "Mouse"];

const modifiedProducts = products.map((element, index, array) => {
  console.log(`Element: ${element}, Index: ${index}, Array: ${array}`);
});
copy

Tärkeitä huomioita map()-metodista:

  • Käy alkuperäisen taulukon läpi alkio kerrallaan;
  • Ei muuta alkuperäistä taulukkoa;
  • Paluuarvo palautetaan uuden taulukon muodostamiseen;
  • Palauttaa uuden taulukon, jonka pituus on sama kuin alkuperäisen.

Taulukon alkioiden muuntaminen

map()-metodi on hyödyllinen, kun jokainen taulukon alkio halutaan muuntaa muuttamatta alkuperäistä taulukkoa. Tarkastele seuraavaa esimerkkiä:


              
12345678910

            
const numbers = [3, 5, 11, 32, 87];

/* Use the `map` method to create a new array (`doubledNumbers`) 
  by doubling each element of the `numbers` array. */
const doubledNumbers = numbers.map((element) => {
  return element * 2;
});

console.log("Initial array:", numbers); // Output: 3, 5, 11, 32, 87
console.log("Modified array:", doubledNumbers); // Output: 6, 10, 22, 64, 174
copy

1. Mitä map()-metodi tekee?

2. Mikä on map()-metodin keskeinen ominaisuus?

3. Alla olevassa esimerkissä, mitä tekee strings.map((element) => (element += "!"))?

question mark

Mitä map()-metodi tekee?

Select the correct answer

question mark

Mikä on map()-metodin keskeinen ominaisuus?

Select the correct answer

question mark

Alla olevassa esimerkissä, mitä tekee strings.map((element) => (element += "!"))?

Select the correct answer

Oliko kaikki selvää?

Miten voimme parantaa sitä?

Kiitos palautteestasi!

Osio 5. Luku 1
some-alt