クラスを使ってみよう(オブジェクト指向)

このレッスンでは、JavaScriptのclass構文を使ったオブジェクト指向プログラミングの基本を学び、共通の性質を持つデータをまとめて扱えるようになることを目標にします。「JavaScript class 使い方」「JavaScript constructor とは」で調べている方向けです。

クラスは、似た性質を持つオブジェクトの「設計図」です。classでクラスを定義し、newでその設計図から実際のオブジェクト(インスタンス)を作ります。「動物の設計図」があれば「犬」「猫」といった具体的なインスタンスを何個でも作れるイメージです。constructorは、インスタンスを作るときに最初に呼ばれる特別なメソッドで、初期状態を設定するために使います。

サンプルコードではAnimalクラスにnameとsoundという2つのプロパティを持たせ、speak()というメソッドで鳴き声のメッセージを組み立てています。new Animal("犬", "ワン")とすると、その情報を持った1つのインスタンス(dog)が作られ、dog.speak()でそのインスタンス専用の処理を呼び出せます。

初心者がよくつまずくのが、thisが何を指しているかの理解です。クラスの中のthisは「今作られているそのインスタンス自身」を指しますが、慣れないうちは混乱しやすいポイントです。またnewを付け忘れてクラスを呼び出そうとするとエラーになる点も覚えておきましょう。

実際の開発現場では、ユーザー・商品・注文といった「モノ」を表すデータをクラスとして設計するのがオブジェクト指向の基本です。大規模なアプリケーションほど、こうしたクラス設計の質がコード全体の保守性を左右するため、実務でも重要視される考え方です。

クラスにはメソッドをいくつでも追加でき、「鳴く」だけでなく「食べる」「歩く」といった振る舞いもまとめて定義できます。関連するデータ(プロパティ)と処理(メソッド)を1つのクラスにまとめておくことで、コードの見通しがよくなり、再利用もしやすくなります。

クラスにはプロパティを外部から直接変更されたくない場合に使う「プライベートフィールド」という仕組みもあります。#を先頭に付けたプロパティ名にすると、クラスの外からはアクセスできなくなり、より安全なクラス設計ができます。