Opsommingen gebruiken in TypeScript

Een enum, of een opgesomd type, is een gegevensstructuur waarmee u een reeks benoemde waarden kunt definiëren.

Opsommingen bieden een manier om een ​​vaste reeks waarden als constanten weer te geven. Ze kunnen helpen uw code expressiever en zelfdocumentatiever te maken door betekenisvolle namen te geven aan specifieke waarden. Hier leer je hoe je opsommingen kunt gebruiken in TypeScript.

Een opsomming maken

Enums vertegenwoordigen over het algemeen een vast aantal opties voor een bepaalde waarde. Een opsomming die primaire kleuren vertegenwoordigt, kan bijvoorbeeld vaste waarden hebben voor rood, geel en blauw.

Opsommingen vertegenwoordigen gegevens als een set van sleutel/waarde-paren die opsommingsleden worden genoemd. De sleutel moet altijd een string zijn. De waarde, standaard een automatisch oplopend getal, kan echter numeriek, een tekenreeks of berekend zijn.

U kunt een opsomming maken in

de TypeScript-taal de... gebruiken opsomming trefwoord. Volg het met de naam van de opsomming en een paar accolades ({}) met de enum-leden. Een algemene JavaScript-naamgevingsconventie stelt dat enum-namen met een hoofdletter moeten beginnen.

opsomming Richting {
 Omhoog,
 Omlaag,
 Links,
 Rechts
}

Dit voorbeeld bevat een opsomming genaamd Richting. De opsomming heeft een lid dat elke richting vertegenwoordigt: omhoog, omlaag, links en rechts.

Aangezien deze code geen waarde specificeert voor elk van de sleutels, zal TypeScript automatisch waarden toewijzen. Het eerste lid, Up, heeft een waarde van 0. De overige leden hebben elk een waarde die 1 groter is dan die van het vorige lid. U kunt dit expliciet aangeven als u het moeilijk vindt om te onthouden:

opsomming Richting {
 Omhoog = 0,
 Omlaag = 1,
 Links = 2,
 Juist = 3,
}

Of u kunt expliciet verschillende waarden declareren, waarbij u niet-gedeclareerde waarden overlaat om door te gaan met ophogen zoals voorheen:

opsomming Toestand {
 Actief = 9,
 Inactief, // 10
}

In dit voorbeeld heeft het inactieve lid een waarde van 10. Dit gedrag is van toepassing op opsommingen die alleen numerieke waarden hebben, niet die met tekenreeksen of heterogene leden.

De verschillende soorten Enum

Opsommingen in TypeScript hebben een impliciet type dat ze baseren op het type waarden dat hun leden hebben. Het meest voorkomende type is de numerieke enum, waarvan het gedrag in de vorige sectie wordt behandeld, maar er zijn twee variaties.

String opsommingen

Een string-enum is een enum waarin alle leden strings zijn. In tegenstelling tot numerieke opsommingen, waarbij waarden automatisch worden toegewezen, moet u elk lid initialiseren met een tekenreeks:

opsomming Primaire kleuren {
 rood = "ROOD",
 Geel = "GEEL",
 Blauw = "BLAUW"
}

Hoewel string-enums geen automatisch oplopende eigenschappen hebben, kunnen ze zinvoller zijn als u ze serialiseert. Hun waarden moeten nog steeds beschrijvend zijn, zonder namen van leden, terwijl een reeks numerieke waarden niet zelfbeschrijvend mag zijn.

Heterogene Enums

Heterogene opsommingen zijn opsommingen die zowel numerieke als tekenreeksleden bevatten. Bijvoorbeeld:

opsomming Resultaat {
 Succes = "SUCCES",
 Mislukking = 0
}

Heterogene opsommingen zijn handig wanneer u opsommingsleden hebt die verschillende waardetypen vereisen op basis van de specifieke context of betekenis van elk lid. echter, de TypeScript-documentatie raadt het gebruik van heterogene opsommingen af, omdat deze complexiteit introduceren waardoor uw code foutgevoeliger kan worden.

Berekende en constante Enum-leden

Elk opsommingslid heeft een waarde, die constant of berekend kan zijn.

Constante Enum-leden

Een enum-lid is constant als het aan een van de onderstaande voorwaarden voldoet.

1. Het is het eerste lid van de enum en heeft geen initializer.
2. Het heeft geen initialisatiefunctie en het voorgaande opsommingslid was een numerieke constante.
3. Het wordt geïnitialiseerd met een constante enum-expressie.

Volgens de TypeScript-documentatie is een constante enum-expressie een subset van TypeScript-expressies die tijdens het compileren volledig kunnen worden geëvalueerd. Bijvoorbeeld een tekenreeks of een numerieke letterlijke waarde.

De leden van de opsommingen in het onderstaande codeblok zijn bijvoorbeeld allemaal constant:

