Mestring av typesikkerhet: En omfattende guide til type guards og type assertions

Innen programvareutvikling, spesielt når man jobber med dynamisk typede språk som JavaScript, kan det være en betydelig utfordring å opprettholde typesikkerhet. TypeScript, et supersett av JavaScript, løser dette problemet ved å introdusere statisk typing. Men selv med TypeScripts typesystem, oppstår det situasjoner der kompilatoren trenger hjelp til å utlede den korrekte typen til en variabel. Det er her type guards og type assertions kommer inn i bildet. Denne omfattende guiden vil dykke ned i disse kraftfulle funksjonene, og gi praktiske eksempler og beste praksis for å forbedre kodens pålitelighet og vedlikeholdbarhet.

Hva er type guards?

Type guards er TypeScript-uttrykk som snevrer inn typen til en variabel innenfor et bestemt omfang. De gjør det mulig for kompilatoren å forstå typen til en variabel mer presist enn den opprinnelig utledet. Dette er spesielt nyttig når man håndterer union-typer eller når typen til en variabel avhenger av kjøretidsbetingelser. Ved å bruke type guards kan du unngå kjøretidsfeil og skrive mer robust kode.

Vanlige teknikker for type guards

TypeScript tilbyr flere innebygde mekanismer for å lage type guards:

• typeof-operatøren: Sjekker den primitive typen til en variabel (f.eks., "string", "number", "boolean", "undefined", "object", "function", "symbol", "bigint").
• instanceof-operatøren: Sjekker om et objekt er en instans av en bestemt klasse.
• in-operatøren: Sjekker om et objekt har en bestemt egenskap.
• Egendefinerte type guard-funksjoner: Funksjoner som returnerer et typepredikat, som er en spesiell type boolsk uttrykk som TypeScript bruker for å snevre inn typer.

Bruk av typeof

typeof-operatøren er en enkel måte å sjekke den primitive typen til en variabel på. Den returnerer en streng som indikerer typen.

            function printValue(value: string | number) {
  if (typeof value === "string") {
    console.log(value.toUpperCase()); // TypeScript vet at 'value' er en streng her
  } else {
    console.log(value.toFixed(2)); // TypeScript vet at 'value' er et tall her
  }
}

printValue("hello"); // Output: HELLO
printValue(3.14159); // Output: 3.14

            

              
                Copy
              
            
          

Bruk av instanceof

instanceof-operatøren sjekker om et objekt er en instans av en bestemt klasse. Dette er spesielt nyttig når man jobber med arv.

            class Animal {
  name: string;
  constructor(name: string) {
    this.name = name;
  }
}

class Dog extends Animal {
  bark() {
    console.log("Woof!");
  }
}

function makeSound(animal: Animal) {
  if (animal instanceof Dog) {
    animal.bark(); // TypeScript vet at 'animal' er en Dog her
  } else {
    console.log("Generisk dyrelyd");
  }
}

const myDog = new Dog("Buddy");
const myAnimal = new Animal("Generisk Dyr");

makeSound(myDog); // Output: Woof!
makeSound(myAnimal); // Output: Generisk dyrelyd

            

              
                Copy
              
            
          

Bruk av in

in-operatøren sjekker om et objekt har en bestemt egenskap. Dette er nyttig når man håndterer objekter som kan ha forskjellige egenskaper avhengig av typen.

            interface Bird {
  fly(): void;
  layEggs(): void;
}

interface Fish {
  swim(): void;
  layEggs(): void;
}

function move(animal: Bird | Fish) {
  if ("fly" in animal) {
    animal.fly(); // TypeScript vet at 'animal' er en Bird her
  } else {
    animal.swim(); // TypeScript vet at 'animal' er en Fish her
  }
}

const myBird: Bird = { fly: () => console.log("Flyr"), layEggs: () => console.log("Legger egg") };
const myFish: Fish = { swim: () => console.log("Svømmer"), layEggs: () => console.log("Legger egg") };

move(myBird); // Output: Flyr
move(myFish); // Output: Svømmer

            

              
                Copy
              
            
          

Egendefinerte type guard-funksjoner

For mer komplekse scenarioer kan du definere dine egne type guard-funksjoner. Disse funksjonene returnerer et typepredikat, som er et boolsk uttrykk TypeScript bruker for å snevre inn typen til en variabel. Et typepredikat har formen variabel is Type.

            interface Square {
  kind: "square";
  size: number;
}

