Back to Object Challenge
Code Studio · Level 8

Real JavaScript Classes

Make a blueprint, stamp out heroes. Classes let you design one template and create as many characters from it as you want — each with its own stats.

15-20 min Ages 9-12 Real Code JavaScript

What is a class?

A class is a cookie cutter for objects. You design the shape once — what every robot has and does — then stamp out as many robots as you want with new. Each one is its own object with its own values.

class Robot 🤖 🤖 🤖
  1. 1

    Design the cutter: class Robot { ... }

    The constructor lists what every robot gets when it's stamped (a name, a power), and methods like introduce() are actions every robot knows how to do.

  2. 2

    Stamp one out: new Robot("Bolt", "star scanner")

    new presses the cutter into the dough. Out comes a fresh object with its own name and power. this.name inside the class means "my name" — each robot keeps its own.

  3. 3

    Why coders use them

    Need 50 enemies? One class Enemy and a loop of new Enemy(...) — not 50 copy-pasted objects. Try stamping a second robot with a different name and calling introduce() on both!

Code Editor

Make a blueprint.

Example code 
class Robot {
  constructor(name, power) {
    this.name = name;
    this.power = power;
  }

  introduce() {
    say(this.name + " uses " + this.power);
  }
}

let helper = new Robot("Bolt", "star scanner");
helper.introduce();
🧩 Tap to add code blocks — design the blueprint, then stamp robots
Name robots Bolt, Nova, Kai, Milo, Wizard, Knight, Dragon, Unicorn, Cat, Dog for avatars. star shield fire
Blueprint Factory

Stamped Heroes

Run your code to stamp hero cards from the class…

Waiting for your class…