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.