interface Circle {
  kind: "circle";
  radius: number;
}

type Shape = Square | Circle;

function isSquare(shape: Shape): shape is Square {
  return shape.kind === "square";
}

function getArea(shape: Shape) {
  if (isSquare(shape)) {
    return shape.size * shape.size; // TypeScript vet at 'shape' er en Square her
  } else {
    return Math.PI * shape.radius * shape.radius; // TypeScript vet at 'shape' er en Circle her
  }
}

const mySquare: Square = { kind: "square", size: 5 };
const myCircle: Circle = { kind: "circle", radius: 3 };

console.log(getArea(mySquare)); // Output: 25
console.log(getArea(myCircle)); // Output: 28.274333882308138

            

              
                Copy
              
            
          

Hva er type assertions?

Type assertions (type-påstander) er en måte å fortelle TypeScript-kompilatoren at du vet mer om typen til en variabel enn den for øyeblikket forstår. De er en måte å overstyre TypeScripts typeutledning på og eksplisitt spesifisere typen til en verdi. Det er imidlertid viktig å bruke type assertions med forsiktighet, da de kan omgå TypeScripts typesjekking og potensielt føre til kjøretidsfeil hvis de brukes feil.

Type assertions har to former:

• Vinkelparentes-syntaks: <Type>value
• as-nøkkelordet: value as Type

as-nøkkelordet foretrekkes generelt fordi det er mer kompatibelt med JSX.

Når man bør bruke type assertions

Type assertions brukes vanligvis i følgende scenarioer:

• Når du er sikker på typen til en variabel som TypeScript ikke kan utlede.
• Når du jobber med kode som samhandler med JavaScript-biblioteker som ikke er fullstendig typet.
• Når du trenger å konvertere en verdi til en mer spesifikk type.

Eksempler på type assertions

Eksplisitt type assertion

I dette eksempelet påstår vi at kallet til document.getElementById vil returnere et HTMLCanvasElement. Uten påstanden ville TypeScript utledet en mer generisk type som HTMLElement | null.

            const canvas = document.getElementById("myCanvas") as HTMLCanvasElement;
const ctx = canvas.getContext("2d"); // TypeScript vet at 'canvas' er et HTMLCanvasElement her

if (ctx) {
  ctx.fillStyle = "#FF0000";
  ctx.fillRect(0, 0, 150, 75);
}

            

              
                Copy
              
            
          

Arbeid med ukjente typer

Når du jobber med data fra en ekstern kilde, for eksempel et API, kan du motta data med en ukjent type. Du kan bruke en type assertion for å fortelle TypeScript hvordan dataene skal behandles.

            interface User {
  id: number;
  name: string;
  email: string;
}

async function fetchUser(id: number): Promise<User> {
  const response = await fetch(`https://jsonplaceholder.typicode.com/users/${id}`);
  const data = await response.json();
  return data as User; // Påstå at dataene er en User
}

fetchUser(1)
  .then(user => {
    console.log(user.name); // TypeScript vet at 'user' er en User her
  })
  .catch(error => {
    console.error("Feil ved henting av bruker:", error);
  });

            

              
                Copy
              
            
          

Forholdsregler ved bruk av type assertions

Type assertions bør brukes sparsomt og med forsiktighet. Overdreven bruk av type assertions kan skjule underliggende typefeil og føre til kjøretidsproblemer. Her er noen viktige betraktninger:

• Unngå tvungne påstander: Ikke bruk type assertions for å tvinge en verdi inn i en type den åpenbart ikke er. Dette kan omgå TypeScripts typesjekking og føre til uventet oppførsel.
• Foretrekk type guards: Når det er mulig, bruk type guards i stedet for type assertions. Type guards gir en tryggere og mer pålitelig måte å snevre inn typer på.
• Valider data: Hvis du påstår typen til data fra en ekstern kilde, bør du vurdere å validere dataene mot et skjema for å sikre at de samsvarer med den forventede typen.

Typeinnsnevring (Type Narrowing)

Type guards er uløselig knyttet til konseptet typeinnsnevring (type narrowing). Typeinnsnevring er prosessen med å raffinere typen til en variabel til en mer spesifikk type basert på kjøretidsbetingelser eller sjekker. Type guards er verktøyene vi bruker for å oppnå typeinnsnevring.

TypeScript bruker kontrollflytanalyse for å forstå hvordan typen til en variabel endres i ulike grener av koden. Når en type guard brukes, oppdaterer TypeScript sin interne forståelse av variabelens type, slik at du trygt kan bruke metoder og egenskaper som er spesifikke for den typen.

