JavaScriptの継承:プロトタイプチェーン

JavaScriptはプロトタイプベースのオブジェクト指向言語です。ここでは、プロトタイプチェーンによる継承機構の仕組みについて説明します。

プロトタイプチェーンを用いた継承

prototypeを使うといわゆる継承を実現することができ、このことをプロトタイプチェーンと呼びます。継承とは、あるオブジェクトの性質を引き継いで他のオブジェクトから利用することです。

参照:JavaScriptのプロトタイプ:prototypeプロパティ

プロトタイプチェーンは、以下のように継承先コンストラクタ(クラスベースで言う子クラス)のprototypeプロパティに、継承元コンストラクタ(クラスベースで言う親クラス)のインスタンスを作成することで継承を行います。

次の例を見てみましょう。

StudentオブジェクトのprototypeにPersonオブジェクトのインスタンスを登録することで、Studentオブジェクトのインスタンス(stu1)からPersonオブジェクトのprototypeに登録されたsingメソッドを呼び出すことができます。

プロトタイプチェーン内部での働き

まず、student_インスタンスにsingというプロパティが登録されているかを調べます。見つからない場合、Student.prototypeを調べます。そこにもsingプロパティが見つからない場合、更にStudentオブジェクトのprototypeに登録されたPersonオブジェクトprototypeを調べます。

その結果、Personオブジェクトのprototypeとして登録されたsingプロパティをメソッドとして実行します。

プロトタイプチェーンでは基底クラスまで検索される

このように、JavaScriptではprototypeにインスタンスを登録することによって、継承を実現しています。

上記のように、prototypeを上位のオブジェクトに遡って検索していく仕組みのことをプロトタイプチェーンと呼び、最も基底となるObject.prototypeまで(プロパティが見つからなければ)検索を続けます。


Welcome to UX MILK

UX MILKはより良いサービスやプロダクトを作りたい人のためのメディアです。

このサイトについて