Nøkkelen til kodeklarhet

TypeScript enums er en setning som vil møte mye når du arbeider med TypeScript-språk.

TypeScript er blant de yngste, men er også rangert som et av utviklernes mest populære programmeringsspråk. TypeScript er en utvidelse (supersett) av JavaScript. Dermed er enhver gyldig JavaScript-kode også gyldig i TypeScript. TypeScript introduserer imidlertid statiske skrivefunksjoner (en manglende funksjon i JavaScript).

Hva er TypeScript Enums, deres brukstilfeller, og hvordan kan du lage dem? Denne artikkelen vil dekke alt du trenger å vite om Enums.

Hva er TypeScript Enums?

Enums (opptalte typer) er datastrukturer med konstant lengde som har et sett med uforanderlige verdier (konstanter). TypeScript er ikke det eneste språket som bruker Enums, da de er tilgjengelige i objektorienterte språk som C# og Java.

I TypeScript lar enums utviklere lage et sett med distinkte saker eller dokumenthensikter. De er også viktige for å angi verdier eller egenskaper som bare kan være et visst antall verdier. For eksempel kan det bare være syv kontinenter i verden.

Oppsummert er TypeScript-oppslag viktige på følgende måter;

• De er fleksible ettersom de lar utviklere enkelt dokumentere og uttrykke intensjoner og bruke saker
• Enums lar utviklere lage energieffektive tilpassede konstanter i JavaScript
• Lagrer kompilering og kjøretid ved kompilering av TypeScript-kode til JavaScript-kode

TypeScript Enums kan enten være strenger eller i numerisk form. Imidlertid er disse enumene forhåndsbehandlet og gjennomgår ikke testing under testfasen. TypeScript oversetter/konverterer enums til JavaScript-kode.

Ulike oppslag i TypeScript

Nå som du forstår Enums, er det på tide å se dem fungere i TypeScript. Du kan sette opp en utviklingsserver ved å laste ned TypeScript og Node.js på din lokale maskin eller bruke nettbaserte løsninger. Vi vil bruke TypeScript lekeplass for å demonstrere forskjellige TypeScript-oppslag.

Dette er de forskjellige Enum-typene i TypeScript;

#1. Numeriske opptegnelser

Du må bruke nøkkelordet «enum» og følge det med navnet på enumen du vil lage. Etter det oppretter du karriparenteser som spesifiserer medlemmene i enumet. Dette er et eksempel på en numerisk enum;

enum CardinalDirections {
  North = 5,
  East,
  South,
  West,
};

Ovennevnte representerer en oppregning kalt CardinalDirections som har fire medlemmer. I dette tilfellet kan det bare være fire verdier (nord, øst, sør og vest), noe som gjør enum til et utmerket valg for å holde data.

Jeg har tildelt CardinalDirections.North verdi 5. Jeg har imidlertid ikke tildelt de andre verdiene fordi TypeScript vil gjøre resten automatisk. For eksempel vil verdien for CardinalDirections.East være 6 ettersom TypeScript øker den forrige verdien med 1.

CardinalDirections.West blir 8.

Hva om vi ikke tildeler en verdi til det første elementet innenfor karriparentesene? Vår enum vil være;

enum CardinalDirections {
  North,
  East,
  South,
  West,
};

TypeScript vil automatisk tildele North verdi 0. Hvis du taster inn noe som CardinalDirections.West, vil du få 3

#2. Streng opptegnelser

Hvert medlem i en strengenum må initialiseres med et annet strengenum-medlem eller en strengliteral. Dette er et eksempel på en strengenum;

enum Direction {
  Up = "UP",
  Down = "DOWN",
  Left = "LEFT",
  Right = "RIGHT",
}

Denne enumen øker ikke som det som skjer i numeriske enums. Hvis du kjører denne koden;

enum Direction {
  Up = "UP",
  Down = "DOWN",
  Left = "LEFT",
  Right = "RIGHT",
}
console.log(Direction.Right)

Dette er hva du får;

«IKKE SANT»

#3. Heterogene opptegnelser

Du kan blande numeriske og strenge medlemmer for å danne en heterogen enum. Dette er et eksempel;

enum HeterogeneousEnum {
  No = 0,
  Yes = "YES",
}

#4. Konstante og beregnede enum-medlemmer

Enum-medlemmer har verdier knyttet til seg, som kan være «konstant» eller «beregnet».

Dette er et eksempel på en konstant enum;

enum E1 {
  X,
  Y,
  Z,
}

I dette tilfellet har ikke det første medlemmet av enum en initialisering, og TypeScript tildeler den verdien 0.

Du kan også vurdere dette eksemplet;

enum E1 {
  X=1,
  Y,
  Z,
}

Dette er også en konstant enum, ettersom det første medlemmet tildeles en verdi, og den inkrementelle regelen brukes på resten.

Beregnede enums blander konstante og beregnede medlemmer. Sjekk ut dette eksemplet;

enum Color {
  Red = 100,
  Green = (Math.random() * 100),
  Blue = 200
}

Enum-medlem «Blå» er et konstant medlem. På den annen side er enum-medlemmet «Green» en enum beregnet med Math.random()-funksjonen under kjøring.

#5. Const enums

const enums brukes til å øke ytelsen til numeriske enums. I dette tilfellet erklærer vi enum som en konst.

Tenk på denne koden som viser ukedagene;

enum Weekday {
  Monday = 1,
  Tuesday,
  Wednesday,
  Thursday,
  Friday
}

Hvis vi kjører console.log(Weekday.Thursday), får vi svaret vårt som 4. Men hvis vi sjekker JavaScript som ble generert på kompileringstidspunktet, får vi dette;

