Inheritance using classes in Javascript - Interactive Code Practice

Practice - 5 Tasks

1fill in blank

easy

Complete the code to define a class named Animal.

Javascript

class [1] {
  constructor(name) {
    this.name = name;
  }
}

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

ADog

BBird

CCat

DAnimal

Attempts:

3 left

💡 Hint

Common Mistakes

Using a subclass name like Dog instead of the base class Animal.

The class name should be Animal as it represents the base class.

2fill in blank

medium

Complete the code to make Dog inherit from Animal.

Javascript

class Dog [1] Animal {
  constructor(name, breed) {
    super(name);
    this.breed = breed;
  }
}

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

Auses

Binherits

Cextends

Dimplements

Attempts:

3 left

💡 Hint

Common Mistakes

Using 'inherits' or 'implements' which are not valid JavaScript keywords for inheritance.

In JavaScript, extends is used to inherit from another class.

3fill in blank

hard

Fix the error in the method overriding speak in Dog class.

Javascript

class Dog extends Animal {
  speak() {
    return [1] + ' barks.';
  }
}

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

Athis.name

Bname

Csuper.name

DAnimal.name

Attempts:

3 left

💡 Hint

Common Mistakes

Using 'name' without 'this' causes a reference error.

Using 'super.name' which is not valid for property access.

Use this.name to access the instance's name property inside the method.

4fill in blank

hard

Fill both blanks to create a subclass Cat that calls the parent constructor correctly.

Javascript

class Cat [1] Animal {
  constructor([2]) {
    super(name);
  }
}

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

Aextends

Bname

Cbreed

Dimplements

Attempts:

3 left

💡 Hint

Common Mistakes

Using 'implements' instead of 'extends'.

Passing 'breed' instead of 'name' to super.

The class should extend Animal and the constructor should take name as parameter to pass to super.

5fill in blank

hard

Fill all three blanks to override the speak method in Cat class and call the parent speak method.

Javascript

class Cat extends Animal {
  speak() {
    return super.[1]() + ' and meows.';
  }
  [2]() {
    return this.name;
  }
  constructor([3]) {
    super(name);
  }
}

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

Aspeak

BgetName

Cname

Dconstructor

Attempts:

3 left

💡 Hint

Common Mistakes

Calling a non-existent parent method.

Using wrong method names or constructor parameters.

The method speak calls super.speak(). The class defines a getName method returning this.name. The constructor takes name as parameter.