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

INPUT · スライド

メソッドから自分の中身を見る

01 / 04

メソッドの中の this

コンストラクタで出てきた this は、メソッドの中でも使えるよ。

メソッドの中の this は、そのメソッドを呼び出した実体のこと。r.greet() と書いたなら thisr だよ。

02 / 04

自分のプロパティを読む

this.name と書けば、その実体が持っている name を読める。

名前を引数で渡してもらう必要はもう無い。自分のことは自分が知っているからだね。

class Robot {  constructor(name) {    this.name = name;  }  greet() {    console.log(`${this.name}です`);  }}const r = new Robot("がしゃん");r.greet();

実行結果

がしゃんです

03 / 04

呼んだ相手で結果が変わる

同じ greet() を呼んでいるのに、出てくる言葉が違う。this が指す相手が違うからだよ。

これが「振る舞いを設計図に1つ書けば、実物ごとに違う結果になる」という仕組みだよ。

class Robot {  constructor(name) {    this.name = name;  }  greet() {    console.log(`${this.name}です`);  }}const a = new Robot("がしゃん");const b = new Robot("ぴこ");a.greet();b.greet();

実行結果

がしゃんです
ぴこです

04 / 04

書き換えもできる

this.プロパティ は読むだけでなく、書き換えにも使えるよ。

これでインスタンスは、自分で自分の状態を変えられるようになった。ここから書いてみよう。

class Counter {  constructor() {    this.count = 0;  }  add() {    this.count += 1;  }}const c = new Counter();c.add();c.add();console.log(c.count);

実行結果

2