オブジェクトは、最も単純な整数から複雑な航空機など、具体的なものだけでなく、抽象的なルール、計画、イベントを表すことができるものまで、人々が勉強したいものです。 - バイドゥ百科事典から引用
オブジェクト指向プログラミングは、現在最も人気のあるプログラミングモデルです。しかし、最も広く使用されているフロントエンドJavaScriptとして、オブジェクト指向をサポートしていないことはイライラします。
JavaScriptにはアクセス制御文字がなく、キーワードクラスを定義せず、継承された拡張またはコロンをサポートせず、仮想関数をサポートするために仮想を使用しません。ただし、JavaScriptは柔軟な言語です。キーワードクラスなしでJavaScriptがクラスの定義を実装し、オブジェクトを作成する方法を見てみましょう。
クラスを定義し、クラスのインスタンスオブジェクトを作成します
JavaScriptでは、次のようにクラスを定義するために関数を使用します。
コードコピーは次のとおりです。
function shape（）
{
var x = 1;
var y = 2;
}
あなたは言うかもしれません、疑う？これは決定的な機能ではありませんか？そうです、これは決定的な機能です。形状関数を定義し、xとyを初期化します。ただし、別の観点から見ると、これは2つのプロパティxとyを含む形状クラスを定義することであり、初期値はそれぞれ1と2です。ただし、クラスを定義するキーワードは、クラスではなく関数です。
次に、次のように、シェイプクラスのオブジェクトアシェープを作成できます。
コードコピーは次のとおりです。
var ashape = new Shape（）;
公共および私有地を定義します
Ashapeオブジェクトを作成しましたが、そのプロパティにアクセスしようとすると、次のようなエラーが表示されます。
コードコピーは次のとおりです。
ashape.x = 1;
これは、VARで定義されたプロパティがプライベートであることを示しています。このキーワードを使用して、パブリック属性を定義する必要があります。
コードコピーは次のとおりです。
function shape（）
{
this.x = 1;
this.y = 2;
}
このようにして、次のような形状プロパティにアクセスできます。
コードコピーは次のとおりです。
ashape.x = 2;
OK、上記のコードから要約することができます。VARを使用してクラスのプライベート属性を定義し、これを使用してクラスの公開属性を定義します。
パブリックおよびプライベートの方法を定義します
JavaScriptでは、関数は関数クラスのインスタンスであり、関数はオブジェクトから間接的に継承されているため、関数もオブジェクトです。したがって、割り当て方法を使用して関数を作成できます。もちろん、クラスの属性変数に関数を割り当てることもできます。次に、この属性変数は、実行可能機能であるため、メソッドと呼ぶことができます。コードは次のとおりです。
コードコピーは次のとおりです。
function shape（）
{
var x = 0;
var y = 1;
this.draw = function（）
{
//印刷;
};
}
上記のコードの描画を定義し、関数を割り当てます。以下では、次のようなashapeを介してこの関数を呼び出すことができます。
コードコピーは次のとおりです。
ashape.draw（）;
VARで定義されている場合、ドローはプライベートになります。これは、次のようなoopのプライベートメソッドと呼ばれます。
コードコピーは次のとおりです。
function shape（）
{
var x = 0;
var y = 1;
var draw = function（）
{
//印刷;
};
}
これにより、ashape.drawを使用してこの関数を呼び出すことはできません。
コンストラクタ
JavaScriptはOOPをサポートしていないため、もちろんコンストラクターはありません。ただし、コンストラクターを自分でシミュレートし、オブジェクトが作成されたときに自動的に呼び出されるようにすることができます。コードは次のとおりです。
コードコピーは次のとおりです。
function shape（）
{
var init = function（）
{
//コンストラクターコード
};
init（）;
}
形状の終わりに、私たちは人工的にinit関数と呼ばれました。次に、形状オブジェクトを作成するときに、initは常に自動的に呼ばれ、コンストラクターをシミュレートできます。
パラメーターを備えたコンストラクター
コンストラクターにパラメーターを取得する方法は？実際、それは非常に簡単です。次のような関数パラメーターリストに渡されるパラメーターを記述するだけです。
コードコピーは次のとおりです。
関数形状（ax、ay）
{
var x = 0;
var y = 0;
var init = function（）
{
//コンストラクタ
x = ax;
y = ay;
};
init（）;
}
これにより、次のようなオブジェクトを作成できます。
コードコピーは次のとおりです。
var ashape = new Shape（0,1）;
静的特性と静的方法
JavaScriptで静的特性とメソッドを定義する方法は？以下に示すように：
コードコピーは次のとおりです。
関数形状（ax、ay）
{
var x = 0;
var y = 0;
var init = function（）
{
//コンストラクタ
x = ax;
y = ay;
};
init（）;
}
shape.count = 0; //オブジェクトではなくクラスに属する静的プロパティカウントを定義します。
shape.staticMethod = function（）{}; //静的メソッドを定義します
静的プロパティとメソッドを使用すると、次のようにクラス名でアクセスできます。
コードコピーは次のとおりです。
アラート（ashape.count）;
ashape.staticmethod（）;
注：静的プロパティとメソッドはどちらも公開されています。これまでのところ、静的プロパティと方法をプライベートにする方法がわかりません〜
メソッドでこのクラスの公共および私有地にアクセスする
クラスメソッドで独自のプロパティにアクセスします。 JavaScriptの公的および私有地のためのアクセス方法は異なります。次のコードをご覧ください。
コードコピーは次のとおりです。
関数形状（ax、ay）
{
var x = 0;
var y = 0;
this.gx = 0;
this.gy = 0;
var init = function（）
{
x = ax; //プライベート属性を追加し、変数名を直接書き込みます
y = ay;
this.gx = ax; // public属性にアクセスするには、変数名の前にこれを追加する必要があります。
this.gy = ay;
};
init（）;
}
これについて注意すべきこと
私の経験によると、クラスでのこれは、常に私たちのオブジェクト自体を指しているわけではありません。主な理由は、JavaScriptがOOP言語ではなく、関数とクラスは関数によって定義されていることです。これはもちろん、いくつかの小さな問題を引き起こすでしょう。
このポインターが誤って指摘する状況は、一般にイベント処理にあります。特定のオブジェクトのメンバー関数がイベントに応答してほしい。イベントがトリガーされると、システムはメンバー関数を呼び出します。ただし、このポインターに合格したのは、もはや私たち自身のオブジェクトではありません。もちろん、この時点でメンバー関数でこれを呼び出すのはエラーになります。
解決策は、定義クラスの開始時にこれを私有財産に保存することです。後で、これではなくこのプロパティを使用できます。この方法でこのポインターを使用しています。
この問題を解決するためにコードを変更しましょう。パート6のコードを比較することで、あなたは間違いなく理解するでしょう：
コードコピーは次のとおりです。
関数形状（ax、ay）
{
var _this = this; //これを保存して、これを将来的には代わりに使用して、これに混乱しないようにします
var x = 0;
var y = 0;
_this.gx = 0;
_this.gy = 0;
var init = function（）
{
x = ax; //プライベート属性を追加し、変数名を直接書き込みます
y = ay;
_this.gx = ax; // public属性にアクセスするには、変数名の前にこれを追加する必要があります。
_this.gy = ay;
};
init（）;
}
上記では、JavaScriptでクラスを定義し、クラスオブジェクトを作成し、パブリックおよびプライベートプロパティとメソッドを作成し、静的プロパティとメソッドを作成し、コンストラクターをシミュレートし、このエラーが発生しやすいことを議論する方法について説明しました。
これは、JavaScriptのOOP実装に関するものです。上記は最も実用的なコンテンツです。一般に、JavaScriptはクラスを定義し、上記のコードを使用してオブジェクトを作成するだけで十分です。もちろん、MootoolsまたはPrototypeを使用してクラスを定義し、オブジェクトを作成することもできます。私はMootoolsフレームワークを使用しましたが、とても気持ちがいいです。 JavaScriptクラスシミュレーションに最適で、クラスの継承をサポートします。興味のある読者はそれを試すことができます。もちろん、フレームワークを使用する場合は、Webページに関連するJSヘッダーファイルを含める必要があります。したがって、読者がフレームワークなしでクラスを作成できることを願っています。このようにして、コードはより効率的であり、シンプルなクラスを作成するのは面倒ではないこともわかります〜