Sådan bruges TypeScript Type Assertions
Typepåstande i TypeScript er en måde at fortælle compileren, at du ved mere om typen af en værdi, end den gør. Dette kan være nyttigt, når du arbejder med værdier, der har usikre eller brede typer, og du ønsker at indsnævre dem for bedre typekontrol og kodelæsbarhed. I denne artikel vil vi undersøge, hvordan man bruger TypeScript-typepåstande effektivt.
Hvad er Type Assertion?
Type assertion er en mekanisme i TypeScript, der giver dig mulighed for at tilsidesætte standardtypeslutningen lavet af TypeScript-kompileren. Det ændrer ikke den faktiske runtime-type, men hjælper compileren med at forstå typen af en variabel af hensyn til typekontrol. Typepåstande ligner typecasting på andre sprog som C# eller Java, men uden nogen runtime-påvirkning.
Syntaks for typepåstande
Der er to måder at bruge typepåstande på i TypeScript:
- Brug af søgeordet
as
(anbefales) - Brug af vinkelbeslag
<>
Brug af søgeordet as
Den mest almindelige måde at bruge typepåstande på er med søgeordet as
:
let someValue: unknown = "Hello, TypeScript!";
let strLength: number = (someValue as string).length;
console.log(strLength); // Output: 17
I dette eksempel fortæller vi TypeScript, at someValue
er af typen string
, hvilket giver os mulighed for at bruge egenskaben length
.
Brug af vinkelbeslag <>
Den alternative syntaks for typepåstande bruger vinkelparenteser:
let someValue: unknown = "Hello, TypeScript!";
let strLength: number = (someValue).length;
console.log(strLength); // Output: 17
Denne syntaks opnår det samme resultat som as
syntaksen. Det anbefales dog ikke i miljøer, hvor JSX (såsom React) bruges, da det er i konflikt med syntaksen for JSX-elementer.
Almindelige eksempler på typepåstande
Typepåstande bruges almindeligvis i flere scenarier:
- Når du arbejder med typen
ukendt
- Ved håndtering af DOM-elementer
- Ved indsnævring af fagforeningstyper
- Når du interagerer med tredjepartsbiblioteker, der mangler typedefinitioner
Eksempel: Påstand om typer med typen ukendt
ukendt
typen er nyttig, når du vil acceptere en hvilken som helst type, men stadig skal foretage en typekontrol, før du bruger den. Typepåstande hjælper med at indsnævre typen:
function getLength(value: unknown): number {
if (typeof value === "string") {
return (value as string).length;
} else if (Array.isArray(value)) {
return (value as any[]).length;
}
return 0;
}
console.log(getLength("Hello")); // Output: 5
console.log(getLength([1, 2, 3])); // Output: 3
console.log(getLength(42)); // Output: 0
I dette eksempel bruger vi typepåstande til at fortælle TypeScript, at værdi
er en streng
eller en enhver[]
matrix.
Eksempel: Håndtering af DOM-elementer
Når man manipulerer DOM, skal TypeScript kende den specifikke type af et element for at give passende egenskaber og metoder. Typepåstande er nyttige her:
const inputElement = document.getElementById("user-input") as HTMLInputElement;
inputElement.value = "Hello, TypeScript!";
Her bruger vi type assertion til at fortælle TypeScript, at inputElement
er et HTMLInputElement
, hvilket giver os direkte adgang til value
egenskaben.
Typepåstand vs. Typestøbning
Det er vigtigt at forstå forskellen mellem typepåstand og typestøbning. I TypeScript ændrer typepåstande ikke den faktiske type ved kørsel; de fortæller kun TypeScript-kompileren, hvordan typen skal behandles på kompileringstidspunktet. I modsætning hertil kan typecasting på andre sprog som C# eller Java involvere konvertering af en værdi fra en type til en anden under kørsel, hvilket kan påvirke ydeevne og adfærd.
Forsigtighed ved brug af typepåstande
Selvom typepåstande kan være kraftfulde, kan misbrug føre til runtime-fejl. Her er nogle tips til at bruge dem sikkert:
- Undgå at bruge påstande til at konvertere inkompatible typer med magt.
- Brug altid påstande med forsigtighed og foretræk indsnævre typer ved hjælp af TypeScripts typebeskyttelse.
- Brug påstande, når du er sikker på typen, og når det ellers ikke er muligt at indsnævre den.
Eksempel på forkert typepåstand
Her er et eksempel på en farlig type påstand:
let someValue: string = "Hello, TypeScript!";
let numValue: number = (someValue as unknown as number); // Dangerous!
console.log(numValue); // Output: Hello, TypeScript! (incorrect)
Denne kode kompilerer uden fejl, men det vil føre til uventet adfærd under kørsel, fordi strengen behandles forkert som et tal.
Konklusion
Typepåstande i TypeScript giver en måde at tilsidesætte de udledte typer, når du ved mere om en værdis type, end TypeScript gør. De er nyttige, når du håndterer usikre typer, interagerer med tredjepartsbiblioteker eller arbejder med DOM-elementer. De bør dog bruges med forsigtighed for at undgå runtime fejl og sikre typesikkerhed i din kode.
Ved at mestre typepåstande kan du skrive mere udtryksfuld og robust TypeScript-kode. Øv dig i at bruge dem i forskellige scenarier for at blive mere komfortabel med denne kraftfulde funktion.