Super keyword behavior in Typescript - Interactive Code Practice

Practice - 5 Tasks

1fill in blank

easy

Complete the code to call the parent class constructor using super.

Typescript

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

class Dog extends Animal {
  constructor(name: string) {
    [1](name);
  }
}

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

Asuper

Bthis

Cparent

Dbase

Attempts:

3 left

💡 Hint

Common Mistakes

Using 'this' instead of 'super' to call the parent constructor.

Using 'parent' or 'base' which are not valid keywords in TypeScript.

In TypeScript, super is used to call the parent class constructor.

2fill in blank

medium

Complete the method to call the parent class method using super.

Typescript

class Animal {
  speak() {
    return "Animal sound";
  }
}

class Dog extends Animal {
  speak() {
    return [1].speak() + " and Bark";
  }
}

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

Asuper

Bparent

Cthis

Dbase

Attempts:

3 left

💡 Hint

Common Mistakes

Using 'this' instead of 'super' to call the parent method.

Using invalid keywords like 'parent' or 'base'.

Use super.methodName() to call a method from the parent class.

3fill in blank

hard

Fix the error by completing the constructor to properly call super before using this.

Typescript

class Person {
  constructor(public name: string) {}
}

class Employee extends Person {
  constructor(name: string, public id: number) {
    [1](name);
    this.id = id;
  }
}

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

Athis

Bbase

Cparent

Dsuper

Attempts:

3 left

💡 Hint

Common Mistakes

Calling 'this' before 'super' in the constructor.

Using invalid keywords like 'parent' or 'base'.

In derived classes, you must call super() before accessing this.

4fill in blank

hard

Fill both blanks to override a method and call the parent method using super.

Typescript

class Vehicle {
  move() {
    return "Moving";
  }
}

class Car extends Vehicle {
  move() {
    return [1].move() [2] " fast";
  }
}

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

Asuper

B+

C-

D*

Attempts:

3 left

💡 Hint

Common Mistakes

Using wrong operators like '-' or '*' for string concatenation.

Not using 'super' to call the parent method.

Use super.move() to call the parent method and + to join strings.

5fill in blank

hard

Fill all three blanks to override a method, call the parent method, and add extra text.

Typescript

class Printer {
  print() {
    return "Printing";
  }
}

class ColorPrinter extends Printer {
  print() {
    return [1].print() [2] " in color" [3] "!";
  }
}

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

Asuper

B+

C*

D-

Attempts:

3 left

💡 Hint

Common Mistakes

Using '*' or '-' instead of '+' for string concatenation.

Not calling the parent method with 'super'.

Use super.print() to call the parent method and + to join strings.