Classes

Classes are syntactic sugar over JavaScript's prototype-based inheritance, introduced in ES6.

Class Syntax

class Animal {
  constructor(name) {
    this.name = name
  }

  speak() {
    return \`\${this.name} makes a sound.\`
  }
}

const dog = new Animal('Rex')
console.log(dog.speak()) // 'Rex makes a sound.'

Inheritance

class Dog extends Animal {
  constructor(name) {
    super(name)  // call parent constructor
  }

  speak() {
    return \`\${this.name} barks.\`
  }
}

const rex = new Dog('Rex')
console.log(rex.speak()) // 'Rex barks.'
console.log(rex instanceof Dog)    // true
console.log(rex instanceof Animal) // true

Static Methods

class MathUtils {
  static square(x) { return x * x }
  static cube(x) { return x * x * x }
}

MathUtils.square(4)  // 16
MathUtils.cube(3)    // 27
ℹ️ React prefers hooks

In modern React and React Native, hooks are preferred over class components. Classes are still useful for understanding JavaScript deeply.