JavaScriptは,きちんとしたオブジェクト指向言語であって,オブジェクトを利用した高度な開発が可能です。JavaやC++,.NET系のオブジェクト指向言語がオブジェクトの定義にクラスという概念を用いる「クラス・ベース」の考え方を採用しているのに対し,JavaScriptではひな型となるオブジェクトを元に独自の機能を付加するという「プロトタイプ・ベース」の考え方を採用している点が特徴です。

 まず最初に,皆さんの誤解を解いておきましょう。それはJavaScriptは,きちんとしたオブジェクト指向言語だということです。オブジェクト指向言語と言えば,JavaやC++などが有名ですし,C#やVisual Basic 2005といった米Microsoftが開発した.NET系の言語もあります。しかしこれらの言語に比べてJavaScriptは,一段低い「Webブラウザで利用する簡易言語」といったイメージを持っている方が多いのではないでしょうか。いいえ。とんでもありません。実際には,これらの言語と同様に,JavaScriptはオブジェクトを利用した高度な開発が可能なのです。

 ただし,JavaやC++のようなオブジェクト指向言語とJavaScriptとでは,“オブジェクト指向の仕組み”に大きな違いがあります。Java,C++,.NET系の言語が「クラス・ベース」のオブジェクト指向を採用しているのに対し,JavaScriptは「プロトタイプ・ベース」のオブジェクト指向を採用しているのです。両者の違いは後で詳しく述べますが,ここではまず,「オブジェクト指向とはいっても,JavaやC++とは仕組みがやや異なる」ということを覚えておいてください。

ポイント1
オブジェクトの生成にはnew演算子を使う

 では,JavaScriptでの基本的なオブジェクトの利用方法を見ていきましょう。

 JavaScriptにはいくつかのオブジェクトが組み込みオブジェクトとしてあらかじめ用意されており,特に宣言することなくこれらを利用できます。組み込みオブジェクトから新しいインスタンスを作成するには,new演算子を利用します。

 例えば日付を扱うDateオブジェクトのインスタンスは,以下のコードで生成できます。

now = new Date();

 nowには生成されたインスタンス・オブジェクトの参照が格納されます。引数を指定していないため,このオブジェクトは生成された時間を示すことになります。

 作成したオブジェクトでは,Dateオブジェクトで定義されているメソッドが利用できます。例えば「getFullYear」は4桁で年を取得するメソッドで,2006年なら2006という値を取得できます。メソッドは,次のようにオブジェクトを格納した変数とピリオドでつないで表現します。

y = now.getFullYear();

 また,オブジェクトのプロパティにも同様にピリオドでつないでアクセスできます。<a name="quiz03"></a>例えば,配列の機能を提供するArrayオブジェクトには,配列の要素数を示すlengthプロパティが用意されており,要素数を調べたりセットしたりできます。pushは配列に要素を追加するメソッドです。以下のコードでは変数vに21が格納されます。

a = new Array();
a.length = 20;
a.push('ABC');
v = a.length;

 ここまでがJavaScriptでオブジェクト指向を利用するための基礎の部分です。JavaやC++などのクラス指向のオブジェクト指向言語とそれほど大きな違いはありませんね。これらの言語を利用したことがある人なら,それほど違和感なく理解できるでしょう。JavaScriptには言語仕様としてのクラスは存在しないのでクラスという言葉は使っていませんが,ここで紹介したDateやArrayは,C++やJavaなどのクラス指向のオブジェクト指向言語におけるクラスと同じように用いられていることがわかると思います。

ポイント2
関数がオブジェクトのコンストラクタになる

 次に,独自のコンストラクタ(オブジェクトを生成する関数)を作成し,そこからオブジェクトを生成する方法を見ていきます。この作業は,クラス指向のオブジェクト指向言語における「クラスの定義」に相当する作業になります。コンストラクタといっても,JavaやC++のようなクラス・ベースの既存の知識にあまりとらわれないで,「こういうものなんだ」と思って読み進めてください。

 まずはサンプル・コードを見てみましょう(リスト1)。このコードのように,JavaScriptのプログラムを実行するには,HTMLファイルの中に<script>タグを使って記述します。

リスト1●コンストラクタとメソッドを定義し,新しいインスタンスを生成するJavaScriptのプログラム。HTMLファイルの中で〈script〉タグの間に記述する。このファイルをWebブラウザで開けば,プログラムが実行される
リスト1●コンストラクタとメソッドを定義し,新しいインスタンスを生成するJavaScriptのプログラム。HTMLファイルの中で〈script〉タグの間に記述する。このファイルをWebブラウザで開けば,プログラムが実行される

 このサンプルでは,「Dogという独自のオブジェクトを作成するためのコンストラクタの定義」「メソッドの定義」「pochiという新しいインスタンスの作成」の三つを行っています。

 先頭にあるDogという関数(function)が,Dogオブジェクトを生成するためのコンストラクタです。一見,JavaScriptの単なる関数と全く同じに見えます。その通り,これは関数にほかなりません。JavaScriptの関数は実際にはオブジェクトとして扱われます。まず理解してほしいのは「Dogという名前の関数を定義すると,それがDogというオブジェクトのコンストラクタになる」ということです。

この先は会員の登録が必要です。有料会員(月額プラン)は登録月無料!

日経 xTECHには有料記事(有料会員向けまたは定期購読者向け)、無料記事(登録会員向け)、フリー記事(誰でも閲覧可能)があります。有料記事でも、登録会員向け配信期間は登録会員への登録が必要な場合があります。有料会員と登録会員に関するFAQはこちら