javascript - destructurează obiectul cu interfață


Am acest cod:

const {items} = this.props;

dar, trebuie să configurez interfața în constanta items

și nu vreau să fac asta:

const items: ItemsInterface = this.props.items

Posibil?

Răspuns #1

Așa cum a afirmat Oblosys în comentariul său, abordarea preferată ar trebui să fie să deconstruiești un obiect sursă bine tipizat și să te bazezi pe inferența tipului.

Sintaxa adnotării tipului interacționează într-un mod ciudat și incomod cu sintaxa de destructurare.

Totuși, dacă într-adevăr dorești să atribui un tip într-o expresie de destructurare, există câteva moduri.

  1. Cel mai simplu este să aplici o afirmație de tip pe partea dreaptă a expresiei

    const {items} = <{items: ItemsInterface}>this.props;
    

    Sau, echivalent

    const {items} = this.props as {items: ItemsInterface};
    

    Desigur, acest lucru este prolix, dar este clar, corect și evident.

  2. Poate mai aproape de instinctul tău, poți specifica tipul expresiei de destructurare cu o notație de tip așa cum ai face cu orice altceva.

    const {items}: {items: ItemsInterface} = this.props;
    

    Personal, consider că acest lucru este stânjenitor și puțin greu de citit. Anotarea tipului fiind atribuită expresiei fără nume {items}.

  3. Dacă specificați din întâmplare o valoare implicită în expresia de destrucționare, de fapt puteți specifica tipul direct în linie.

    const {items = <ItemsInterface>{}} = this.props;
    

Sau, echivalent

    const {items = {} as ItemsInterface} = this.props;

În orice caz, nu există nicio modalitate de a evita repetarea numelui items decât dacă inițializați cu o valoare implicită.

Prefer prima opțiune, deoarece este mai curat să modifici tipul unei valori existente, aici this.props, aplicând o afirmare acelei valori decât să adaugi o anotare de tip la declarația care primește valoarea, aici items, deoarece aceasta din urmă nu oferă cititorului nicio intuiție că tipul este ajustat manual.