同じ形をまとめて作る(クラス)

INPUT · スライド

メソッドから別のメソッドを呼ぶ

01 / 04

同じ処理が2か所に出てきたら

「名前を見出しっぽく表示する」処理が、あちこちのメソッドに出てくるとしよう。

同じことを2回書いたら、直すときも2か所。だったら1つのメソッドにまとめて、そこを呼ぶほうがいいよね。

02 / 04

this.メソッド名() で呼ぶ

メソッドの中から自分の別のメソッドを呼ぶときも this を使う。this.sign(); のように書くよ。

プロパティを読むときと形は同じ。うしろに ( ) がつくかどうかの違いだけだね。

class Robot {  constructor(name) {    this.name = name;  }  sign() {    console.log(`--- ${this.name} ---`);  }  report() {    this.sign();    console.log("いじょうなし");  }}const r = new Robot("がしゃん");r.report();

実行結果

--- がしゃん ---
いじょうなし

03 / 04

戻り値を受け取る形もある

呼んだメソッドが return で値を返すなら、その値をそのまま使えるよ。

「計算するメソッド」と「見せるメソッド」に分けておくと、計算を直したいときも見せ方を直したいときも、迷わず1か所だけ触れるようになる。

class Shop {  constructor(price, count) {    this.price = price;    this.count = count;  }  subtotal() {    return this.price * this.count;  }  show() {    console.log(`ごうけい${this.subtotal()}円`);  }}const s = new Shop(120, 4);s.show();

実行結果

ごうけい480円

04 / 04

小さく分けて組み立てる

1つのメソッドに全部詰め込むより、小さなメソッドをいくつか作って組み合わせるほうが読みやすいよ。

名前を見れば何をするか分かるくらい小さく分けるのがコツ。ここから書いてみよう。