Why inheritance needs types in Typescript - Test Your Understanding

Practice - 5 Tasks

1fill in blank

easy

Complete the code to declare a class that inherits from another class.

Typescript

class Animal {
  speak() {
    console.log('Animal speaks');
  }
}

class Dog extends [1] {
  speak() {
    console.log('Dog barks');
  }
}

Drag options to blanks, or click blank then click option'

ASpeak

BDog

CObject

DAnimal

Attempts:

3 left

💡 Hint

Common Mistakes

Using the child class name after 'extends' instead of the parent class.

Forgetting to use 'extends' keyword.

The class Dog inherits from the class Animal using the 'extends' keyword followed by the parent class name.

2fill in blank

medium

Complete the code to specify the type of the parameter in the constructor of the subclass.

Typescript

class Person {
  name: string;
  constructor(name: string) {
    this.name = name;
  }
}

class Employee extends Person {
  constructor(name: [1]) {
    super(name);
  }
}

Drag options to blanks, or click blank then click option'

Anumber

Bboolean

Cstring

Dany

Attempts:

3 left

💡 Hint

Common Mistakes

Using a different type than the parent class parameter.

Omitting the type annotation.

The parameter 'name' should be of type 'string' to match the parent class constructor.

3fill in blank

hard

Fix the error in the method override by specifying the correct return type.

Typescript

class Shape {
  area(): number {
    return 0;
  }
}

class Circle extends Shape {
  area(): [1] {
    return Math.PI * 5 * 5;
  }
}

Drag options to blanks, or click blank then click option'

Anumber

Bvoid

Cstring

Dboolean

Attempts:

3 left

💡 Hint

Common Mistakes

Using 'void' or 'string' as return type which causes type errors.

Omitting the return type.

The method 'area' returns a number, so the return type must be 'number' to match the parent method.

4fill in blank

hard

Fill both blanks to declare a class with a typed property and constructor parameter.

Typescript

class Vehicle {
  wheels: [1];
  constructor(wheels: [2]) {
    this.wheels = wheels;
  }
}

Drag options to blanks, or click blank then click option'

Anumber

Bstring

Cboolean

Dany

Attempts:

3 left

💡 Hint

Common Mistakes

Using different types for property and parameter.

Using non-numeric types like string or boolean.

The property 'wheels' and its constructor parameter should both be of type 'number'.

5fill in blank

hard

Fill all three blanks to create a method with correct parameter and return types.

Typescript

class Calculator {
  add(a: [1], b: [2]): [3] {
    return a + b;
  }
}

Drag options to blanks, or click blank then click option'

Astring

Bnumber

Cboolean

Dany

Attempts:

3 left

💡 Hint

Common Mistakes

Using 'string' or 'boolean' types which cause errors.

Mismatching parameter and return types.

The add method takes two numbers and returns a number, so all types should be 'number'.