javascript - Destruktureringstilordning med nytt navn og typeinformasjon


Hvordan kan jeg destrukturere en variabel til et nytt navn samtidig som jeg beholder typeinformasjon?

renderItem({item:'apple'})

// jsx:
function renderItem({item: region}) {
    // region == 'apple'
    return <div>{region}</div>;
}

Ovenstående vil destrukturere et objekt med item og tilordne det til region.

Hvordan uttrykker jeg typingsinformasjon for denne funksjonssignaturen?

Svar #1

Skriv inn den innkommende varen slik:

function renderItem({item: region}:{item:string}){}

Svar #2

Informasjon om typingen av funksjonen er tilgjengelig i TypeScript 2.1-dokumentasjonen:

https://www.typescriptlang.org/docs/handbook/release-notes/typescript-2-1.html

Objektrester er dualen til objektspredninger, på den måten at de kan hente ut ekstra egenskaper som ikke blir plukket opp når man destrukturerer et element:

Når Rest-delen av funksjonen brukes, forbedrer den objekt-dekonstruksjon ved å gjøre det mulig for oss å samle resten av egenskapene i et nytt objekt bestående av dem.

Vi kan skrive typeannotasjonen slik vi ville gjort for hvilken som helst annen verdi. Dette er å foretrekke da det kan hindre at funksjonssignaturene dine blir omstendelige. For eksempel

interface IRenderItem {
  item: String
}

function renderItem({ item: region }: IRenderItem): void {
  console.log(item);
}

Relaterte artikler