Eksempel på typeinnsnevring

            function processValue(value: string | number | null) {
  if (value === null) {
    console.log("Verdien er null");
  } else if (typeof value === "string") {
    console.log(value.toUpperCase()); // TypeScript vet at 'value' er en streng her
  } else {
    console.log(value.toFixed(2)); // TypeScript vet at 'value' er et tall her
  }
}

processValue("test"); // Output: TEST
processValue(123.456); // Output: 123.46
processValue(null); // Output: Verdien er null

            

              
                Copy
              
            
          

Beste praksis

For å effektivt utnytte type guards og type assertions i dine TypeScript-prosjekter, bør du vurdere følgende beste praksis:

• Foretrekk type guards fremfor type assertions: Type guards gir en tryggere og mer pålitelig måte å snevre inn typer på. Bruk type assertions kun når det er nødvendig og med forsiktighet.
• Bruk egendefinerte type guards for komplekse scenarioer: Når du håndterer komplekse typeforhold eller egendefinerte datastrukturer, definer dine egne type guard-funksjoner for å forbedre kodens klarhet og vedlikeholdbarhet.
• Dokumenter type assertions: Hvis du bruker type assertions, legg til kommentarer for å forklare hvorfor du bruker dem og hvorfor du mener påstanden er trygg.
• Valider eksterne data: Når du jobber med data fra eksterne kilder, valider dataene mot et skjema for å sikre at de samsvarer med den forventede typen. Biblioteker som zod eller yup kan være nyttige for dette.
• Hold typedefinisjoner nøyaktige: Sørg for at typedefinisjonene dine nøyaktig reflekterer strukturen til dataene dine. Unøyaktige typedefinisjoner kan føre til feil typeutledninger og kjøretidsfeil.
• Aktiver Strict Mode: Bruk TypeScripts strict mode (strict: true i tsconfig.json) for å aktivere strengere typesjekking og fange potensielle feil tidlig.

Internasjonale hensyn

Når du utvikler applikasjoner for et globalt publikum, vær oppmerksom på hvordan type guards og type assertions kan påvirke lokaliserings- og internasjonaliseringsarbeid (i18n). Vurder spesifikt:

• Dataformatering: Tall- og datoformater varierer betydelig mellom ulike lokasjoner (locales). Når du utfører typesjekker eller påstander på numeriske eller datoverdier, sørg for at du bruker lokaliseringsbevisste formaterings- og parsingsfunksjoner. Bruk for eksempel biblioteker som Intl.NumberFormat og Intl.DateTimeFormat for å formatere og parse tall og datoer i henhold til brukerens locale. Å feilaktig anta et bestemt format (f.eks. amerikansk datoformat MM/DD/YYYY) kan føre til feil i andre locales.
• Valutahåndtering: Valutasymboler og formatering er også forskjellige globalt. Når du håndterer pengeverdier, bruk biblioteker som støtter valutahåndtering og konvertering, og unngå å hardkode valutasymboler. Sørg for at dine type guards håndterer ulike valutatyper korrekt og forhindrer utilsiktet blanding av valutaer.
• Tegnkoding: Vær oppmerksom på problemer med tegnkoding, spesielt når du jobber med strenger. Sørg for at koden din håndterer Unicode-tegn korrekt og unngår antakelser om tegnsett. Vurder å bruke biblioteker som tilbyr Unicode-bevisste strengmanipuleringsfunksjoner.
• Høyre-til-venstre (RTL) språk: Hvis applikasjonen din støtter RTL-språk som arabisk eller hebraisk, sørg for at dine type guards og påstander håndterer tekstretningen korrekt. Vær oppmerksom på hvordan RTL-tekst kan påvirke strengsammenligninger og valideringer.

Konklusjon

Type guards og type assertions er essensielle verktøy for å forbedre typesikkerheten og skrive mer robust TypeScript-kode. Ved å forstå hvordan du bruker disse funksjonene effektivt, kan du forhindre kjøretidsfeil, forbedre kodens vedlikeholdbarhet og lage mer pålitelige applikasjoner. Husk å foretrekke type guards fremfor type assertions når det er mulig, dokumentere dine type assertions, og validere eksterne data for å sikre nøyaktigheten av typeinformasjonen din. Ved å anvende disse prinsippene vil du kunne lage mer stabil og forutsigbar programvare, egnet for global distribusjon.