JavaScriptのプロトタイプ継承の理解 – JavaScriptで始めるプログラミング

JavaScriptのプロトタイプ継承の理解

JavaScriptでのプログラミングにおいて、プロトタイプ継承は非常に重要な概念です。さらに、プロトタイプを理解することはオブジェクト指向プログラミングの理解を深めることに繋がります。

プロトタイプ継承とは

JavaScriptでは、全てのオブジェクトは他のオブジェクトを継承することができます。これをプロトタイプ継承と呼びます。__proto__プロパティを使って、オブジェクトがどのオブジェクトを継承しているか確認することができます。

プロトタイプチェーン

プロトタイプ継承の中心には、プロトタイプチェーンという概念が存在します。例えば、あるオブジェクトのプロパティやメソッドを探す際に、そのオブジェクト自身に見つからない場合、JavaScriptはプロトタイプチェーンを遡って探します。

注：プロトタイプチェーンは効率的なコード再利用を促します。

JavaScript Documentation

例：プロトタイプ継承の実装

具体的な例を以下に示します。まず基本的なオブジェクトを定義し、次にそれを継承するオブジェクトを作成します。

function Person(name) {
  this.name = name;
}

Person.prototype.sayHello = function() {
  console.log(`Hello, my name is ${this.name}`);
};

function Developer(name, skill) {
  Person.call(this, name);
  this.skill = skill;
}

Developer.prototype = Object.create(Person.prototype);
Developer.prototype.constructor = Developer;

Developer.prototype.code = function() {
  console.log(`I am coding in ${this.skill}`);
};

const dev = new Developer('Alice', 'JavaScript');

dev.sayHello();  // 出力: Hello, my name is Alice
dev.code();  // 出力: I am coding in JavaScript

プロトタイプとクラス

ES6以降では、class構文の導入により、プロトタイプ継承がより直感的に書けるようになりました。こちら(外部リンク)から詳細な情報を確認できます。

クラスを使った例

クラス構文を使用したプロトタイプ継承の例は次の通りです：

class Person {
  constructor(name) {
    this.name = name;
  }

  sayHello() {
    console.log(`Hello, my name is ${this.name}`);
  }
}

class Developer extends Person {
  constructor(name, skill) {
    super(name);
    this.skill = skill;
  }

  code() {
    console.log(`I am coding in ${this.skill}`);
  }
}

const dev = new Developer('Bob', 'Python');

dev.sayHello();  // 出力: Hello, my name is Bob
dev.code();  // 出力: I am coding in Python

このように、プロトタイプとクラス構文を利用することで、効率的にオブジェクトの機能を再利用できます。

コメントを残す