オブジェクト指向プログラミング

OOPは、クラスとオブジェクトを通してコードを再利用可能な部分にソフトウェアを整理するのに用いられるプログラミングパラダイムです.クラスをコードのテンプレートまたはビルディングブロックとして考えることができます.これは、必要なものを作成するために拡張できる特定のオブジェクトに共通のメソッドとプロパティが含まれます.
以下に例を示します.

class Developer {
    constructor(name, language) {
        this.name = name;
        this.language = language;
    }

    getDeveloperProfile(){
        return `${this.name} can code in ${this.language}`
    }
}

class FrontendDev extends Developer {
  constructor(name, language, framework) {
    super(name, language); 
        this.framework = framework;
  }

  getFramework() {
    console.log(`${this.name} is a ${this.language} developer and knows ${this.framework}.`);
  }
}

let frontendDeveloper = new FrontendDev('Anna', 'Javascript', 'React');
frontendDeveloper.getFramework(); // Anna is a javascript developer and knows React

OHPでコーディングする際の基本的な原理があります.

カプセル化

カプセル化について話すとき、我々はオブジェクトで関連している機能と変数をグループ化することを参照します.
いくつかのコードをOHPにリストアしましょう.
出発点はこちら

const bookName = 'Steppenwolf'
const bookAuthor = 'Herman Hesse'
const bookYear = 1927

function getBookInfo(name, author, year) {
    return `The book ${name} was written by ${author} in ${year}`
}

getBookInfo(bookName, bookAuthor, bookYear);

OOPウェイ:

const book = {
    name: 'Steppenwolf',
    author: 'Herman Hesse',
    year: 1927,
    getInfo: function() {
        return `The book ${name} was written by ${author} in ${year}`
    }
}

book.getInfo();

抽象化

OOPの抽象化について話をするとき、我々は実際に使用していて、内部の働く隠れているままにしているプロパティとメソッドを公開することを参照します.これは、オブジェクトの使用をはるかに簡単にし、変更を容易にすることができます.
例えば、

class Developer {
    constructor(name, language) {
        this.name = name;
        this.language = language;
    }

    #ratePerHour = 30 // private variable
    #totalMonthlyHours = 160 // private variable

    getDeveloperProfile(){
        const salary = this.#ratePerHour * this.#totalHours;
        return `${this.name} can code in ${this.language}`
    }

    getDeveloperSalary() {
        const totalSalary = this.#ratePerHour * this.#totalMonthlyHours;
        return `The salary for a developer is ${totalSalary}usd per month`
    }
}

この場合、私たちはクラスの外でtotalhoursとrateperhour変数にアクセスすることができません、しかし、我々がgetDeveloperSalary()を呼ぶならば、我々は合計量を計算されます.

遺産

継承は、オブジェクト間の繰り返しのコードと共有プロパティとメソッドを削除できるようにするものです.
例えば、ボタンとdivはHTML要素(HTMLElement)であり、両方ともhiddenプロパティとclick ()メソッドを持ちます.
prototype inheritanceについて話すとき、我々はメソッドと特性を加えることができるJavaScript機能を参照しています、そして、それは同様にチェインされることができます(プロトタイプはプロトタイプを持つことができます.

多型

多形は、前のオブジェクトからメソッドとプロパティを上書きすることを可能にします.たとえば、すべての植物が100を必要とする第二のことを想像しましょう

const book = function () {}

book.prototype.amountOfPages = function() {
   return "a book has many pages"
}

const novel = function() {}
novel.prototype = Object.create(book.prototype);
novel.prototype.amountOfPages = function() {                 
   return "a book has many more pages!"
}

参考文献
https://www.educative.io/blog/object-oriented-programming
https://frontend.turing.edu/lessons/module-2/oop-1-making-objects-with-constructor-functions-and-classes.html
https://blog.sessionstack.com/how-javascript-works-3-types-of-polymorphism-f10ff4992be1
https://betterprogramming.pub/object-oriented-programming-in-javascript-b3bda28d3e81