Lære Type Narrowing | Type Inference and Advanced Type Safety

Sveip for å vise menyen

TypeScript uses type narrowing to help you write safer code when working with values that could be more than one type. Type narrowing means TypeScript automatically figures out a more specific type for a variable based on how you check it in your code. This allows you to use properties or methods that only exist on that specific type, without TypeScript raising errors.


              1234567891011121314151617181920212223242526272829303132333435363738394041
            
function printValue(value: string | number) {
  if (typeof value === "string") {
    // TypeScript knows value is a string here
    console.log("String value:", value.toUpperCase());
  } else {
    // TypeScript knows value is a number here
    console.log("Number value:", value + 10);
  }
}

class Animal {
  speak() {
    console.log("Animal sound");
  }
}

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

function makeSound(animal: Animal) {
  if (animal instanceof Dog) {
    // TypeScript knows animal is a Dog here
    animal.bark();
  } else {
    // TypeScript knows animal is an Animal, but not a Dog
    animal.speak();
  }
}

// ---- Function calls (required for output) ----
printValue("hello");
printValue(5);

const genericAnimal = new Animal();
const dog = new Dog();

makeSound(genericAnimal);
makeSound(dog);

One of the most common ways TypeScript narrows types is by using the typeof operator. In the printValue function above, the parameter value can be a string or a number. Inside the if (typeof value === "string") block, TypeScript knows that value must be a string, so you can safely call string methods like toUpperCase(). In the else block, TypeScript knows that value can only be a number, so you can perform number operations.

Another way TypeScript narrows types is with the instanceof operator, which checks if an object was created from a specific class. In the makeSound function, the parameter animal could be an Animal or a Dog. When you write if (animal instanceof Dog), TypeScript understands that inside this block, animal is a Dog, so you can call the bark() method. Otherwise, TypeScript treats animal as a generic Animal, and you can only call methods defined on Animal.

By using these type guards, you can write code that is both flexible and type-safe, allowing TypeScript to help you avoid mistakes when working with union types or class hierarchies.

Alt var klart?

Takk for tilbakemeldingene dine!

Seksjon 3. Kapittel 2

Spør AI

Spør om hva du vil, eller prøv ett av de foreslåtte spørsmålene for å starte chatten vår

Seksjon 3. Kapittel 2