JS interview in 2 minutes / Inheritance in OOP

// It may be worth to read previous part first
// JS interview in 2 minutes / Object-Oriented Programming (OOP)

Question:
What is Inheritance in OOP?

Quick answer:
Inheritance is a way to modify or extend parent class in child class.

Longer answer:
Let's see what we've got in the previous post and try to extend it.

class DogProfile {
  constructor(name, age) {
    this.name = name
    this.age = age
    this.isGood = true
  }

  bark() {
    alert('Bark!')
  }

  barkInEnglish() {
    alert(`Hello my friend! My name is ${this.name}.`)
  }

  // ...
}

Now we have a working dog's profile, but what if we need to add a cat's profile? It would be a bit different because good or bad terminology is not applicable to cats, they are above these measurements.

{
  name: 'Fluffer',
  age: 2,
  isFluffer: true,
}

Copying and modifying the DogProfile class would be weird since we will need to maintain two almost exact copies.

Inheritance to the rescue! We can move shared functionality to some standalone class and just inherit DogProfile and CatProfile from the new BaseProfile class.

class BaseProfile {
  constructor(name, age) {
    this.name = name
    this.age = age
  }

  setName(name) {
    this.name = name
  }

  setAge(age) {
    this.age = age
  }
}

class DogProfile extends BaseProfile {
  constructor(name, age) {
    super(name, age)
    this.isGood = true
  }

  bark() {
    alert('Bark!')
  }

  barkInEnglish() {
    alert(`Hello my friend! My name is ${this.name}.`)
  }
}

class CatProfile extends BaseProfile {
  constructor(name, age, isFluffer) {
    super(name, age)
    this.isFluffer = isFluffer
  }

  meow() {
    alert('Meow!')
  }
}

const doggert = new DogProfile('Doggert', 2)
doggert.barkInEnglish()

const fluffert = new CatProfile('Fluffert', 2, true)
fluffert.meow()

Awesome, like this, we can create any new profile type without much effort and every new class will only have new fields and methods which are needed.

Real-life applications:

An issue with Inheritance is that if you don't plan few steps ahead, you may end up in mess.

One possible type of issue is when inheritance doesn't actually describe data relations.

class Duck {
  quack() {}
  fly() {}
}

class Plane extends Duck {
  // Forbidding quacking...
  quack() { throw new Error('DO I LOOK LIKE A DUCK TO YOU?') }
}

This won't be a very reliable Plane to fly on. Imagine someone will update Duck fly methods with a time limit after it gets tired. The plane will get tired and return to the nest as well.

Another possible issue is when you have complex data and there are more than 9000 levels of classes nesting.

// I saw this once, it was terrible 😱

class Base {
  constructor(id) { this.id = id }
}

class NamedProfile extends Base { /* ... */ }
class ProfileWithRoles extends NamedProfile { /* ... */ }
class AdminProfile extends ProfileWithRoles { /* ... */ }
// ...
// Things can get much worse if you end up using multiple inheritances without any control
// https://stackoverflow.com/questions/29879267/es6-class-multiple-inheritance/45332959

There is a way to play around with this issue using composition over inheritance or using design patterns. I will try to cover them in the following posts.

Resources:
wiki/OOP
wiki/Inheritance

Other posts:

• JS interview in 2 minutes / Object-Oriented Programming (OOP)
• JS interview in 2 minutes / Static vs Dynamic typing
• JS interview in 2 minutes / Higher Order Functions

Btw, I will post more fun stuff here and on Twitter. Let's be friends 👋