JavaScript定義クラスの3つの方法

JavaScriptはオブジェクトベースの言語です.あなたが出会ったほとんどのものは対象です.しかし、オブジェクト(OPA)に向けた言語ではなく、文法にはclass(クラス)がないからです.
属性と方法を一つのオブジェクトにパッケージ化するなら、どうすればいいですか?

は、インスタンスオブジェクトの元のモード

を生成する.
もし人を対象としたら、名前と性別と年齢の三つの属性があります.

let  Person = {
              name : '',
              sex : '',
              age : ''
     }

実用化するには、このプロトタイプの規格に従って行う必要があります.

let personA = {};   //       
personA.name = "John";  //             
personA.sex = "male";
personA.age = "21";

let personB = {};  
personB.name = "Sara";  
personB.sex = "female";
personB.age = "12";

このように、最も簡単にパッケージ化され、Personの3つの基本的な属性を一つのオブジェクトにパッケージ化します.しかし、このように書くと短所がはっきりします.1.実例と原型の間に何の連絡があるか分かりません.2.例が多ければ、書くのが大変です.

オリジナルモードの改良

関数を使って反復性の問題を解決できます.

function Person(name, sex, age){
          return  {
              name : name,
              sex : sex,
              age : age
            }
         }

このようにインスタンスを生成すると、関数の呼び出しに相当する.

let personA = Person("John", "male", "21");
let personB = Person("Sara","female","12");

この方法は重複性の問題を解決したが、personaとpersonBの内部的な関連は依然としてなく、それらが同じ原型オブジェクトの例であることを反映できない.

コンストラクションモード

プロトタイプオブジェクトからインスタンスを生成する問題を解決するために、JavaScriptはアーキテクチャ関数のモードを提供する.
「構造関数」とは、一般的な関数ですが、内部にthis変数が採用されています.コンストラクタに対してnew演算子を使用すると、一例が生成され、this変数がインスタンスに結合される.

function Person(name, sex, age){
              this.name = name;
              this.sex = sex;
              this.age = age;
         }

コンストラクタが作成されました.new演算子によってインスタンスを生成できます.

let personA = new Person("John", "male", "21");
let personB = new Person("Sara","female","12");
console.log(personA.name);  //John
console.log(personB.age);   //12

このとき、personaとpersonBは、自動的に属性constructorを含み、それらの構造関数を指す.

console.log(personA.constructor === Person);  //true
console.log(personB.constructor === Person);  //true

Javascriptはまた、モデルオブジェクトとインスタンスオブジェクトとの関係を検証するinstanceof演算子を提供する.

console.log(personA instanceof Person);  //true
console.log(personB instanceof Person);  //true

構造関数の問題

コンストラクタは使いやすいですが、メモリを無駄にするという問題があります.以下の例を参照してください.Personオブジェクトに不変の属性type(種類)と方法live()(生活)を追加すると、原型オブジェクトは次のようになります.

function Person(name, sex, age){
              this.name = name;
              this.sex = sex;
              this.age = age;
              this.type = "   ";
              this.live = function (){
                                      console.log("     ");
                             }
                       }

同様に、上記の方法で例を生成します.

let personA = new Person("John", "male", "21");
let personB = new Person("Sara","female","12");
console.log(personA.type);  //   
personB.live();  //     

このように見えても大丈夫ですが、ここには一つの弊害があります.各新しい例において、属性typeと方法live()は同じ内容であり、各インスタンスを生成するたびに、この2つの重複したコンテンツを生成するので、メモリを多く占用する.これは環境にもやさしいし、効率にも欠ける.
解決方法を提出します.type属性とlive()方法をメモリの中で一回だけ生成して、そのメモリアドレスをすべて指してもいいですか?答えは大丈夫です.

Prottypeモード

JavaScriptは、各構造関数にはprototype属性があり、他のオブジェクトを指すと規定しています.このオブジェクトのすべての属性と方法は、構造関数の例によって継承されます.
これは、prototypeオブジェクト上にこれらの不変の属性および方法を直接定義することができることを意味する.以下のとおりです

function Person(name, sex, age){
              this.name = name;
              this.sex = sex;
              this.age = age;
       }
Person.prototype.type = "   ";
Person.prototype.live = function(){
                                      console.log("     ");
                                  };

この後に、例のtype属性およびlive()方法を生成するが、いずれも同じメモリアドレスであり、prototypeオブジェクトに向けて動作効率を向上させる.

Prottypeモードの検証方法

prototype属性に合わせるために、Javascriptはいくつかの補助的な方法を定義して、それを使うのを手伝ってくれます.

isProttypeOf()

The isPrototypeOf()method checks if abject exists in another object's prototype chain.

console.log(Person.prototype.isPrototypeOf(personA));  //true
console.log(Person.prototype.isPrototypeOf(personB));  //true

hasOwnProperty()

各インスタンスオブジェクトには、ある属性がローカル属性であるか、それともhasOwnProperty()オブジェクトから属性を継承するかを判断するためのprototype方法がある.

console.log(personA.hasOwnProperty("name"));  //true
console.log(personA.hasOwnProperty("type"));  //false

in演算子

in演算子は、ローカル属性でないにかかわらず、あるインスタンスに属性があるかどうかを判断するために使用されてもよい.

console.log("name" in personA);  //true
console.log("type" in personA);  //true
console.log("height" in personA);  //false

ソース:Javascriptオブジェクト向けプログラミング