Notice: This page requires JavaScript to function properly.
Please enable JavaScript in your browser settings or update your browser.Leer Arrays Transformeren met de map()-Methode | Fundamentals van JavaScript-objecten
Javascript Datastructuren

bookArrays Transformeren met de map()-Methode

Veeg om het menu te tonen

Deze sectie behandelt essentiële array-methoden die vaak worden gebruikt bij het coderen: map(), filter(), find(), reduce() en sort(). We beginnen met map().

Voor een volledig overzicht van alle array-methoden, raadpleeg de officiële MDN-documentatie.

map()

De map()-methode doorloopt elk element van een array en maakt een nieuwe array op basis van de returnwaarde van de callbackfunctie.

array.map((element, index, array) => {
  // Callback body
});
  • element: huidig item;
  • index: positie in de array;
  • array: de originele array.

              
12345

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

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

Belangrijke punten om te onthouden over de map():

  • Verwerkt elk element;
  • Wijzigt de originele array niet;
  • Geeft een nieuwe array terug;
  • De resulterende array heeft dezelfde lengte.

Array-elementen transformeren

De map()-methode is bijzonder geschikt wanneer elk element van een array getransformeerd moet worden zonder de originele array te wijzigen. Bekijk het volgende voorbeeld:


              
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. Wat doet de map()-methode?

2. Wat is een belangrijk kenmerk van de map()-methode?

3. Wat doet strings.map((element) => (element += "!")) in het onderstaande voorbeeld?

question mark

Wat doet de map()-methode?

Select the correct answer

question mark

Wat is een belangrijk kenmerk van de map()-methode?

Select the correct answer

question mark

Wat doet strings.map((element) => (element += "!")) in het onderstaande voorbeeld?

Select the correct answer

Was alles duidelijk?

Hoe kunnen we het verbeteren?

Bedankt voor je feedback!

Sectie 1. Hoofdstuk 31

Vraag AI

expand

Vraag AI

ChatGPT

Vraag wat u wilt of probeer een van de voorgestelde vragen om onze chat te starten.

Sectie 1. Hoofdstuk 31
some-alt