[JavaScript入門] definePropertyを使ってGetterおよびSetterを作成する

今回は、JavaScriptでGetterとSetterを表現していきます。

Getterとは、「フィールドの値を取り出すだけのメソッド」であり、Setterというのは「フィールドに値を代入するためのメソッド」となります。

Object.definePropertyについて
getter/setter 使用例
さいごに

Object.definePropertyについて

Object.definePropertyは下記のように、指定したオブジェクトに対してプロパティを定義することができます

Object.defineProperty(Object,PropertyName,PropertyDiscrypta)

第１引数には、オブジェクトを指定します。
第２引数には、指定した名前のプロパティを定義します。
第３引数はプロパティの属性を指定します。

この第３引数に指定するプロパティ属性情報に設定することができる項目は下記の通りです。

種別	属性	初期値	説明
プロパティ	Value	undefined	プロパティに値を設定する
プロパティ	writable	false	Value属性に対して上書きできるかどうかを設定する
アクセサ	get	undefined	Getter関数を設定する
アクセサ	set	undefined	Setter関数を設定する
共通	enumerable	false	for-in文やObject.keys()で列挙されるかどうか
共通	configurable	false	属性変更可能かどうか

今回getterやsetterをdefineProperty関数を利用して表現しますが、getやsetを指定した場合はvalueやwritable属性を指定できません。

getter/setter 使用例

let student = {
  firstName: "Kunisura"
}

// Getter
Object.defineProperty(student, "getName", {
  get : function () {
    return this.firstName;
  }
});

// Setter
Object.defineProperty(student, "setName", {
  set : function (value) {
    this.firstName = value;
  }
});

// default
console.log(student.firstName); // Kunisura

// use getter
console.log(student.getName); // Kunisura

// set name
student.setName = "Kunichan";

console.log(student.getName); // Kunichan