Typorithm · medium

Classes & Prototypes

prototypes-classesjavascript-coreclassprototypeextends
Saved on this device
Full lesson · 8 learning steps Open any exercise for focused practice
1

Step 1 of 8 · intro card

Learn Classes & Prototypes

0%

Objects & this

class is syntax over the prototype chain: methods live on the prototype and are shared by all instances. extends links a subclass to its parent's prototype, and super calls the parent's constructor or methods.

A class declaration defines a constructor plus methods. The methods are placed on Animal.prototype, so every instance shares one copy rather than getting its own.

Looking up a property walks the prototype chain: the instance first, then Animal.prototype, then Object.prototype — class syntax just makes this readable.

extends sets the subclass's prototype to inherit from the parent, so a Dog instance can use Animal's methods directly.

Inside a subclass, super.method() calls the parent's version (and super(...) in a constructor runs the parent constructor first), letting you extend behaviour instead of copy-pasting it.

01

class is sugar over the prototype chain.

02

Methods live on the prototype, shared by all instances.

03

extends links a subclass to its parent.

04

super calls the parent constructor or method.

class Animal {
  constructor(name) {
    this.name = name;
  }
  speak() {
    return this.name + " makes a sound";
  }
}
class Dog extends Animal {
  speak() {
    return super.speak() + " (woof)";
  }
}

Read the implementation

Connect each part of the code to the concept before you type.

1. Class declaration

class is sugar over the prototype chain; methods live on Animal.prototype.

class Animal {

2. Constructor

constructor runs when you call new Animal(...) to initialise the instance.

constructor(name) {

3. Prototype method

speak is stored once on the prototype and shared by every instance.

speak() {
    return this.name + " makes a sound";
  }

4. Inheritance

extends links Dog.prototype to Animal.prototype, inheriting its methods.

class Dog extends Animal {

5. Super call

super.speak() invokes the parent's method, letting Dog extend rather than fully replace it.

super.speak()

A complete learning loop

01

Understand

Read the concept map and follow the code breakdown.

02

Reconstruct

Type the implementation, repair mistakes and work through every recall exercise.

03

Verify

Use the final check without hints; revisit weak concepts in short practice sessions.

Classes & Prototypes: Lesson & Practice · Typorithm | ApplyDjinn