TypeScripts uppräknade typ är ett praktiskt sätt att paketera relaterade värden, med tydlig innebörd.

En uppräkning, eller en uppräknad typ, är en datastruktur som låter dig definiera en uppsättning namngivna värden.

Enums ger ett sätt att representera en fast uppsättning värden som konstanter. De kan hjälpa till att göra din kod mer uttrycksfull och självdokumenterande genom att ge specifika värden meningsfulla namn. Här får du lära dig hur du kan använda enums i TypeScript.

Skapa en enum

Uppräkningar representerar i allmänhet ett fast antal alternativ för ett givet värde. Till exempel kan en uppräkning som representerar primärfärger ha fasta värden för rött, gult och blått.

Enums representerar data som en uppsättning nyckel/värdepar som kallas uppräkningsmedlemmar. Nyckeln måste alltid vara en sträng. Men värdet – ett automatiskt ökande tal som standard – kan vara numeriskt, en sträng eller beräknat.

Du kan skapa en uppräkning i TypeScript-språket använda uppräkning nyckelord. Följ den med enumens namn och ett par lockiga hängslen (

instagram viewer
{}) som innehåller enum-medlemmarna. En vanlig JavaScript-namnkonvention anger att enumnamn ska börja med stor bokstav.

uppräkning Riktning {
 Upp,
 Ner,
 Vänster,
 Höger
}

Det här exemplet har en enum som kallas Riktning. Uppräkningen har en medlem som representerar varje riktning: Upp, Ner, Vänster och Höger.

Eftersom den här koden inte anger ett värde för var och en av nycklarna kommer TypeScript automatiskt att tilldela värden. Den första medlemmen, Up, kommer att ha värdet 0. De återstående medlemmarna kommer var och en att ha ett värde 1 större än den tidigare medlemmens. Du kan uttryckligen deklarera detta om du har svårt att komma ihåg:

uppräkning Riktning {
 Upp = 0,
 Ner = 1,
 Vänster = 2,
 Rätt = 3,
}

Eller så kan du uttryckligen deklarera olika värden och låta odeklarerade värden fortsätta att öka som tidigare:

uppräkning Status {
 Aktiv = 9,
 Inaktiv, // 10
}

I det här exemplet har den inaktiva medlemmen värdet 10. Detta beteende gäller för enums som bara har numeriska värden, inte de med sträng eller heterogena medlemmar.

De olika typerna av Enum

Enums i TypeScript har en implicit typ de baseras på vilken typ av värden deras medlemmar har. Den vanligaste typen är den numeriska enumen, vars beteende det föregående avsnittet täcker, men det finns två varianter.

String Enums

En strängenum är en enum där alla dess medlemmar är strängar. Till skillnad från numeriska uppräkningar, där värden tilldelas automatiskt, måste du initiera varje medlem med en sträng:

uppräkning Primära färger {
 Röd = "RÖD",
 Gul = "GUL",
 Blått = "BLÅ"
}

Även om stränguppräkningar inte har egenskaper för automatisk ökning, kan de vara mer meningsfulla om du serialiserar dem. Deras värden ska fortfarande vara beskrivande, utan medlemsnamn, medan en uppsättning numeriska värden kanske inte är självbeskrivande.

Heterogena uppräkningar

Heterogena enums är enums som innehåller både numeriska och strängmedlemmar. Till exempel:

uppräkning Resultat {
 Framgång = "FRAMGÅNG",
 Misslyckande = 0
}

Heterogena uppräkningar är användbara när du har uppräkningsmedlemmar som kräver olika värdetyper baserat på varje medlems specifika sammanhang eller betydelse. Men den TypeScript-dokumentation avråder från användningen av heterogena enums eftersom de introducerar komplexitet som kan göra din kod mer felbenägen.

Beräknade och konstanta Enum-medlemmar

Varje enummedlem har ett värde, som antingen kan vara konstant eller beräknat.

Ständiga Enum-medlemmar

En enum-medlem är konstant om den uppfyller något av villkoren nedan.

  1. Det är den första medlemmen i enumet och har ingen initialiserare.
  2. Den har ingen initialiserare, och den föregående enum-medlemmen var en numerisk konstant.
  3. Den initieras med ett konstant enumuttryck.

Enligt TypeScript-dokumentationen är ett konstant enum-uttryck en delmängd av TypeScript-uttryck som kan utvärderas fullt ut vid kompilering. Till exempel en sträng eller en numerisk bokstav.

Till exempel är medlemmarna i uppräkningarna i kodblocket nedan alla konstanta:

