Lære Transformering af Arrays med map()-Metoden | Avancerede Array-metoder og Transformationer

Dette afsnit vil undersøge flere ofte anvendte metoder til at arbejde med arrays i JavaScript. JS tilbyder et bredt udvalg af metoder, men vi vil fokusere specifikt på dem, der er uundværlige i daglig programmering: map(), filter(), find(), reduce() og sort(). Disse metoder er udvalgt for deres praktiske anvendelighed og adresserer almindelige scenarier, der opstår i kodningsopgaver.

For en komplet liste over alle array-metoder kan du se den officielle MDN-dokumentation.

map()

Metoden map() itererer over hvert element i det oprindelige array og anvender en angivet callback-funktion for at producere et nyt array.

Grundlæggende syntaks:

array.map((element, index, array) => {
  // Callback body
});

element: Det aktuelle element, der behandles i arrayet;
index: Det aktuelle elements indeks i arrayet. Det repræsenterer elementets position i arrayet;
array: Det array, som map()-metoden blev kaldt på. Det refererer til det oprindelige array, der itereres over.

Her illustreres, hvad element, index og array repræsenterer:


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

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

Vigtige punkter at huske om map():

Gennemløber det oprindelige array element for element;
Ændrer ikke det oprindelige array;
Callback-funktionens resultat bruges til at oprette et nyt array;
Returnerer et nyt array med samme længde.

Transformation af array-elementer

Metoden map() er særligt nyttig, når der er behov for at transformere hvert element i et array uden at ændre det oprindelige array. Overvej følgende eksempel:


              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

1. Hvad gør `map()`-metoden?

2. Hvad er et nøgletræk ved `map()`-metoden?

3. I eksemplet nedenfor, hvad gør `strings.map((element) => (element += "!"))`?

Var alt klart?

Tak for dine kommentarer!

Sektion 5. Kapitel 1

Spørg AI

Spørg om hvad som helst eller prøv et af de foreslåede spørgsmål for at starte vores chat

Suggested prompts:

Can you explain how the map() method differs from forEach()?

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

Can you show an example of using map() with objects instead of numbers?

Awesome!

Completion rate improved to 2.27

Stryg for at vise menuen

For en komplet liste over alle array-metoder kan du se den officielle MDN-dokumentation.

map()

Metoden map() itererer over hvert element i det oprindelige array og anvender en angivet callback-funktion for at producere et nyt array.

Grundlæggende syntaks:

array.map((element, index, array) => {
  // Callback body
});

element: Det aktuelle element, der behandles i arrayet;
index: Det aktuelle elements indeks i arrayet. Det repræsenterer elementets position i arrayet;
array: Det array, som map()-metoden blev kaldt på. Det refererer til det oprindelige array, der itereres over.

Her illustreres, hvad element, index og array repræsenterer:


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

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

Vigtige punkter at huske om map():

Gennemløber det oprindelige array element for element;
Ændrer ikke det oprindelige array;
Callback-funktionens resultat bruges til at oprette et nyt array;
Returnerer et nyt array med samme længde.

Transformation af array-elementer

Metoden map() er særligt nyttig, når der er behov for at transformere hvert element i et array uden at ændre det oprindelige array. Overvej følgende eksempel:


              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

1. Hvad gør `map()`-metoden?

2. Hvad er et nøgletræk ved `map()`-metoden?

3. I eksemplet nedenfor, hvad gør `strings.map((element) => (element += "!"))`?

Var alt klart?

Tak for dine kommentarer!

Sektion 5. Kapitel 1

Transformering af Arrays med map()-Metoden

map()

Vigtige punkter at huske om map():

Transformation af array-elementer

1. Hvad gør map()-metoden?

2. Hvad er et nøgletræk ved map()-metoden?

3. I eksemplet nedenfor, hvad gør strings.map((element) => (element += "!"))?

Awesome!

Transformering af Arrays med map()-Metoden

map()

Vigtige punkter at huske om map():

Transformation af array-elementer

1. Hvad gør map()-metoden?

2. Hvad er et nøgletræk ved map()-metoden?

3. I eksemplet nedenfor, hvad gør strings.map((element) => (element += "!"))?

1. Hvad gør `map()`-metoden?

2. Hvad er et nøgletræk ved `map()`-metoden?

3. I eksemplet nedenfor, hvad gør `strings.map((element) => (element += "!"))`?

1. Hvad gør `map()`-metoden?

2. Hvad er et nøgletræk ved `map()`-metoden?

3. I eksemplet nedenfor, hvad gør `strings.map((element) => (element += "!"))`?