Type Assertions and Guards

Last Updated : 23 Jul, 2025

Type Assertions and Type Guards are powerful features in TypeScript that are used to handle data types more effectively. They allow you to narrow down types, assign the correct types, and safely access properties or methods that may not be directly accessible based on the type.

What are Type Assertions?

Type Assertions allow you to explicitly define a type when TypeScript cannot infer it automatically. They do not change the actual data but instruct TypeScript to treat a value as a specific type.

Syntax for Type Assertions

There are two ways to write type assertions in TypeScript:

1. Using the as keyword (Recommended)

JavaScript

let value: any = "Hello, TypeScript";
let strLength: number = (value as string).length;
console.log(strLength); // Output: 16

In this Example

value as string tells TypeScript to treat value as a string.
.length is accessed safely after the assertion.

2. Using the angle-bracket (<>) syntax (not recommended in JSX files)

JavaScript

let value: unknown = "Hello, TypeScript";
let strLength: number = (<string>value).length;
console.log(strLength); // Output: 17

In this example

<string>value asserts value as a string.
.length retrieves the number of characters in "Hello, TypeScript" (17).

When to Use Type Assertions

When you have more specific knowledge about the type: If you know the type of a variable better than TypeScript does, you can assert the type to make it work as expected.
In cases of dynamic content: For example, when you work with DOM elements or data that is fetched from external sources (such as JSON), where the type might not be inferred by TypeScript.

Note: Type Assertions do not perform type conversion; they only tell TypeScript to treat a value as a specific type.

Type Guards

Type Guards are techniques used to check and refine types at runtime, ensuring safe operations based on the variable’s actual type.

1. typeof Type Guard (For Primitives)

The typeof operator helps check primitive types like string, number, or boolean.

JavaScript

function example(value: number | string): void {
    if (typeof value === "string") {
        console.log(value.length); // Safe to access length
    } else {
        console.log(value.toFixed(2)); // Safe for number
    }
}

example("Hello, TypeScript!"); // Output: 17
example(123.456); // Output: 123.46

Output

17
123.46

In this example

If value is a string, we access .length.
If value is a number, .toFixed(2) is used.

2. instanceof Type Guard (For Objects and Classes)

The instanceof operator checks if an object belongs to a specific class.

JavaScript

class Animal {
    move() {
        console.log("Moving...");
    }
}

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

function makeSound(animal: Animal) {
    if (animal instanceof Dog) {
        animal.bark();  // Safe to call bark()
    } else {
        animal.move();  // Safe to call move()
    }
}

const dog = new Dog();
makeSound(dog);  

const animal = new Animal();
makeSound(animal);

Output

Woof!
Moving...

In this example

instanceof ensures animal is a Dog before calling bark().
If not, it falls back to the move() method from Animal.

3. User-Defined Type Guards

Custom functions can act as type guards for complex types.

JavaScript

interface Cat {
    type: "cat";
    meow(): void;
}

interface Dog {
    type: "dog";
    bark(): void;
}

function isCat(animal: Cat | Dog): animal is Cat {
    return animal.type === "cat";
}

function makeSound(animal: Cat | Dog) {
    if (isCat(animal)) {
        animal.meow();
    } else {
        animal.bark();
    }
}

const myCat: Cat = { type: "cat", meow: () => console.log("Meow!") };
makeSound(myCat);

Output

Meow

In this example

isCat() ensures animal is a Cat before calling meow().
If not, it calls bark() safely.

Why Use Type Guards?

Improved Type Safety: Type Guards allow TypeScript to narrow down the type within a specific scope, ensuring that operations on variables are type-safe and reducing runtime errors.
Handling Union Types: When working with union types (e.g., string | number), Type Guards help determine the exact type at runtime, so you can handle each type appropriately.

Differences Between Type Assertions and Type Guards

Feature	Type Assertions	Type Guards
Type Safety	No runtime check, can be unsafe	Performs runtime checks
Syntax	Uses `as` or `< >` syntax	Uses `typeof`, `instanceof`, `in`, or custom predicates
Use Case	When you know the type beforehand	When dealing with multiple possible types

Angular Authentication Using Route Guards

sneha2dmo

Improve

Article Tags :

Type Assertions and Guards

What are Type Assertions?

Syntax for Type Assertions

When to Use Type Assertions

Type Guards

1. typeof Type Guard (For Primitives)

2. instanceof Type Guard (For Objects and Classes)

3. User-Defined Type Guards

Why Use Type Guards?

Differences Between Type Assertions and Type Guards

Similar Reads