JavaScriptでオブジェクト指向しよう1・構造体


     JavaScriptはオブジェクト指向言語です。ということで皆さんこんにちは。えあです。
     取り合えず今回のテーマはそのオブジェクト指向についてなんですが、いきなりこれじゃさっぱり意味不明なので、もうちょっと文明的に噛み砕いていきましょう。

     ある日、オンライン作家のAさんは、自小説のキャラクターのデータ表を作りたいと思いたちました。表に入れたいデータは「名前」「年齢」。Aさんは、まずはそれぞれをnameageという二つの変数に入れて管理しようと考えました。
     しかしこれだと、いちいち

        name[0]="ウィル";
        age[0]=18;
        name[1]="ソフィア";
        age[1]=16;
          :
          :

     というような感じで入力していくような状態になり、これじゃあ何だかちょっとやりにくいなぁと思いました。できたら、一人分の名前と年齢で一セットにしてデータを管理できないものだろうか?
     そんなニーズにお答えするしくみが、「オブジェクト指向言語」では作れます。JavaScriptも、C++やJavaと言ったような生っ粋のオブジェクト指向言語に比べたら貧弱ではありますが、そのようなしくみを作る事ができます。
     データの一まとまり「chara」を作成し、その中に「name」、「age」を持たせる事ができるのです。
     具体的には、このデータはこんな風に管理する事ができるようになります。

        no[0]=new chara("ウィル", 18);
        no[1]=new chara("ソフィア", 16);
              :
              :

     このデータの一まとまり、「chara」を、オブジェクト指向プログラミングの世界では「クラス」と呼びます。そして、name、ageといったその中身を、「プロパティ」と言ったり地方によっては「メンバ変数」と言ったりします。JavaScriptでは「プロパティ」がどうやら正しい呼び名のようなので、こちらで呼ぶことにしましょう。
     さて、上で、charaクラスに(正しくはcharaクラスの「オブジェクト」no[0]、no[1]…に)データをいれました。これをそれぞれ読み出すときにはこうします。

        no[0].name;
        no[1].age;

     上でつけてあげた固有の名前、「オブジェクト」と、「プロパティ」を使って自由に読み出す事が出来ます。この場合、もちろんno[0].nameの値は「ウィル」になり、no[1].ageは「ソフィア」の年齢である「16」になります。
     とりあえず長々と説明するのもなんですので、実際のプログラムを見てみましょう。

    
    <SCRIPT LANGUAGE="JavaScript">
    <!--
    function main(){
    	no=new Array();		//オブジェクトを入れる配列
    	cnt=0;			//カウンタ
    
    	no[0]=new chara("Will", 18);	//ウィル 18歳
    	no[1]=new chara("Sophia", 16);	//ソフィア 16歳
    	no[2]=new chara("Dilt", 19);	//ディルト様 19歳
    	no[3]=new chara("Cailtag", 23);	//カイル 23歳
    	no[4]=new chara("Lute", 23);	//リュート 23歳
    
    	for(cnt in no){		//配列noいっぱいまでループ
    		document.write(no[cnt].name +" ");	//名前を表示
    		document.write(no[cnt].age +"<BR>");	//年齢を表示
    	}
    }
    
    ////////// charaクラス /////////////////////////////////////
    function chara(name, age){ 	//コンストラクタ(もどき)
    	this.name=name;		//名前
    	this.age=age;		//年齢
    }
    
    //-->
    </SCRIPT>
    

     赤字の部分で、charaクラスの中にnameageというプロパティを作りますよ、という仕組みを作っておきます。そして実際のデータを入れているのがちょっと上に戻った青字の部分です。
     ↓こいつを走らせると、登録されたデータが表示されます。

     charaクラスが出来ました。でも、あれ? おかしな事に、今回のタイトルに、見慣れない「構造体」なんて名前がついていたりしますね。そんな言葉、まだ一言も出ていないというのに。
     実は、構造体というのはクラスの機能が少ない版?というようなものなのです。今のこのcharaクラスは、まだクラスというより構造体と言うべきものなのです。
     構造体とは、中身にプロパティしか入っていないクラスのことです。
     次回はこのcharaクラスにプロパティ以外のモノを付け加え、本当のクラスにしてあげたいと思います。


【INDEX】 【2・クラス】