プログラミング

JavaScriptのプロトタイプ継承入門

JavaScript におけるプロトタイプ継承(Prototypal Inheritance)—— 第 1 部

JavaScript はオブジェクト指向プログラミング(OOP)をサポートする言語ですが、クラスベースの言語(Java や C++ など)とは異なり、JavaScript は プロトタイプベースの継承(Prototypal Inheritance) を採用しています。この特性により、オブジェクトは他のオブジェクトを直接継承し、動的にプロパティやメソッドを追加・変更 することができます。

本記事では、JavaScript におけるプロトタイプ継承の基本概念を詳しく解説し、実践的なコード例を通じてその仕組みを理解します。


1. プロトタイプとは何か?

オブジェクトの基本構造

JavaScript のオブジェクトは、プロパティ(変数)とメソッド(関数)を持つデータ構造です。例えば、次のようなオブジェクト person を考えてみましょう。

javascript
let person = { name: "太郎", age: 30, greet: function() { console.log("こんにちは!私は " + this.name + " です。"); } };

この person オブジェクトには nameage の 2 つのプロパティと greet メソッドが含まれています。

プロトタイプチェーン

JavaScript では、すべてのオブジェクトは もう一つのオブジェクトを継承することが可能 です。この継承元となるオブジェクトを プロトタイプ(prototype) と呼びます。

例えば、上記の person オブジェクトは、JavaScript の組み込みオブジェクト Object を基に作られています。そのため、personObject のプロパティやメソッドを使用できます。

javascript
console.log(person.toString()); // [object Object]

person 自体には toString() メソッドは定義されていませんが、これは Object.prototype から継承されているため、使用できます。

このように、JavaScript のオブジェクトは 親オブジェクトのプロパティやメソッドを継承する仕組み を持ち、これを プロトタイプチェーン(Prototype Chain) と呼びます。


2. __proto__ プロパティと Object.getPrototypeOf()

JavaScript では、オブジェクトのプロトタイプを確認する方法として、以下の 2 つの方法があります。

  1. __proto__ プロパティ(非推奨だが、一般的に使われる)

  2. Object.getPrototypeOf() メソッド(推奨される)

__proto__ を使う方法

javascript
console.log(person.__proto__); // [Object: null prototype] {}

このように、person オブジェクトの __proto__Object.prototype を指していることが分かります。

Object.getPrototypeOf() を使う方法

javascript
console.log(Object.getPrototypeOf(person)); // [Object: null prototype] {}

Object.getPrototypeOf(person)Object.prototype を指しており、__proto__ と同じ情報を取得できます。

3. プロトタイプを使ったオブジェクトの継承

プロトタイプ継承を使うことで、あるオブジェクトを 別のオブジェクトの雛形として利用 し、新しいオブジェクトを

Back to top button