継承は、既存のクラスを拡張し、それらのプロパティやメソッドを利用できるようにする、オブジェクト指向プログラミングの中心的な概念です。JavaScriptはES6の導入により、元のプロトタイプメソッドよりもはるかに扱いやすく、より新しく堅牢な継承構文を導入しました。このガイドでは、キーワードextendsを使用してJavaScriptで継承を適用する方法を示し、基底クラスのコンストラクターをsuperで正しく呼び出す方法をステップバイステップで説明します。
主な学び
- JavaScriptでの継承はextendsキーワードを使用して行われます。
- 基底クラスのコンストラクターはsuperで呼び出す必要があります。
- インスタンス変数は派生クラス内でthisキーワードを使用して参照できます。
ステップバイステップガイド
基底クラスの作成
継承を始めるために、まずShapeという名前の基底クラスを作成します。このクラスでは、コンストラクターといくつかのメソッドを定義します。
ここで、コンストラクターを持つShapeクラスを定義します。このコンストラクター内で、他のクラスがアクセスできる変数や関数を定義できます。
サブクラスの探求
基底クラスを作成した後、Shapeから継承するサブクラスを作成できます。この例では、新しいクラスをConcreteShapeと呼びます。
このサブクラスでは、extendsキーワードを使用してConcreteShapeがShapeから継承することを示します。サブクラスのコンストラクターは、super()を使用して基底クラスShapeのコンストラクターを呼び出します。これは、継承を正しく実装するために必要です。
サブクラスのインスタンス化
サブクラスを作成したら、このクラスのインスタンスを生成する時が来ました。
ここでは、ConcreteShapeクラスの新しいオブジェクトmyShapeを生成し、コンストラクターに説明を渡します。次に、説明を出力するprintメソッドを呼び出します。
追加のプロパティの追加
サブクラスにさらにプロパティを追加したり、このサブクラス専用のメソッドを追加したりできます。
ここでは、コンストラクターに追加のパラメーターを追加することでConcreteShapeクラスを拡張しました。
継承の利用
superキーワードを使用することで、基底クラスのdescribeメソッドを呼び出し、基底クラスとサブクラスのプロパティを組み合わせることができます。
まとめ - JavaScriptにおける継承: ES6からES13まで
このチュートリアルでは、JavaScriptの継承がどのように機能するか、特に新しいclass構文を使用して学びました。クラスを定義する方法、基底クラスから継承する方法、そしてコンストラクターを正しく呼び出す方法を見てきました。これらのメカニズムは、機能を効率的に再利用することで、コードベースをクリーンで保守しやすく保つのに役立ちます。
よくある質問
super()とthisの違いは何ですか?super()は基底クラスのコンストラクターを呼び出すために使用され、thisは現在のクラスのインスタンスにアクセスします。
ES6クラスを使用する方がプロトタイプよりも良いのはなぜですか?ES6クラスは、コードの読みやすさと理解を容易にする、より明確で直感的な構文を提供します。
複数の基底クラスを持つことはできますか?いいえ、JavaScriptは多重継承をサポートしていません。クラスは別のクラスからのみ継承できます。
super()を呼び出さなかったらどうなりますか?super()を呼び出さないとエラーが発生します。基底クラスのコンストラクターが実行されず、そのクラスに必要な初期化が行われないためです。
