javascript - Typescript: sette en egenskap til å være en bestemt type

Jeg er veldig ny på Typescript, og utforsker bare hvordan vi kan konvertere vår eksisterende JS-kode. Min tilnærming (som godt kan være feil) er å gjøre det minimale for å få det til å fungere i TypeScript, og deretter gradvis konvertere det for å følge «beste praksis».

Jeg ser ut til å ha falt ved første hinder.....

Jeg har følgende TypeScript, som bruker jQuery (i en ASP.NET .NET5-applikasjon).

interface MyInterface {
    prop1: string;
    prop2: number;
}

const something = {
    currentThing : MyInterface,

    init: (): void => {
        //
    }
};

$(something.init);

Så ideen er at når siden lastes, vil something.init bli kjørt. Dette vil sette opp ting som hendelseshåndterere via jQuery-selektorer, osv. osv. Den delen ser ut til å fungere helt fint.

Men...

På et tidspunkt vil en hendelsesbehandler utløses, og jeg vil opprette et nytt objekt som vil implementere MyInterface. Jeg må bevare det (ved å sette det som verdien av egenskapen/feltet currentThing) slik at det deretter kan aksesseres av fremtidige hendelser.

Imidlertid liker ikke Typescript linjen currentActivity: MyInterface, og jeg får feilen:

'MyInterface' refererer bare til en type, men brukes her som en verdi.

Svar #1

Et objekt følger nøkkel-verdi-strukturen, Typescript forstår den nåværende objektdefinisjonen som

const something = {
    //    key         value
    currentThing : MyInterface,    
};

og siden MyInterface ikke er en gyldig verdi, vil det kaste den nevnte feilen.

Det du bør gjøre i dette tilfellet er å definere typer for something-objektet, og angi typer for dets egenskaper slik som følgende:

interface MyInterface {
    prop1: string;
    prop2: number;
}

interface SomethingInterface {
    currentThing : MyInterface;
    init: () => void
}

const currentThing = { prop1: 'aStringValue', prop2: 12345 };
const something: SomethingInterface = {
    currentThing,
    init: (): void => {
        //
    }
};

$(something.init);

Svar #2

Jeg anbefaler at du skriver inn ditt something-objekt ved å bruke et nytt grensesnitt, slik som:

interface MyInterface {
    prop1: string;
    prop2: number;
}

interface Something {
  currentThing: MyInterface;
  init: () => void;
}

const something: Something = {
    currentThing: {
      prop1: 'foo',
      prop2: 5,
    },

    init: (): void => {
        //
    },
};

console.log(something.init);

Relaterte artikler