【JavaScript入門】メソッド：getter、setter

　JavaScript のオブジェクトでは、通常のプロパティに加えて「プロパティに関数を割り当てたもの」を メソッド と呼びます。また、プロパティの取得や代入をトリガーに内部の処理を呼び出せる機能として、getter と setter が用意されています。メソッド・getter・setter を使えば、オブジェクトのデータを読み書きする際に、自動で処理を挟めるので、コードをよりわかりやすく整理することができます。

１．メソッドとは

　オブジェクトリテラルの中で、プロパティ名に直接関数を定義すると、それが メソッド と呼ばれます。たとえば、下記のように「method(arg1, arg2) { ... }」と書くと、そのオブジェクトが持つメソッドという扱いになります。

２．getter と setter

  • getter： プロパティを読み取るとき（obj.prop など）に内部で関数を呼び出せる仕組み。
  • setter： プロパティに代入するとき（obj.prop = 値 など）に内部で関数を呼び出せる仕組み。

実際の文法は以下の通りです。

{
  プロパティ名: 値,       // 通常のプロパティ

  メソッド名(引数) {
    // メソッドの処理
    return 戻り値;
  },

  get プロパティ名() {
    // ここに getter の処理
    return 戻り値;
  },

  set プロパティ名(引数) {
    // ここに setter の処理
  }
}

３．サンプルコード (HTML + JavaScript)

　次の例を「myObjectMethodGetterSetter.html」というファイル名で保存し、ブラウザで開き、開発者ツール(コンソール)の出力を確認してください。

【myObjectMethodGetterSetter.html】

<!DOCTYPE html>
<html lang="ja">
<head>
  <meta charset="utf-8">
  <title>myObjectMethodGetterSetter.html</title>
</head>
<body>
  <h1>メソッド・getter・setter のサンプル</h1>
  <p>ブラウザの開発者ツール(コンソール)で出力を確認してください。</p>

  <script>
    // オブジェクトを作成
    const product = {
      // 通常のプロパティ
      name: 'ストロベリーケーキ',

      // メソッド
      describeMessage(prefix, suffix) {
        return `${prefix}${this.name}${suffix}`;
      },

      // getter
      get fancyName() {
        return this.name + '★おすすめ★';
      },

      // setter
      set rename(newName) {
        this.name = newName;
      }
    };

    // 1) メソッドの呼び出し
    const msg = product.describeMessage('★', '★');
    console.log('メソッドの結果:', msg);

    // 2) 通常のプロパティ
    console.log('通常のプロパティ:', product.name);

    // 3) getter
    console.log('getter:', product.fancyName);

    // 4) setter
    product.rename = 'チョコレートケーキ';
    console.log('setter後 name:', product.name);
    console.log('setter後 fancyName:', product.fancyName);
  </script>
</body>
</html>

デバックコンソールの出力

メソッドの結果: ★ストロベリーケーキ★
通常のプロパティ: ストロベリーケーキ
getter: ストロベリーケーキ★おすすめ★
setter後 name: チョコレートケーキ
setter後 fancyName: チョコレートケーキ★おすすめ★

４．まとめ

  • オブジェクトのプロパティに関数を定義すると、それはメソッドと呼ばれる。
  • getterを定義すると、プロパティ取得時に自動で関数が呼ばれ、戻り値を返せる。
  • setterを定義すると、プロパティ代入時に自動で関数が呼ばれ、値の検証や調整などが行える。
  • 実際には getter/setter を多用しすぎるとコードが読みにくくなる場合もあるため、必要性と可読性を考慮しつつ使うのが望ましい。

　こうしたメソッドや getter/setter の機能を上手く活かせば、オブジェクト内部のデータを安全かつ柔軟に扱えるようになります。