8. Type Compatibility

Type compatibility and generics are advanced TypeScript concepts that enhance the type safety and flexibility of your code. In this article, we’ll explore type compatibility and how it works in TypeScript, as well as dive into the power of generics for creating reusable and type-safe code.

Type Compatibility Overview

TypeScript uses a structural type system, which means that types are based on their structure (the shape of the object) rather than their names or explicit declarations. Type compatibility determines if one type can be assigned to another.

interface Point {
    x: number;
    y: number;
}

const pointA: Point = { x: 1, y: 2 };
const pointB = { x: 3, y: 4 }; // Infers the Point type

pointA = pointB; // Allowed
pointB = pointA; // Allowed

In this example, pointA and pointB have the same shape (properties x and y with number types), so they are compatible. You can assign pointB to pointA and vice versa without issues.

Type Inference and Compatibility

TypeScript uses type inference to determine the types of variables when they are declared. It leverages this feature for type compatibility.

let numberValue = 42;
let stringValue = "Hello, TypeScript!";

numberValue = stringValue; // Error: Type 'string' is not assignable to type 'number'.

In this example, numberValue initially holds a number, and stringValue holds a string. TypeScript infers their types accordingly. When you try to assign stringValue to numberValue, TypeScript raises an error because they are incompatible types.

Type compatibility also plays a crucial role in function and method parameter matching. When assigning functions to variables or passing them as arguments, TypeScript checks that the function’s parameter types are compatible with the expected types.

function greet(person: string) {
    console.log(`Hello, ${person}!`);
}

let greeter: (person: string) => void;

greeter = greet; // Allowed, compatible parameter types

In this example, greeter is assigned the greet function because their parameter types match.

Generics

Generics are a powerful feature in TypeScript that enable you to write flexible and reusable code while maintaining strong type safety. In this article, we’ll introduce generics, explore how to create generic functions and classes, and understand constraints and default types for generics.

Generics Introduction

Generics allow you to create functions, classes, and interfaces that work with various data types without sacrificing type safety. They provide the ability to define types at runtime, making your code more adaptable and versatile.

function identity<T>(value: T): T {
    return value;
}

const numberResult: number = identity(42);
const stringResult: string = identity("Hello, TypeScript!");

In this example, identity is a generic function that accepts a value of any type and returns the same type as the output. The type parameter T is used to capture the input and return type.

Generic Functions and Classes

Generic Functions

You can create generic functions by specifying type parameters in angle brackets before the function parameters.

function swap<T>(a: T, b: T): [T, T] {
    return [b, a];
}

const result = swap(1, 2); // result is [2, 1]

In this example, the swap function is generic and works with any type T. It swaps the values of a and b and returns a tuple of the same type.

Generic Classes

Generic classes allow you to create classes with type parameters that can be used within the class methods and properties.

class Box<T> {
    private value: T;

    constructor(value: T) {
        this.value = value;
    }

    getValue(): T {
        return this.value;
    }
}

const numberBox = new Box(42);
const stringBox = new Box("Hello, TypeScript!");

const numberValue: number = numberBox.getValue();
const stringValue: string = stringBox.getValue();

In this code, the Box class is generic and can store and retrieve values of any type. The type parameter T is used to define the type of the value stored in the box.

Constraints and Default Types

Constraints

You can impose constraints on generic types to limit the types that can be used with a generic function or class. This ensures that the code inside the function or class works correctly for specific types.

interface Animal {
    name: string;
}

class Zoo<T extends Animal> {
    constructor(private animals: T[]) {}

    getAnimalNames(): string[] {
        return this.animals.map((animal) => animal.name);
    }
}

const lion: Animal = { name: "Lion" };
const tiger: Animal = { name: "Tiger" };

const zoo = new Zoo([lion, tiger]);
const animalNames: string[] = zoo.getAnimalNames(); // ["Lion", "Tiger"]

In this example, the Zoo class has a type parameter T that extends the Animal interface. This constraint ensures that only types with a name property can be used with the Zoo class.

Default Types

You can specify default types for type parameters in generics, allowing you to provide a fallback type if one is not explicitly provided.

function getDefaultValue<T = string>(): T {
    return "" as unknown as T;
}

const stringValue: string = getDefaultValue();
const numberValue: number = getDefaultValue<number>();

In this code, the getDefaultValue function has a default type of string for the type parameter T. If no type is provided when calling the function, it defaults to string. However, you can specify a different type when calling the function, as shown in the second call.

Conclusion

Type compatibility is a fundamental concept in TypeScript that determines if types can be assigned to each other based on their shape. Generics provide a powerful way to create flexible and reusable code by introducing type parameters. Understanding these concepts and how they work in TypeScript is essential for writing robust and adaptable code that maintains strong type safety.

Generics in TypeScript are a powerful tool for creating flexible and reusable code that maintains strong type safety. By introducing type parameters in functions and classes, you can create adaptable code that works with a wide range of data types. Constraints and default types further enhance the versatility of generics, allowing you to enforce specific type requirements and provide fallback types when necessary. Understanding and effectively using generics is essential for writing efficient and maintainable TypeScript code.