Typescript Array Map Returnerer Objekt

Jeg har følgende kode.

array.map(val => { return {
  key1: val.key1,
  key2: val.key2
}});

Finnes det noen måte å redusere koden til noe slikt?

array.map(val => {
  key1: val.key1,
  key2: val.key2
});

Svar #1

Hvis du setter det i parentes, vil kompilatoren behandle det som et objektliteral, ikke en kodeblokk:

array.map(val => ({
  key1: val.key1,
  key2: val.key2
}));

En typepåstand fungerer også hvis du har et grensesnitt for objektbokstaven (men er ikke like typesikkert):

interface IKeys { key1: string; key2: string }
array.map(val => <IKeys>{
  key1: val.key1,
  key2: val.key2
});

Svar #2

Som en oppdatering til @Titian Cernicova-Dragomirs svar ovenfor, er det verdt å nevne as-operatoren (for Type Assertion), spesielt nyttig når man jobber med Reacts TSX(JSX)-filer, tilsvarende <Type>-syntaksen:

interface IKeys { key1: string; key2: string }
// notice the parentheses, to avoid confusion with a block scope
array.map(val => ({
    key1: val.key1,
    key2: val.key2
} as IKeys));

Det ble introdusert fordi vinkelparentessyntaksen (<ComponentOrElement>) er reservert for komponenter/JSX-elementer.

Svar #3

Ingen av de ovennevnte alternativene har fungert for meg med Reacts TSX-filer.

Dette er koden som fungerte for meg:

interface IKeys { key1: string; key2: string }

array.map((val: any): IKeys => ({
    key1: val.key1,
    key2: val.key2
}));

Relaterte artikler