クラス構文（プレビュー）：constructor、メソッド、static、extends

class構文の概要

コンストラクターとメソッド

// 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();

プロトタイプの共有

// 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);

staticメソッドの基本

// 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);

単純な継承

// 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のヒント

クラスメソッドの配置クイズ

振り返り