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
Practice
Projects
Quizzes & Challenges
Quizzes
Challenges
/
Javascriptin tietorakenteet

bookTaulukoiden Muuntaminen Map()-Metodilla

Tässä osiossa käsitellään keskeisiä taulukkometodeja, joita käytetään päivittäisessä ohjelmoinnissa: map(), filter(), find(), reduce() ja sort(). Aloitetaan map()-metodilla.

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

map()

map()-metodi käy läpi jokaisen taulukon alkion ja luo uuden taulukon palautusarvojen perusteella.

array.map((element, index, array) => {
  // Callback body
});
  • element: nykyinen alkio;
  • index: sijainti taulukossa;
  • array: alkuperäinen taulukko.
12345
const products = ["Ball", "Shoes", "Mouse"]; const modifiedProducts = products.map((element, index, array) => { console.log(`Element: ${element}, Index: ${index}, Array: ${array}`); });
copy

Tärkeimmät asiat map()-metodista:

  • Käsittelee jokaisen alkion;
  • Ei muuta alkuperäistä taulukkoa;
  • Palauttaa uuden taulukon;
  • Tulostaulukolla on sama pituus.

Taulukon alkioiden muuntaminen

map()-metodi on hyödyllinen, kun jokainen taulukon alkio täytyy 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. Mitä alla olevassa esimerkissä 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

Mitä alla olevassa esimerkissä 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

Suggested prompts:

Can you explain how the map() method works with a different example?

What happens if the callback function in map() does not return a value?

Can you show how to use map() with objects instead of numbers?

bookTaulukoiden Muuntaminen Map()-Metodilla

Pyyhkäise näyttääksesi valikon

Tässä osiossa käsitellään keskeisiä taulukkometodeja, joita käytetään päivittäisessä ohjelmoinnissa: map(), filter(), find(), reduce() ja sort(). Aloitetaan map()-metodilla.

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

map()

map()-metodi käy läpi jokaisen taulukon alkion ja luo uuden taulukon palautusarvojen perusteella.

array.map((element, index, array) => {
  // Callback body
});
  • element: nykyinen alkio;
  • index: sijainti taulukossa;
  • array: alkuperäinen taulukko.
12345
const products = ["Ball", "Shoes", "Mouse"]; const modifiedProducts = products.map((element, index, array) => { console.log(`Element: ${element}, Index: ${index}, Array: ${array}`); });
copy

Tärkeimmät asiat map()-metodista:

  • Käsittelee jokaisen alkion;
  • Ei muuta alkuperäistä taulukkoa;
  • Palauttaa uuden taulukon;
  • Tulostaulukolla on sama pituus.

Taulukon alkioiden muuntaminen

map()-metodi on hyödyllinen, kun jokainen taulukon alkio täytyy 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. Mitä alla olevassa esimerkissä 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

Mitä alla olevassa esimerkissä tekee strings.map((element) => (element += "!"))?

Select the correct answer

Oliko kaikki selvää?

Miten voimme parantaa sitä?

Kiitos palautteestasi!

Osio 5. Luku 1
some-alt