Covariance and contravariance in Typescript - Mini Project: Build & Apply

Understanding Covariance and Contravariance in TypeScript

📖 Scenario: Imagine you are building a simple system to manage different types of animals and their sounds. You want to understand how TypeScript handles assigning functions and objects with related types, focusing on covariance and contravariance.

🎯 Goal: Learn how covariance and contravariance work in TypeScript by creating interfaces and functions that demonstrate these concepts clearly.

📋 What You'll Learn

Create interfaces for animals with specific properties

Create functions that accept and return these interfaces

Use TypeScript's type system to explore covariance and contravariance

Print results to observe type assignments

💡 Why This Matters

🌍 Real World

Understanding covariance and contravariance helps when working with complex type hierarchies in real-world TypeScript applications, such as UI components or data processing pipelines.

💼 Career

Many software engineering roles require strong knowledge of TypeScript's type system to write safe and maintainable code, especially when working with libraries or frameworks that use advanced typing.

1

Create animal interfaces

Create two interfaces called Animal and Dog. Animal should have a property name of type string. Dog should extend Animal and add a property breed of type string.

Typescript

# Create interfaces Animal and Dog as described
// Your code here

Need a hint?

Use interface keyword and extends to create Dog from Animal.

2

Create functions with animal types

Create a function called getAnimalName that takes a parameter animal of type Animal and returns a string with the animal's name. Also create a function called getDogBreed that takes a parameter dog of type Dog and returns a string with the dog's breed.

Typescript

interface Animal {
    name: string;
}

interface Dog extends Animal {
    breed: string;
}

// Create functions getAnimalName and getDogBreed as described
// Your code here

Need a hint?

Define functions with correct parameter types and return the requested property.

3

Assign functions to demonstrate covariance and contravariance

Create a variable animalNameFunc of type (animal: Animal) => string and assign it the function getDogBreed. Then create a variable dogBreedFunc of type (dog: Dog) => string and assign it the function getAnimalName. This will show how TypeScript handles covariance and contravariance in function assignments.

Typescript

interface Animal {
    name: string;
}

interface Dog extends Animal {
    breed: string;
}

function getAnimalName(animal: Animal): string {
    return animal.name;
}

function getDogBreed(dog: Dog): string {
    return dog.breed;
}

// Assign functions to variables animalNameFunc and dogBreedFunc as described
// Your code here

Need a hint?

Assign functions to variables with specified function types to see TypeScript's type compatibility.

4

Test the function assignments and print results

Create a variable myDog of type Dog with name set to "Buddy" and breed set to "Golden Retriever". Then call animalNameFunc with myDog and print the result. Also call dogBreedFunc with myDog and print the result.

Typescript

interface Animal {
    name: string;
}

interface Dog extends Animal {
    breed: string;
}

function getAnimalName(animal: Animal): string {
    return animal.name;
}

function getDogBreed(dog: Dog): string {
    return dog.breed;
}

let animalNameFunc: (animal: Animal) => string = getDogBreed;
let dogBreedFunc: (dog: Dog) => string = getAnimalName;

// Create myDog and print results of calling animalNameFunc and dogBreedFunc
// Your code here

Need a hint?

Define myDog with correct properties and use console.log to print results.