クラスと型

このレッスンでは、TypeScriptでのクラスの基本的な書き方を学びます。「TypeScript class 使い方」で調べている方向けです。

TypeScriptのクラスは、プロパティに型を付けられる点がJavaScriptとの大きな違いです。constructor(コンストラクタ)で初期値を受け取り、各プロパティに型注釈を付けて宣言します。

サンプルコードでは、class Animalを定義し、name: stringというプロパティと、鳴き声を返すspeak()メソッドを持たせています。

初心者がよくつまずくのが、プロパティの宣言をクラス本体に書き忘れることです。TypeScriptのクラスでは、constructorの引数に型を書くだけでなく、クラス本体側にもname: string;のようにプロパティを宣言しておく必要があります(constructorの引数にpublicを付けると省略できます)。

実際の開発現場では、ゲームのキャラクターや、業務アプリの「商品」「ユーザー」のような、状態と振る舞いをセットで持つデータをクラスとして表現します。

📖 お手本コード

class Animal {
  name: string;
  constructor(name: string) {
    this.name = name;
  }
  speak(): string {
    return `${this.name}が鳴いています。`;
  }
}

const dog = new Animal("ポチ");
console.log(dog.speak());

✍️ あなたのコード

コードを書いたら「実行する」を押してください

🧪 このサイトではTypeScriptを直接コンパイル・実行できないため、お手本コードと同じ内容を入力できたかをその場で判定します(採点はブラウザ内だけで行われ、どこにも送信されません)。

🎯

ここまでできればゴール達成!
鳴き声を返す動物クラスのような、状態と振る舞いを持つオブジェクトが作れるようになります。