0Pricing
JavaScript Academy · Lesson

Class Syntax (Preview): constructor, methods, static, extends

A gentle look at class syntax: constructor, instance methods, static helpers, and simple inheritance with extends.

Class Syntax (Preview): constructor, methods, static, extends is a free JavaScript Academy lesson on CoddyKit — lesson 2 of 2. You can read the complete lesson below for free — then practise it hands-on in the browser with a built-in code editor and a 24/7 AI tutor. It is part of the JavaScript Academy learning path, one of 2 lessons in the course, and your progress syncs across the web and the CoddyKit app.

Intro to class syntax

Goal: See how class syntax maps to prototypes.

  • constructor for setup
  • methods on the prototype
  • static helpers on the class
  • extends for simple inheritance
Class Syntax (Preview): constructor, methods, static, extends — illustration 1

Constructor + method

The constructor runs on new. Methods in the class body are shared by all instances (prototype).

// Class with a constructor and an instance method
class Counter {
  constructor(start = 0) {
    // Initialize fields
    this.value = start;
  }

  // Instance method (lives on the prototype)
  inc() {
    this.value = this.value + 1;
    console.log("Now:", this.value);
  }
}

const c = new Counter(1);
c.inc();
c.inc();
Class Syntax (Preview): constructor, methods, static, extends — illustration 2

Prototype sharing

Instance methods in class syntax are prototype methods, so the same function is reused.

// Prototype sharing demo
class Greeter {
  say(name) {
    console.log("Hello,", name);
  }
}

const g1 = new Greeter();
const g2 = new Greeter();

// Same function reference for both instances
console.log("Same method?", g1.say === g2.say);
Class Syntax (Preview): constructor, methods, static, extends — illustration 3

Static method basics

static methods are called on the class itself, not on instances.

// Static method: lives on the class, not instances
class MathBox {
  static double(n) {
    return n * 2;
  }
}

console.log("Static call:", MathBox.double(4));

const m = new MathBox();
// @ts-ignore (conceptually): next line would be undefined in JS
console.log("Instance has static?", typeof m.double);
Class Syntax (Preview): constructor, methods, static, extends — illustration 4

Simple inheritance

extends sets up the prototype chain; use super to call the parent method.

// Inheritance with extends and super
class Animal {
  speak() {
    console.log("...");
  }
}

class Dog extends Animal {
  speak() {
    // Optionally call parent method
    super.speak();
    console.log("Woof");
  }
}

const d = new Dog();
d.speak();
Class Syntax (Preview): constructor, methods, static, extends — illustration 5

Tips for classes

Tips:

  • Keep classes tiny: a couple of fields and methods.
  • Prefer instance methods in the class body (shared via prototype).
  • Use static for pure helpers not tied to an instance.
Class Syntax (Preview): constructor, methods, static, extends — illustration 6

Class method placement quiz

Quick check: Shared method placement.

Class Syntax (Preview): constructor, methods, static, extends — illustration 7

Recap

Recap: You created a class with a constructor, wrote shared instance methods, added a static helper, and extended a base class with super.

Class Syntax (Preview): constructor, methods, static, extends — illustration 8

Frequently asked questions

Is the “Class Syntax (Preview): constructor, methods, static, extends” lesson free?

Yes — the full text of “Class Syntax (Preview): constructor, methods, static, extends” is free to read here on the web, and the JavaScript Academy course includes 2 lessons in total. To practise it interactively (a built-in code editor and a 24/7 AI tutor) and unlock the rest of the JavaScript Academy course, upgrade to CoddyKit PRO.

What will I learn in “Class Syntax (Preview): constructor, methods, static, extends”?

A gentle look at class syntax: constructor, instance methods, static helpers, and simple inheritance with extends. You practise JavaScript Academy with hands-on code you run directly in the browser, and a 24/7 AI tutor answers your questions as you work through the lesson.

Do I need any experience to start JavaScript Academy?

No prior experience is required. JavaScript Academy on CoddyKit is structured for beginners through advanced learners; this is — lesson 2 of 2, so you can start here or from the beginning and move at your own pace.

How long does the “Class Syntax (Preview): constructor, methods, static, extends” lesson take?

Most CoddyKit lessons take about 5–10 minutes. Each one is bite-sized and interactive, so you make steady progress and pick up exactly where you left off across the web and the app.

Can I write and run code in this JavaScript Academy lesson?

Yes. Every JavaScript Academy lesson includes a built-in code editor, so you write and run real code right in your browser and get instant AI feedback — no local setup required.

All lessons in this course

  1. Prototype Chain & Own-Property Basics
  2. Class Syntax (Preview): constructor, methods, static, extends
← Back to JavaScript Academy