メソッドを持つオブジェクト

導入

オブジェクトの値には関数も入れられます。オブジェクトに紐づいた関数をメソッドと呼び、this で自分自身のプロパティにアクセスします。

説明

const counter = {
  value: 0,
  inc() {
    this.value += 1;
    return this.value;
  },
  reset() {
    this.value = 0;
  },
};

console.log(counter.inc());  // 1
console.log(counter.inc());  // 2
counter.reset();
console.log(counter.value);  // 0

メソッド記法 inc() { ... } は inc: function () { ... } の短縮形です。this はそのオブジェクト自身を指します。

const user = {
  name: "太郎",
  greet() {
    return `こんにちは、${this.name}さん`;
  },
};
console.log(user.greet());

やってみよう

counter に dec（1減らす）メソッドを足したり、user の名前を変えたりしてみましょう。

演習

const dog = { name: "ポチ", bark() { return this.name + ": ワン！"; } }; を用意し、bark() の結果を表示してください。