JavaScript のクラスと継承

JavaScript クラスは、継承、カプセル化、ポリモーフィズムなどのオブジェクト指向プログラミング (OOP) の概念を処理する最新の方法を提供します。このガイドでは、クラスの作成方法、JavaScript での継承の仕組み、クラスを拡張してより複雑なオブジェクトを作成する方法について説明します。

---

1. JavaScript のクラス

ES6 では、JavaScript に class キーワードを使用してオブジェクトを作成するための、よりクリーンで直感的な構(gòu)文が導(dǎo)入されました。

クラスを定義するための構(gòu)文:

class ClassName {
  constructor() {
    // Initialization code
  }
  methodName() {
    // Method code
  }
}

基本クラスの例:

class Animal {
  constructor(name, type) {
    this.name = name;
    this.type = type;
  }
  speak() {
    console.log(`${this.name} makes a sound.`);
  }
}

const dog = new Animal('Buddy', 'Dog');
dog.speak();  // Output: Buddy makes a sound.

重要なポイント:

• コンストラクター メソッド: コンストラクター メソッドは、クラスから作成されたオブジェクトを初期化するために使用される特別な関數(shù)です。
• インスタンス メソッド: クラス內(nèi)で定義された関數(shù)はインスタンス メソッドであり、クラスのインスタンスで呼び出すことができます。

---

2. JavaScript での継承

継承により、あるクラスが別のクラスからプロパティとメソッドを継承できます。 JavaScript では、これは extends キーワードを使用して実現(xiàn)できます。

継承の構(gòu)文:

class ChildClass extends ParentClass {
  constructor() {
    super(); // Calls the parent class constructor
    // Additional initialization code for child class
  }
}

継承の例:

class Animal {
  constructor(name) {
    this.name = name;
  }
  speak() {
    console.log(`${this.name} makes a sound.`);
  }
}

class Dog extends Animal {
  constructor(name, breed) {
    super(name); // Call the parent class constructor
    this.breed = breed;
  }
  speak() {
    console.log(`${this.name}, the ${this.breed}, barks.`);
  }
}

const dog = new Dog('Buddy', 'Golden Retriever');
dog.speak();  // Output: Buddy, the Golden Retriever, barks.

重要なポイント:

• super(): super キーワードは、親クラスのコンストラクターを呼び出して、継承されたプロパティを初期化します。
• メソッドのオーバーライド: 上記の speech() メソッドに見られるように、子クラスは親クラスのメソッドをオーバーライドできます。

---

3.継承とメソッドのオーバーライド

JavaScript では、子クラスが親クラスのメソッドをオーバーライドする場合、メソッドの子クラス バージョンが使用されます。これはメソッドのオーバーライドとして知られています。

メソッドのオーバーライドの例:

class Animal {
  constructor(name) {
    this.name = name;
  }
  speak() {
    console.log(`${this.name} makes a sound.`);
  }
}

class Cat extends Animal {
  speak() {
    console.log(`${this.name} meows.`);
  }
}

const cat = new Cat('Whiskers');
cat.speak();  // Output: Whiskers meows.

重要なポイント:

• 子クラスが獨自のメソッド実裝を提供すると、親クラスのメソッドがオーバーライドされます。
• 子クラスは、super.method() を使用して親クラスのメソッドを呼び出すことができます。

---

4.多重継承 (直接サポートされていません)

JavaScript は多重継承を直接サポートしていません。つまり、クラスは複數(shù)のクラスから同時に継承できません。ただし、ミックスインを使用することでこの制限を回避できます。

ミックスインの例:

class ClassName {
  constructor() {
    // Initialization code
  }
  methodName() {
    // Method code
  }
}

重要なポイント:

• ミックスは、継承を使用せずにクラスに機能を追加する方法です。
• Object.assign() を使用すると、あるオブジェクトのプロパティとメソッドを別のオブジェクトに「混合」できます。

---

5.靜的メソッドとプロパティ

靜的メソッドと靜的プロパティは、クラスのインスタンスではなく、クラス自體に屬します。これらはクラスで直接呼び出されます。

靜的メソッドの例:

class Animal {
  constructor(name, type) {
    this.name = name;
    this.type = type;
  }
  speak() {
    console.log(`${this.name} makes a sound.`);
  }
}

const dog = new Animal('Buddy', 'Dog');
dog.speak();  // Output: Buddy makes a sound.

重要なポイント:

• 靜的メソッドは、インスタンス固有のデータを必要としないユーティリティ関數(shù)に役立ちます。

---

6.ゲッターとセッター

ゲッターとセッターを使用すると、オブジェクトのプロパティを取得および設(shè)定するための特別なメソッドを定義できます。これらは通常、オブジェクトの狀態(tài)をカプセル化するために使用されます。

ゲッターとセッターの例:

class ChildClass extends ParentClass {
  constructor() {
    super(); // Calls the parent class constructor
    // Additional initialization code for child class
  }
}

重要なポイント:

• Getter: プロパティ値にアクセスする方法を定義します。
• Setter: プロパティ値の更新方法を定義します。

---

7.概要

• クラスは、オブジェクトを作成し、メソッドを使用してその動作を管理する最新の方法を提供します。
• 継承 により、あるクラスが別のクラスからプロパティとメソッドを継承できるため、機能を拡張しやすくなります。
• メソッドのオーバーライドにより、子クラスは親クラスの動作を変更または拡張できます。
• JavaScript は、拡張機能とカプセル化のために靜的メソッド、ミックスイン、ゲッター/セッター関數(shù)もサポートしています。

クラスと継承はオブジェクト指向プログラミングにおいて不可欠な概念であり、それらを理解すると、よりクリーンで保守しやすい JavaScript コードを作成するのに役立ちます。

こんにちは、アバイ?シン?カタヤットです!
私はフロントエンドとバックエンドの両方のテクノロジーの専門知識を持つフルスタック開発者です。私はさまざまなプログラミング言語やフレームワークを使用して、効率的でスケーラブルでユーザーフレンドリーなアプリケーションを構(gòu)築しています。
ビジネス用メールアドレス kaashshorts28@gmail.com までお気軽にご連絡(luò)ください。

以上がJavaScript のクラスと継承を理解するの詳細(xì)內(nèi)容です。詳細(xì)については、PHP 中國語 Web サイトの他の関連記事を參照してください。