JavaScript オブジェクト指向プログラミング (1) 基本_js オブジェクト指向

1. JavaScript を使用してクラスを実装します
JavaScript には、クラスを実装するための特別なメカニズムはありません。ここで、クラスは、その関数のネストを可能にするメカニズムを利用して実装されます。このように、関数には変数と他の関数を含めることができ、変数を属性として使用したり、内部関数をメンバー メソッドとして使用したりできます。したがって、外部関数自体をクラスとして使用できます。次のように:

コードをコピー コードは次のとおりです:

function myClass()
{
//これはコンストラクター
と同等です}

ここで myClass はクラスです。実際、これをクラスのコンストラクターと考えることができます。非コンストラクタ部分については、後で詳しく説明する。
2. クラスのインスタンスを取得する方法
クラスを実装した後、JavaScript にはオブジェクトのインスタンスを取得するメソッドが用意されています。それが新しいオペレーターです。実際、JavaScript では、クラスと関数は同じ概念であり、関数を操作するために new が使用されると、オブジェクトが返されます。
var obj1 = new myClass();
3. オブジェクトのメンバーへの参照
JavaScript でクラスの属性またはメソッドを参照するには 3 つの方法があります。
1> ドット演算子
これは最も一般的な引用方法であり、面倒ではありません。つまり、次の形式になります:
オブジェクト名.プロパティ名;
2>JavaScript では、オブジェクトのメンバーを参照するために角括弧を使用できます。 。以下のようになります:
オブジェクト名 ["プロパティ名"];
オブジェクト名 ["メソッド名"];
ここでの角括弧はプロパティ名またはメソッド名を表す文字列であり、必ずしも文字列定数である必要はありません。変数も使用できます。これにより、変数を使用してプロパティ名またはメソッド名を渡すことができます。プログラミングに利便性をもたらします。このアプローチは、コードでどのプロパティまたはメソッドを呼び出すかが不明な場合に使用できます。それ以外の場合、ドット演算子を使用する場合は、条件判断を使用してプロパティまたはメソッドを呼び出す必要もあります。
さらに、角括弧を使用して引用されたプロパティ名とメソッド名は数字またはスペースで始めることもできますが、ドットを使用して引用されたプロパティ名とメソッド名は識別子の規則に従います。ただし、識別子以外の命名方法の使用は一般に推奨されません。
3> eval 関数を使用する
変数名やメソッド名を渡すのに変数を使用したくない場合や、条件判定を使用したくない場合は、eval 関数が適しています。 eval は文字列型パラメータを受け取り、この文字列をコンテキスト内のコードとして実行し、実行結果を返します。ここでは eval という関数を使用します。以下のように:
alert(eval("Object name." element.value));

4. オブジェクトの属性とメソッドを追加、変更、削除する
生成後オブジェクトのプロパティやメソッドを動的に追加、変更、削除することもできます。これは他のオブジェクト指向言語とは異なります。 1> プロパティとメソッドを追加します
最初にオブジェクトを作成します。作成された空のオブジェクトにはプロパティとメソッドがありませんが、コードで作成できます。

コードをコピーします コードは次のとおりです。

var obj1 = new Object(); 🎜>/ /属性を追加

obj1.ID = 1;
obj1.Name = "johnson"
//メソッドを追加
obj1.showMessage = function()
; alert(" ID: " this.ID ", Name: " this.Name);


2> 属性とメソッドの変更は、次の場合と同様です。たとえば、上記の例に従います:

コードをコピー

コードは次のとおりです: //属性の変更 obj1.ID = 2; obj1.Name = "Amanda" // 変更メソッド

obj1.showMessage = function()

