Apprendre Safe Narrowing with Type Guards and Discriminant Properties


              123456789101112131415161718192021222324252627282930313233343536373839404142
            
// Define interfaces with a discriminant property
interface Dog {
  kind: "dog";
  name: string;
  bark(): void;
}

interface Cat {
  kind: "cat";
  name: string;
  meow(): void;
}

interface Fish {
  kind: "fish";
  name: string;
  swim(): void;
}

// Union of all animal types
type Animal = Dog | Cat | Fish;

// Custom type guard for Dog
function isDog(animal: Animal): animal is Dog {
  return animal.kind === "dog";
}

// Custom type guard for Cat
function isCat(animal: Animal): animal is Cat {
  return animal.kind === "cat";
}

// Using discriminant property and custom type guards to safely narrow
function handleAnimal(animal: Animal) {
  if (isDog(animal)) {
    animal.bark();
  } else if (isCat(animal)) {
    animal.meow();
  } else if (animal.kind === "fish") {
    animal.swim();
  }
}

When working with unions of multiple interfaces in TypeScript, it is critical to maintain type safety. Rather than relying on unsafe type assertions, you should consistently use discriminant properties and custom type guards. Discriminant properties, such as a kind field with a unique string literal for each interface, allow you to easily and safely distinguish between types at runtime. Custom type guards further enhance safety by encapsulating the logic for narrowing types, making your code more readable and robust. Always avoid unsafe assertions like as SomeType unless you are absolutely certain of the type, as these can lead to runtime errors if used incorrectly. Maintaining type safety through these patterns ensures that your code is both reliable and easier to maintain, especially as your union types grow in complexity.

Tout était clair ?

Merci pour vos commentaires !

Section 3. Chapitre 7

Demandez à l'IA

Posez n'importe quelle question ou essayez l'une des questions suggérées pour commencer notre discussion

Suggested prompts:

Can you explain how custom type guards work in this example?

Why is using a discriminant property safer than type assertions?

Can you show how to add another animal type to this union?

Awesome!

Completion rate improved to 5.88

Glissez pour afficher le menu


              123456789101112131415161718192021222324252627282930313233343536373839404142
            
// Define interfaces with a discriminant property
interface Dog {
  kind: "dog";
  name: string;
  bark(): void;
}

interface Cat {
  kind: "cat";
  name: string;
  meow(): void;
}

interface Fish {
  kind: "fish";
  name: string;
  swim(): void;
}

// Union of all animal types
type Animal = Dog | Cat | Fish;

// Custom type guard for Dog
function isDog(animal: Animal): animal is Dog {
  return animal.kind === "dog";
}

// Custom type guard for Cat
function isCat(animal: Animal): animal is Cat {
  return animal.kind === "cat";
}

// Using discriminant property and custom type guards to safely narrow
function handleAnimal(animal: Animal) {
  if (isDog(animal)) {
    animal.bark();
  } else if (isCat(animal)) {
    animal.meow();
  } else if (animal.kind === "fish") {
    animal.swim();
  }
}

Tout était clair ?

Merci pour vos commentaires !

Section 3. Chapitre 7