// FALL 1
uppräkning Riktning {
 Upp,
 Ner,
 Vänster,
 Höger
}
// FALL 2
uppräkning veckodag {
 måndag = 1,
 tisdag,
 onsdag,
 torsdag,
 fredag
}
// FALL 3
uppräkning Säsong {
 Vår = "VÅR",
 Sommar = "SOMMAR",
 Hösten = "HÖST",
 Vinter = "VINTER"
}

När du transpilerar konstanta enum-medlemmar till vanlig JavaScript, använder den genererade koden deras bokstavliga värden. Detta kan vara fördelaktigt för prestanda och göra felsökning enklare.

Till exempel, här är den transpilerade versionen av säsongsnumret:

var Säsong;
(fungera (Säsong) {
 Säsong["Vår"] = "VÅR";
 Säsong["Sommar"] = "SOMMAR";
 Säsong["Höst"] = "HÖST";
 Säsong["Vinter"] = "VINTER";
})(Säsong || (Säsong = {}));

Beräknade uppräkningsmedlemmar

Du kan använda beräknade enum-medlemmar för att tilldela värden till enum-medlemmar baserat på uttryck eller andra dynamiska beräkningar. Till exempel:

uppräkning Storlek {
 Liten = 1,
 Medium = beräkna storlek(12),
 Stor = beräkna storlek(5)
}
fungeraberäkna Storlek(värde: siffra): siffra{
lämna tillbaka värde * 5;
}
trösta.log (Storlek. Stor)

De Storlek enum har tre medlemmar: Små, Medium, och Stor. Den tilldelar uttryckligen värdet 1 till Small-medlemmen. De Medium och Stor medlemmar använder en funktion beräkna Storlek för att beräkna deras värden vid körning.

När du arbetar med beräknade enummedlemmar är det viktigt att notera att värdena inte är kända förrän vid körning. Detta kan introducera mer komplexitet och potential körtidsfel jämfört med uppräkningsmedlemmar med konstanta värden.

Till exempel:

var Storlek;
(fungera (Storlek) {
 Storlek[Storlek["Små"] = 1] = "Små";
 Storlek[Storlek["Medium"] = beräkna storlek(12)] = "Medium";
 Storlek[Storlek["Stor"] = beräkna storlek(5)] = "Stor";
})(Storlek || (Storlek = {}));
trösta.logga(Storlek.Stor)

Kodblocket ovan är den transpilerade versionen av Storlek uppräkning. Lägg märke till hur TypeScript inte inkluderar returvärdena från calculateSize() i JavaScript-koden. Istället inkluderar det det ursprungliga funktionsanropet så att JavaScript bestämmer värdena vid körning.

Få åtkomst till Enum-värden

Du kan komma åt värdena för enum-medlemmar med hjälp av objektets punktnotation.

Till exempel:

uppräkning Riktning {
 Upp = 0,
 Ner = 1,
 Vänster = 2,
 Rätt = 3,
}
trösta.log (Riktning. Vänster) // 2

Omvänd mappning numeriska uppräkningar

Omvänd mappning i numeriska enums hänvisar till möjligheten att hämta motsvarande enum-medlemsnamn från dess värde. Detta kan vara särskilt användbart när du arbetar med numeriska värden, som du kan behöva avkoda.

Som standard är enum-värden i TypeScript framåtmappade, vilket innebär att du bara kan komma åt värdet som är associerat med ett namn. Du kan dock utföra omvänd mappning manuellt för att hämta enum-medlemmen baserat på dess värde.

Till exempel:

uppräkning Riktning {
 Upp = 1,
 Ner,
 Vänster,
 Höger
}
fungeragetDirectionName(directionValue: siffra): sträng{
// Omvänd mappning
konst riktningsnamn = Riktning[riktningsVärde];
lämna tillbaka directionName;
}
trösta.log (getDirectionName(1)); // "Upp"
trösta.log (getDirectionName(3)); // "Vänster"

Detta getDirectionName funktionen utför omvänd mappning genom att komma åt enum-medlemsnamnet med dess värde som ett index. Funktionen tar en riktningVärde som ett argument och hämtar motsvarande enum-medlemsnamn med hjälp av Riktning[directionValue].

Omvänd mappning kan vara praktiskt i scenarier där du har ett numeriskt värde och behöver bestämma motsvarande enum-medlemsnamn. Det ger ett bekvämt sätt att arbeta med enums i både framåt- och bakåtriktning.

Det finns många tillämpningar av Enums

Du kan använda uppräkningar i olika scenarier, som att hantera switch-satser, definiera funktionsparametrar, kartlägga data och representera val eller inställningar.

Oavsett om du behöver representera en ändlig uppsättning alternativ eller hantera komplexa tillståndsövergångar, är enums i TypeScript ett värdefullt verktyg för att förbättra klarheten och strukturen i din kod.