{
alert("ID : " this.ID");
}


3> 属性とメソッドを削除します
削除する属性またはメソッドを未定義に割り当てます:

コードをコピー

コードは次のとおりです。 >obj1.showMessage = unknown; 5. 型なしオブジェクトの作成 C# 3.0 の匿名型と同様に、JavaScript は次の形式で型なしオブジェクトを作成することもできます。 🎜>

<.>

コードをコピーします


コードは次のとおりです。

var obj1 = {}; var obj2 = {
ID: 1,
Name: "Johnson",

showMessage: function() { alert("ID: " this.ID "Name: " this.Name); } }
ここでは、obj1 と obj2 という 2 つの型なしオブジェクトが定義されています。ここで、obj1 は空のオブジェクトです。 obj2 には、2 つの属性 ID、Name、およびメソッド showMessage が含まれています。各プロパティとメソッドはカンマで区切ります。属性 (メソッド) 名とその値はセミコロンで区切ります。
この方法で属性メソッドを作成する場合、文字列を使用して属性メソッドの名前を定義することもできます。例:

コードをコピー コードは次のとおりです:

var obj2 =
{
"ID" : 1,
"Name": "Johnson"
}

6. プロトタイプ
各関数オブジェクトには子オブジェクト Prototype。関数はクラスを表すこともできるため、プロトタイプはクラスのメンバーのコレクションを表します。オブジェクトが新規作成されると、プロトタイプ オブジェクトのメンバーがオブジェクトのメンバーにインスタンス化されます。まず例を見てみましょう:

コードをコピーします コードは次のとおりです:

関数myClass()
{ }
myClass.prototype.ID = 1;
myClass.prototype.Name = "johnson";
myClass.prototype.showMessage = function()
{
alert("ID: " this.ID "Name: " this.Name);
var obj1 = new myClass();


プロトタイプオブジェクトを使用して作成されたクラスには利点があります。すべてのメンバーがクラス宣言に直接記述されている場合は、次のようになります。

コードをコピー コードは次のようになります。

function myClass()

{
//属性を追加
this.ID = 1;
this.Name = "johnson">//メソッドを追加
this.showMessage = function()
{
alert("ID: " this.ID ", Name: " this.Name)
}
}
var obj1 = new myClass( );
var obj2 = new myClass();


上記のコードでは、クラス myClass が定義されており、クラス内に 2 つのプロパティとメソッドが直接定義されています。次に、myClass オブジェクトが作成されるたびに 2 つのオブジェクトがインスタンス化され、2 つのプロパティと 1 つのメソッドが作成され、メモリ領域が無駄になります。この問題は、プロトタイプを使用することで解決できます。関数が新しくなるたびに、そのプロトタイプ オブジェクトのメンバーがこのオブジェクトに自動的に割り当てられ、複数のオブジェクトが繰り返し作成されることはありません。
プロトタイプの初期化は関数本体が実行される前に行われるため、次のコードで証明できます:

コードをコピーコードは次のとおりです。 function myClass()

{

//これはコンストラクター関数
this.ID = 1;
this.Name1 と同等です。 = this.Name;
this.showMessage();
myClass.prototype.Name = "ジョンソン";
myClass.prototype.showMessage = function()
alert("ID: " this.ID ", Name: " this.Name);
var obj1 = new myClass()


上記のコードを実行すると、 new タイプのオブジェクトが使用されると、ダイアログ ボックスがポップアップ表示されます。
最後に言及しなければならないことは、プロトタイプにはオブジェクト指向設計で使用できるメソッドがあるということです。つまり、コンストラクター属性はコンストラクターの呼び出しです。ここでのコンストラクターは、前述のクラスの宣言内のコードです。例:

コードをコピー

コードは次のとおりです: function myClass() { //これはコンストラクター関数 alert("this is in construction");

myClass.prototype.constructor(); と同等です。 ();

上記のコードを実行すると、ダイアログ ボックスが 2 回表示されることがわかります。プロトタイプは、クラスのメンバーを設計するために特に使用できることがわかります。実際、プロトタイプは JavaScript のオブジェクト指向設計でよく使用されます。