JavaScript オブジェクトの作り方と使い方
出典: フリー教科書『ウィキブックス（Wikibooks）』
目次 |
[編集] イントロダクション
ここまでの項は、今までにC++やJavaなどの言語を触ったことがある人には、比較的なじみやすいモノであったと思う。ここからは、JavaScriptにおけるオブジェクト指向的な部分を解説していくことになるが、導入編でも書いた様に、JavaScriptにおけるオブジェクト指向は「プロトタイプベース・オブジェクト指向」と言われるもので、他多くの言語で作られている「クラスベースオブジェクト指向」とは異なったパラダイムで作られている。
これは、他の言語に比べて、柔軟であることがその利点だが、厳密ではないところが逆に欠点である。ただ、ブラックボックス化や、再利用生の確保等のオブジェクト指向の利点は良く残しており、数万行規模のプログラムでない限り、大きな問題が出ない様になっている。
実際のプロトタイプオブジェクト指向に関しては、これからのコードを見ながら実践してもらう。
[編集] オブジェクトの構築
実際にオブジェクト指向プログラミングを行うには、オブジェクトを造りだし、これにデータとメソッドを継ぎ足していくことで行われる。 しかし、これはJavaScriptの内部的な実装部分と深く関わっているので、まずは一般的な解答としてのオブジェクト指向的なプログラミングを例として示しておくことにする。
オブジェクトを作成するには、この言語の場合は関数オブジェクトを利用する。
function Point(){
this.x = 50;
this.y = 50;
return this;
}
var p = new Point(); // これでオブジェクトを作成
document.write( p.x ); // これでデータを取り出し
上のコードの様に、「this」に続いて変数名をあてることで、オブジェクトのプロパティを定義する事が出来る。ここで出てくる、「this」とは、この関数オブジェクトそのものを指すのだが、詳しい解説は後の項にあてる。
[編集] メソッドの追加
オブジェクト、プロパティ（詳細）の定義の方法の次はメソッド（方法）の定義方である。
Point.prototype.move = function( x,y ){
this.x += x;
this.y += y;
}
上のコードの様にメソッド名を定義した後に、関数を代入する。
ちなみに、このコードの様に関数名を定義していない様な関数を「無名関数」という。別に特別なものではなく、ただ名前の部分を省略しても関数として成り立つということなので、深く考えてはいけない。
[編集] 呼び出し方
これでオブジェクトの作り方は学んだ、メソッドの呼び出し方はプロパティと同じである。
var p = new Point(); document.write( p.x ); Point.move( 10, 10 ); document.write( p.x );
[編集] コンストラクタ（構築子）
初期値をあらかじめ設定しておきたいとき等は、次のようにする。
function Point( x, y ){
this.x = x;
this.y = y;
return this;
}
var p = new Point( 50, 50 );
このようにすると、初期条件に従って作成することが出来る。
[編集] 一般的なJavaScriptでのオブジェクト指向プログラミング
ここまでの内容を利用して、JavaScriptでオブジェクト指向のプログラミングを行う場合には、書式は次の通りになる。
/* まずオブジェクトを作成する */
function Point( x, y ){
this.x = x;
this.y = y;
return this;
}
/* メソッドを追加 */
Point.prototype.move = function( x,y ){
this.x += x;
this.y += y;
}
var p = new Point( 50, 50 );
Point.move( 10, 10 );
document.write( p.x ); // 「50+10」で「60」が表示される。
[編集] delete演算子
JavaScriptでは、オブジェクトに追加したプロパティの削除が可能である。 そのために用意されているのがdelete演算子である。
delete Point.prototype.move
delete演算子はオブジェクト中のデータの削除は行えるが、グローバル変数そのものを削除することは出来ない様になっている。 この様な場合には、変数にundefinedを代入して、データを破棄したように見せるしかない。 (というより出来るだけグローバルは変数は作らないのが基本的には良い方法)
