連載
» 2015年07月16日 05時00分 公開

第12回 クラスの利用TypeScriptで学ぶJavaScript入門(3/6 ページ)

[羽山博,著]

クラスのメンバーとしてメソッドを定義する

 これまでのCatクラスでは「猫とは体長と体重のあるもの」という定義になっている。しかし、実際の猫は、鳴く、食べる、寝るといった行動を取る。そういった、クラスの働きはメソッドと呼ばれる。とはいえ、別に新しい書き方が必要とされるわけではなく、単に関数を書けば、それがメソッドとなる。

 では、Catクラスに「鳴く(meow)」メソッドと「食べる(eat)」メソッドを追加してみよう。

class Cat {
  length: number;
  weight: number;
  meow(): string// (1)
    return "にゃーん";
  }
  eat() {  // (2)
    this.length += 0.1;
    this.weight += 0.1;
  }
}

var myCat = new Cat();
myCat.length = 30.5;
myCat.weight = 2.5;
myCat.eat(); // (3)
alert("私の猫は" + myCat.meow() + "と鳴き、\n体長は" + myCat.length + "cm、体重は" + myCat.weight + "kgです");  // (4)
window.close();


 (1)がmeowメソッドの定義、(2)がeatメソッドの定義である。通常の関数の定義とほぼ同じだが、最初の「function」は書かなくていい。

 meowメソッドは単に「にゃーん」という文字列を返すだけだが、eatメソッドでは、体長(lengthプロパティ)と体重(weightプロパティ)を0.1ずつ増やしている。eatメソッドの中で個々のインスタンスが持つ変数(プロパティ)を使っているが、その場合には「this.」を変数名の前に付ける必要があることに注意しよう。

 (3)ではeatメソッドを呼び出しているので、ここで体長と体重が増える。(4)でmeowメソッドを呼び出して鳴き声を取得し、体長と体重とともに表示している。実行結果を見て確認してみよう。

図5 クラスにメソッドを追加し、実行してみる 図5 クラスにメソッドを追加し、実行してみる
猫が「にゃーん」と鳴き、「食べる」という動作をするので、体長と体重が増える。

メソッドのオーバーロード

 メソッドはオーバーロードできる。書き方は第11回の「関数に関するいくつかのトピック」で説明した通り。つまり、同じ名前で異なる引数を持つ関数を宣言し、いずれの場合にも対応できるように実装すればよい。ここでは、meowメソッドに引数を指定しなかった場合には「にゃーん」と鳴き、引数を指定した場合には、その引数を鳴き声とする。

class Cat {
  length: number;
  weight: number;
  meow(): string// (1)
  meow(s: string): string// (2)
  meow(s?: any): string// (3)
    if (typeof (s) == "string") {
      return s;
    } else {
      return "にゃーん";
    }
  }
  eat() {
    this.length += 0.1;
    this.weight += 0.1;
  }
}

var myCat = new Cat();
myCat.length = 30.5;
myCat.weight = 2.5;
myCat.eat();
alert("私の猫は" + myCat.meow("みゃお") + "と鳴き、\n体長は" + myCat.length + "cm、体重は" + myCat.weight + "kgです");  // (4)
window.close();


 (1)(2)は関数の宣言で、(3)がいずれの宣言にも対応した関数の実装である。(4)では、"みゃお"という実引数を指定してmeowメソッドを呼び出しているので、(2)の宣言に対応する関数と見なされる。実行例は以下の通り。

図6 meowメソッドをオーバーロードしたプログラムの実行結果 図6 meowメソッドをオーバーロードしたプログラムの実行結果
引数を指定してmeowメソッドを呼び出した場合の結果。

Copyright© Digital Advantage Corp. All Rights Reserved.

RSSについて

アイティメディアIDについて

メールマガジン登録

@ITのメールマガジンは、 もちろん、すべて無料です。ぜひメールマガジンをご購読ください。