JavaScript - Infinite Setter -

無限セット編
書き留めたままだったので供養。

ちょっと考えればわかるが、考えなかったので遭遇したことのメモ。

なんの話？

Setter の定義によっては再帰的にコールされるよ、ていう話。

以降、上記のことを単に現象と書く。

どんなことしちまったか？

下記のように class Kemomimi を定義し、そこには animalKind に対する Getter と Setter を定義した。

class Kemomimi {
  constructor(animalKind) {
    this.animalKind = animalKind;
  }
  get animalKind() {
    return this.animalKind;
  }
  set animalKind(animalName) {
    this.animalKind = animalName;
  }
}

let kmmm = new Kemomimi("wolf");
// 癒しを得たいからキツネが良いなぁ……
kmmm.animalKind = "fox";

これは現象に遭遇できるコード。

Setter がコールされるのはいつ？を考えれば分かる。

...🤔

Setter で Setter 呼んでねえか？

class Kemomimi {
  constructor(animalKind) {
    this.animalKind = animalKind;
  }
  get animalKind() {
    return this.animalKind;
  }
  set animalKind(animalName) {
    // ここでもセットしてるから再帰しちゃう
    // Maximum call stack size exceeded っていうエラーになる
    this.animalKind = animalName;
  }
}

let kmmm = new Kemomimi("wolf");
// 癒しを得たいからキツネが良いなぁ……
kmmm.animalKind = "fox";

例えば、フィールド名を変えてやるなどが必要ってわけさ。

class Kemomimi {
  constructor(animalKind) {
    this._animalKind = animalKind;
  }
  get animalKind() {
    return this._animalKind;
  }
  set animalKind(animalName) {
    this._animalKind = animalName;
  }
}

let kmmm = new Kemomimi("wolf");
// 癒しを得たいからキツネが良いなぁ……
kmmm.animalKind = "fox";

感想

JavaScript は Web サイトで遊ぶ程度にしか使ったことなかったから、私の中で当たり前でもなんでもなく……。

そんな中、ついに仕事で Node.js を使うことになり、どうせなら class を使ったろ～と。

その結果、この現象に出会えたわけです。
いっぱいこういうの踏んでいくぞ～。

他の言語でも同じこと起こりそうなので、これからも似た場面があれば気にしておく。