Class implementing multiple interfaces in Typescript - Interactive Code Practice

Practice - 5 Tasks

1fill in blank

easy

Complete the code to declare a class that implements two interfaces.

Typescript

interface A {
  methodA(): void;
}

interface B {
  methodB(): void;
}

class MyClass implements [1] {
  methodA() {
    console.log('A');
  }
  methodB() {
    console.log('B');
  }
}

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

AA B

BA, B

CA | B

DA & B

Attempts:

3 left

💡 Hint

Common Mistakes

Using '&' or '|' instead of commas to separate interfaces.

Omitting the comma between interfaces.

In TypeScript, to implement multiple interfaces, list them separated by commas.

2fill in blank

medium

Complete the code to correctly declare the class implementing interfaces with methods.

Typescript

interface Printable {
  print(): void;
}

interface Scannable {
  scan(): void;
}

class MultiFunctionDevice implements Printable, [1] {
  print() {
    console.log('Printing');
  }
  scan() {
    console.log('Scanning');
  }
}

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

ACopyable

BWritable

CReadable

DScannable

Attempts:

3 left

💡 Hint

Common Mistakes

Choosing an interface that is not declared or unrelated.

Confusing interface names.

The class implements both Printable and Scannable interfaces, so the second interface is Scannable.

3fill in blank

hard

Fix the error in the class declaration to correctly implement two interfaces.

Typescript

interface X {
  doX(): void;
}

interface Y {
  doY(): void;
}

class XYDevice implements X [1] Y {
  doX() {
    console.log('X');
  }
  doY() {
    console.log('Y');
  }
}

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

A,

B&

C|

Dand

Attempts:

3 left

💡 Hint

Common Mistakes

Using '&' or '|' instead of commas.

Writing 'and' as a separator.

Interfaces are separated by commas in the implements clause, not by & or |.

4fill in blank

hard

Fill both blanks to complete the class implementing two interfaces with properties.

Typescript

interface HasName {
  name: string;
}

interface HasAge {
  age: number;
}

class Person implements [1], [2] {
  constructor(public name: string, public age: number) {}
}

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

AHasName

BHasAge

CHasJob

DHasAddress

Attempts:

3 left

💡 Hint

Common Mistakes

Choosing interfaces not related to the properties.

Mixing up interface names.

The class Person implements HasName and HasAge interfaces as it has name and age properties.

5fill in blank

hard

Fill all three blanks to complete the class implementing interfaces with methods and properties.

Typescript

interface CanRun {
  run(): void;
}

interface CanJump {
  jump(): void;
}

class Athlete implements [1], [2] {
  constructor(public speed: number) {}
  [3]() {
    console.log('Running fast');
  }
  jump() {
    console.log('Jumping high');
  }
}

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

ACanRun

BCanJump

Crun

Djump

Attempts:

3 left

💡 Hint

Common Mistakes

Using wrong interface names in implements.

Misspelling method names.

The class implements CanRun and CanJump interfaces. The method run() is defined with the correct name.