Notice: This page requires JavaScript to function properly.
Please enable JavaScript in your browser settings or update your browser.
Challenge: Class Inheritance with Extends and Using Super | Classes
Advanced JavaScript Mastery
course content

Course Content

Advanced JavaScript Mastery

Advanced JavaScript Mastery

1. Classes
2. DOM Manipulation
3. Events and Event Handling
4. Asynchronous JavaScript and APIs

bookChallenge: Class Inheritance with Extends and Using Super

Task

You're working on a transportation management system that tracks different types of vehicles. Each vehicle has a make, model, and year. For electric vehicles, you also need to track the batteryCapacity. You'll use inheritance to extend a general Vehicle class for specific electric vehicles.

  1. Create an ElectricVehicle class that extends Vehicle;
  2. The ElectricVehicle constructor should accept make, model, year, and batteryCapacity;
  3. Use super() to initialize make, model, and year in the parent class;
  4. Add a getDetails method to ElectricVehicle that overrides Vehicle's getDetails method. It should call super.getDetails() and add information about batteryCapacity. The format should be: "{make} {model} ({year}) with a battery capacity of {batteryCapacity} kWh.".
12345678910111213141516171819202122232425262728293031
class Vehicle { constructor(make, model, year) { this.make = make; this.model = model; this.year = year; } getDetails() { return `${this.make} ${this.model} (${this.year})`; } } class ElectricVehicle _____ _____ { _____(make, model, year, _____) { _____(_____, _____, _____); this.batteryCapacity = batteryCapacity; } _____() { return `${super._____} with a battery capacity of ${ _____._____ } kWh.`; } } // Testing const vehicle = new Vehicle('Toyota', 'Camry', 2020); console.log(vehicle.getDetails()); // Expected: Toyota Camry (2020) const electricVehicle = new ElectricVehicle('Tesla', 'Model 3', 2021, 75); console.log(electricVehicle.getDetails()); // Expected: Tesla Model 3 (2021) with a battery capacity of 75 kWh.
copy
  • Define a class ElectricVehicle that extends Vehicle;
  • In the ElectricVehicle constructor, add a parameter batteryCapacity after make, model, and year;
  • Use super(make, model, year) to call the parent class's constructor and initialize make, model, and year;
  • Assign batteryCapacity to a property in ElectricVehicle;
  • Define a getDetails method in ElectricVehicle that overrides Vehicle's getDetails method;
  • Inside getDetails, use super.getDetails() to get the parent class details, then add the battery capacity information to the return string.
12345678910111213141516171819202122232425262728293031
class Vehicle { constructor(make, model, year) { this.make = make; this.model = model; this.year = year; } getDetails() { return `${this.make} ${this.model} (${this.year})`; } } class ElectricVehicle extends Vehicle { constructor(make, model, year, batteryCapacity) { super(make, model, year); this.batteryCapacity = batteryCapacity; } getDetails() { return `${super.getDetails()} with a battery capacity of ${ this.batteryCapacity } kWh.`; } } // Testing const vehicle = new Vehicle('Toyota', 'Camry', 2020); console.log(vehicle.getDetails()); // Output: Toyota Camry (2020) const electricVehicle = new ElectricVehicle('Tesla', 'Model 3', 2021, 75); console.log(electricVehicle.getDetails()); // Output: Tesla Model 3 (2021) with a battery capacity of 75 kWh.
copy

Everything was clear?

How can we improve it?

Thanks for your feedback!

Section 1. Chapter 15
We're sorry to hear that something went wrong. What happened?
some-alt