tilbage til lektionen

Map til objekter

vigtighed: 5

Du har et array af user objekter, hvert med name, surname og id.

Skriv koden, der laver et nyt array fra det, bestående af objekter med id og fullName, hvor fullName genereres ud fra name og surname.

For eksempel:

let john = { name: "John", surname: "Smith", id: 1 };
let pete = { name: "Pete", surname: "Hunt", id: 2 };
let mary = { name: "Mary", surname: "Key", id: 3 };

let users = [ john, pete, mary ];

let usersMapped = /* ... din kode ... */

/*
usersMapped = [
  { fullName: "John Smith", id: 1 },
  { fullName: "Pete Hunt", id: 2 },
  { fullName: "Mary Key", id: 3 }
]
*/

alert( usersMapped[0].id ) // 1
alert( usersMapped[0].fullName ) // John Smith
``` Så, faktisk skal du mappe et array af objekter til et andet. Prøv at bruge `=>` her. Der er en lille "catch".
let john = { name: "John", surname: "Smith", id: 1 };
let pete = { name: "Pete", surname: "Hunt", id: 2 };
let mary = { name: "Mary", surname: "Key", id: 3 };

let users = [ john, pete, mary ];

let usersMapped = users.map(user => ({
  fullName: `${user.name} ${user.surname}`,
  id: user.id
}));

/*
usersMapped = [
  { fullName: "John Smith", id: 1 },
  { fullName: "Pete Hunt", id: 2 },
  { fullName: "Mary Key", id: 3 }
]
*/

alert( usersMapped[0].id ); // 1
alert( usersMapped[0].fullName ); // John Smith

Vær opmærksom på at med arrow funktionen vi brug for yderligere parenteser.

:

let usersMapped = users.map(user => {
  fullName: `${user.name} ${user.surname}`,
  id: user.id
});

Som vi husker, er der to typer arrow funktioner: uden krop value => expr og med krop value => {...}.

I dette tilfælde vil JavaScript behandle { som starten på funktionskroppen, ikke starten på objektet. Løsningen er at omslutte dem i “almindelige” parenteser:

let usersMapped = users.map(user => ({
  fullName: `${user.name} ${user.surname}`,
  id: user.id
}));

Nu virker det fint.