Lære Transformasjon av Arrayer med map()-Metoden | Avanserte Array-metoder og Transformasjoner

Denne delen vil utforske flere ofte brukte metoder for å arbeide med arrayer i JavaScript. JS tilbyr et bredt utvalg av metoder, men vi vil fokusere spesielt på de som er uvurderlige i daglig programmering: map(), filter(), find(), reduce() og sort(). Disse metodene er valgt for sin praktiske nytteverdi, og dekker vanlige scenarier som oppstår i kodingsoppgaver.

For en fullstendig liste over alle array-metoder, kan du se den offisielle MDN-dokumentasjonen.

map()

Metoden map() itererer over hvert element i den opprinnelige arrayen og anvender en spesifisert callback-funksjon for å produsere en ny array.

Grunnleggende syntaks:

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

element: Gjeldende element som behandles i arrayen;
index: Indeksen til det gjeldende elementet i arrayen. Representerer posisjonen til elementet i arrayen;
array: Arrayen som map()-metoden ble kalt på. Refererer til den opprinnelige arrayen som itereres over.

Her illustreres hva element, index og array representerer:


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

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

Viktige punkter å huske om map():

Itererer over det opprinnelige arrayet element for element;
Endrer ikke det opprinnelige arrayet;
Resultatet fra callback-funksjonen brukes til å lage et nytt array;
Returnerer et nytt array med samme lengde.

Transformasjon av array-elementer

Metoden map() er spesielt nyttig når man ønsker å transformere hvert element i et array uten å endre det opprinnelige arrayet. Se 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. Hva gjør `map()`-metoden?

2. Hva er en sentral egenskap ved `map()`-metoden?

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

Alt var klart?

Takk for tilbakemeldingene dine!

Seksjon 5. Kapittel 1

Spør AI

Spør om hva du vil, eller prøv ett av de foreslåtte spørsmålene for å starte chatten vår

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

Sveip for å vise menyen

For en fullstendig liste over alle array-metoder, kan du se den offisielle MDN-dokumentasjonen.

map()

Metoden map() itererer over hvert element i den opprinnelige arrayen og anvender en spesifisert callback-funksjon for å produsere en ny array.

Grunnleggende syntaks:

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

element: Gjeldende element som behandles i arrayen;
index: Indeksen til det gjeldende elementet i arrayen. Representerer posisjonen til elementet i arrayen;
array: Arrayen som map()-metoden ble kalt på. Refererer til den opprinnelige arrayen som itereres over.

Her illustreres hva element, index og array representerer:


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

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

Viktige punkter å huske om map():

Itererer over det opprinnelige arrayet element for element;
Endrer ikke det opprinnelige arrayet;
Resultatet fra callback-funksjonen brukes til å lage et nytt array;
Returnerer et nytt array med samme lengde.

Transformasjon av array-elementer

Metoden map() er spesielt nyttig når man ønsker å transformere hvert element i et array uten å endre det opprinnelige arrayet. Se 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. Hva gjør `map()`-metoden?

2. Hva er en sentral egenskap ved `map()`-metoden?

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

Alt var klart?

Takk for tilbakemeldingene dine!

Seksjon 5. Kapittel 1

Transformasjon av Arrayer med map()-Metoden

map()

Viktige punkter å huske om map():

Transformasjon av array-elementer

1. Hva gjør map()-metoden?

2. Hva er en sentral egenskap ved map()-metoden?

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

Awesome!

Transformasjon av Arrayer med map()-Metoden

map()

Viktige punkter å huske om map():

Transformasjon av array-elementer

1. Hva gjør map()-metoden?

2. Hva er en sentral egenskap ved map()-metoden?

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

1. Hva gjør `map()`-metoden?

2. Hva er en sentral egenskap ved `map()`-metoden?

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

1. Hva gjør `map()`-metoden?

2. Hva er en sentral egenskap ved `map()`-metoden?

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