Notice: This page requires JavaScript to function properly.
Please enable JavaScript in your browser settings or update your browser.Lära Transformera Arrayer med Map()-Metoden | Avancerade Arraymetoder och Transformationer
Javascript Datastrukturer

bookTransformera Arrayer med Map()-Metoden

Svep för att visa menyn

Detta avsnitt behandlar viktiga arraymetoder som används i vardaglig programmering: map(), filter(), find(), reduce() och sort(). Vi börjar med map().

För en fullständig lista över alla arraymetoder, se den officiella MDN-dokumentation.

map()

Metoden map() itererar genom varje element i en array och skapar en ny array baserat på returvärdet från callback-funktionen.

array.map((element, index, array) => {
  // Callback body
});
  • element: aktuellt objekt;
  • index: position i arrayen;
  • array: originalarrayen.

              
12345

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

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

Viktiga punkter att komma ihåg om map():

  • Bearbetar varje element;
  • Modifierar inte den ursprungliga arrayen;
  • Returnerar en ny array;
  • Den resulterande arrayen har samma längd.

Transformera arrayelement

Metoden map() är särskilt användbar när varje element i en array behöver transformeras utan att den ursprungliga arrayen ändras. Se följande exempel:


              
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. Vad gör metoden map()?

2. Vad är en nyckelkaraktäristik för metoden map()?

3. I exemplet nedan, vad gör strings.map((element) => (element += "!"))?

question mark

Vad gör metoden map()?

Select the correct answer

question mark

Vad är en nyckelkaraktäristik för metoden map()?

Select the correct answer

question mark

I exemplet nedan, vad gör strings.map((element) => (element += "!"))?

Select the correct answer

Var allt tydligt?

Hur kan vi förbättra det?

Tack för dina kommentarer!

Avsnitt 5. Kapitel 1

Fråga AI

expand

Fråga AI

ChatGPT

Fråga vad du vill eller prova någon av de föreslagna frågorna för att starta vårt samtal

Avsnitt 5. Kapitel 1
some-alt