"use strict";
var Weekday;
(function (Weekday) {
    Weekday[Weekday["Monday"] = 1] = "Monday";
    Weekday[Weekday["Tuesday"] = 2] = "Tuesday";
    Weekday[Weekday["Wednesday"] = 3] = "Wednesday";
    Weekday[Weekday["Thursday"] = 4] = "Thursday";
    Weekday[Weekday["Friday"] = 5] = "Friday";
})(Weekday || (Weekday = {}));
console.log(Weekday.Thursday);

Vi kan endre denne koden og erklære «Weekday» som en konstant;

const enum Weekday {
  Monday = 1,
  Tuesday,
  Wednesday,
  Thursday,
  Friday
}

Hvis vi kjører denne koden console.log(Weekday.Thursday), vil JavaScript som vil bli generert ved kompilering være;

"use strict";
console.log(4 /* Weekday.Thursday */);

Du kan se at JavaScript-koden på kompileringstidspunktet er optimalisert når du erklærer enumen din som en konst.

#6. Omgivelsesoppregninger

Ambient enums bruker nøkkelordet «declare» for å beskrive formen til allerede eksisterende enum-typer. Tenk på dette eksemplet;

declare enum Color {
  Red,
  Green,
  Blue
}

Ambient enums er deklarert utenfor enhver modul og kan brukes til å lage gjenbrukbare typer. Som sådan kan du alltid importere omgivelsesnumre og bruke dem i komponentene dine så lenge de er deklarert globalt.

Du forstår nå de forskjellige enum-typene i TypeScript. Vi kan nå vise hvordan du kan bruke enums på forskjellige måter. Dette vil være vår referansekode;

enum Direction {
  North="N",
  East="E",
  South="S",
  West="W",
};

Dette er noen brukstilfeller;

• Trekk ut enum medlemmer. For eksempel, hvis vi ønsker å få tilgang til nord, kan vi bruke

console.log(Retning.Nord); // Utganger: «N»

• Bruk enum-medlemmer: Du kan velge et bestemt enum-medlem for å representere en bestemt retning. For eksempel,

const currentDirection = Direction.East;
console.log(`The current direction is ${currentDirection}`);

Dette vil gi denne utgangen «Gjeldende retning er E»

Enums vs. Object Maps i TypeScript

Enums brukes til å representere et begrenset sett med verdier. For eksempel regnbuens farger eller ukedager. Enums er sterkt skrevet, noe som betyr at de fanger opp eventuelle feil under utvikling. Dette er et eksempel på en TypeScript enum;

enum Color {
  Red,
  Green,
  Blue,
}

Objektkart/ ordbøker/ nøkkel-verdi-par lagrer og henter verdier knyttet til spesifikke nøkler. Du kan bruke TypeScript Object Maps til å lagre alle typer data. Imidlertid er de ikke strengt skrevet, noe som betyr at typefeil kanskje ikke blir fanget opp under utvikling. Dette er et eksempel på et objektkart med de samme fargene;

const colors = {
  red: "FF0000",
  green: "00FF00",
  blue: "0000FF",
};

De største forskjellene mellom enums og objektkart i TypeScript er;

• Enums er strengt skrevet, mens objektkart ikke er det
• Enums er en «Type», mens objektkart er en datastruktur
• Enums er ikke fleksible, mens objektkart er fleksible

Beste praksis for bruk av Enums i TypeScript

Vi har allerede uttalt at TypeScript ikke er det eneste programmeringsspråket med enums-funksjonen. Å følge de beste fremgangsmåtene sikrer at du skriver ren, optimalisert og feilfri kode. Dette er noen av de beste fremgangsmåtene når du skriver/bruker TypeScript-oppslag;

• Bruk store bokstaver: Bruk alltid det første ordet med stor bokstav når du navngir en oppregning. For eksempel er det alltid tilrådelig å ha en enum «Nummer» i stedet for «nummer».
• Bruk enums for konstanter: Enums brukes best til å deklarere et fast sett med relaterte elementer. For eksempel kan det bare være 7 dager i en uke. Enum-medlemmene skal aldri endres under utførelse.
• Unngå overbruk av opptegnelser: Du har kanskje nettopp lært et nytt konsept og ønsker å bruke det nesten overalt i TypeScript-prosjektet ditt. Bruk imidlertid alltid TypeScript-oppslag med måte. TypeScript-oppslag er et godt valg når du vil opprettholde kodelesbarhet.
• Betrakt enums som enums: Du kan bruke TypeScript-enums til forskjellige formål. Det beste alternativet er imidlertid å bruke dem til å representere bare enums og ikke andre datastrukturer.
• Unngå automatiske enums: TypeScript tildeler verdier til enum-medlemmene hvis du ikke tildeler dem eksplisitt. Gi enums-verdiene dine og unngå uventet oppførsel når du kjører koden.
• Dokumentoppslag: Dokumenter eller kommenter alltid koden din hvis du har tenkt at den skal konsumeres av allmennheten. Forklar hva hver enum gjør og hvorfor er den beste brukssaken.

Du kan også utforske de beste TypeScript-bibliotekene og kjøretiden for å vite som utvikler.

Konklusjon

Du kan definere enums i TypeScript og forklare de forskjellige typene og deres brukstilfeller. TypeScript vil komme godt med når du ønsker å ha kodeklarhet. Det er imidlertid også noen tilfeller der du bør unngå dem og bruke gjenstander i stedet.

For eksempel bør du ikke bruke enums når du arbeider med dynamiske verdier. Du kan heller ikke bruke enums som variabler; programmet vil returnere feil.

Du kan lære mer om forskjellene mellom TypeScript og JavaScript hvis du fortsatt er forvirret av de to.