// ZAAK 1
opsomming Richting {
 Omhoog,
 Omlaag,
 Links,
 Rechts
}
// GEVAL 2
opsomming weekdag {
 Maandag = 1,
 Dinsdag,
 Woensdag,
 Donderdag,
 Vrijdag
}
// GEVAL 3
opsomming Seizoen {
 Lente = "LENTE",
 Zomer = "ZOMER",
 Herfst = "HERFST",
 Winter = "WINTER"
}

Wanneer u constante enum-leden omzet in gewoon JavaScript, gebruikt de gegenereerde code hun letterlijke waarden. Dit kan gunstig zijn voor de prestaties en het debuggen gemakkelijker maken.

Hier is bijvoorbeeld de getransponeerde versie van de Season-enum:

var Seizoen;
(functie (Seizoen) {
 Seizoen["Lente"] = "LENTE";
 Seizoen["Zomer"] = "ZOMER";
 Seizoen["Herfst"] = "HERFST";
 Seizoen["Winter"] = "WINTER";
})(Seizoen || (Seizoen = {}));

Berekende Enum-leden

U kunt berekende opsommingsleden gebruiken om waarden toe te wijzen aan opsommingsleden op basis van uitdrukkingen of andere dynamische berekeningen. Bijvoorbeeld:

opsomming Maat {
 Klein = 1,
 Gemiddeld = berekenGrootte(12),
 Groot = berekenGrootte(5)
}
functieberekenGrootte(waarde: nummer): nummer{
opbrengst waarde * 5;
}
troosten.log (Grootte. Groot)

De Maat enum heeft drie leden: Klein, Medium, En Groot. Het wijst expliciet de waarde 1 toe aan het Small-lid. De Medium En Groot leden gebruiken een functie berekenGrootte om hun waarden tijdens runtime te berekenen.

Wanneer u werkt met berekende enum-leden, is het belangrijk op te merken dat de waarden pas tijdens runtime bekend zijn. Dit kan leiden tot meer complexiteit en potentieel looptijd fouten vergeleken met opsommingsleden met constante waarden.

Bijvoorbeeld:

var Maat;
(functie (Maat) {
 Maat[Grootte["Klein"] = 1] = "Klein";
 Maat[Grootte["Medium"] = berekenGrootte(12)] = "Medium";
 Maat[Grootte["Groot"] = berekenGrootte(5)] = "Groot";
})(Grootte || (Grootte = {}));
troosten.log(Maat.Groot)

Het bovenstaande codeblok is de vertaalde versie van het Maat opsomming. Merk op hoe TypeScript de retourwaarden van berekenSize() niet in de JavaScript-code opneemt. In plaats daarvan bevat het de oorspronkelijke functieaanroep zodat JavaScript de waarden tijdens runtime bepaalt.

Toegang tot Enum-waarden

U hebt toegang tot de waarden van enum-leden met behulp van de puntnotatie van het object.

Bijvoorbeeld:

opsomming Richting {
 Omhoog = 0,
 Omlaag = 1,
 Links = 2,
 Juist = 3,
}
troosten.log (Richting. Links) // 2

Omgekeerde toewijzing van numerieke opsommingen

Omgekeerde mapping in numerieke opsommingen verwijst naar de mogelijkheid om de corresponderende naam van het opsommingslid op te halen uit de waarde ervan. Dit kan met name handig zijn bij het werken met numerieke waarden, die u mogelijk moet decoderen.

Standaard worden opsommingswaarden in TypeScript voorwaarts toegewezen, wat betekent dat u alleen toegang hebt tot de waarde die aan een naam is gekoppeld. U kunt echter handmatig reverse mapping uitvoeren om het enum-lid op te halen op basis van de waarde ervan.

Bijvoorbeeld:

opsomming Richting {
 Omhoog = 1,
 Omlaag,
 Links,
 Rechts
}
functiegetDirectionName(richtingWaarde: nummer): snaar{
// Omgekeerde mapping
const richtingNaam = Richting[richtingWaarde];
opbrengst richtingNaam;
}
troosten.log (getDirectionName(1)); // "Omhoog"
troosten.log (getDirectionName(3)); // "Links"

Dit getDirectionName functie voert reverse mapping uit door toegang te krijgen tot de enum-lidnaam met behulp van de waarde ervan als een index. De functie duurt een richtingWaarde als een argument en haalt de corresponderende enum-lidnaam op met behulp van Richting[richtingWaarde].

Omgekeerde mapping kan handig zijn in scenario's waarin u een numerieke waarde hebt en de corresponderende enum-lidnaam moet bepalen. Het biedt een handige manier om met opsommingen in zowel voorwaartse als achterwaartse richting te werken.

Er zijn veel toepassingen van Enums

U kunt opsommingen gebruiken in verschillende scenario's, zoals het afhandelen van switch-instructies, het definiëren van functieparameters, het toewijzen van gegevens en het weergeven van keuzes of instellingen.

Of u nu een eindige reeks opties moet weergeven of complexe toestandsovergangen moet beheren, opsommingen in TypeScript zijn een waardevol hulpmiddel om de duidelijkheid en structuur van uw code te verbeteren.