# Observable makes my properties unserializable

**URL:** <https://discourse.aurelia.io/t/observable-makes-my-properties-unserializable/1291>\
**Category:** Help Requests\
**Created:** [June 7, 2018, 12:35pm UTC](https://discourse.aurelia.io/t/observable-makes-my-properties-unserializable/1291 "2018-06-07T12:35:09Z")\
**Posts on this page:** 3\
**Page:** 1

<div class="post-metadata">

**Author:** ![Kukks](https://yyz1.discourse-cdn.com/flex027/user_avatar/discourse.aurelia.io/kukks/32/361_2.png) [@Kukks](https://discourse.aurelia.io/u/Kukks)\
**Post date:** [June 7, 2018, 12:35pm UTC](https://discourse.aurelia.io/t/observable-makes-my-properties-unserializable/1291/1 "2018-06-07T12:35:09Z")

</div>

Example:

```auto
export class MaybeValue<T> {
  @observable
  public value: T;

  public hasValue: boolean;
  constructor(value: T) {
    this.value = value;
    this.hasValue = this.value != null;
  }

  public valueChanged() {
    this.hasValue = this.value != null;
  }
}

const boo = new MaybeValue<string>("hello");
console.log(JSON.stringify(boo)); // {"hasValue":true}

```

Crappy, super annoying workaround:

```auto
export class MaybeValue<T> {

  public value: T;

  public hasValue: boolean;
  constructor(value: T) {
    this.value = value;
    this.hasValue = this.value != null;
  }
  public setValue(val: T){
    this.value = val;
    this.valueChanged();
  }

  public valueChanged() {
    this.hasValue = this.value != null;
  }
}

const boo = new MaybeValue<string>("hello");
console.log(JSON.stringify(boo)); // {"hasValue":true, "value": "hello"}

```

Any way to “just” make it work?

---

<div class="post-metadata">

**Author:** ![huochunpeng](https://avatars.discourse-cdn.com/v4/letter/h/49beb7/32.png) [@huochunpeng](https://discourse.aurelia.io/u/huochunpeng)\
**Post date:** [June 7, 2018, 1:24pm UTC](https://discourse.aurelia.io/t/observable-makes-my-properties-unserializable/1291/2 "2018-06-07T13:24:55Z")

</div>

JSON.stringify respects `toJSON` method, which bypasses enumerable check on descriptors.

```auto
toJSON() {
  return {hasValue: this.hasValue, value: this.value};
}

```

Alternatively, you can copy and make your own version of observable, to use true on enumerable of the descriptor.

---

<div class="post-metadata">

**Author:** ![Kukks](https://yyz1.discourse-cdn.com/flex027/user_avatar/discourse.aurelia.io/kukks/32/361_2.png) [@Kukks](https://discourse.aurelia.io/u/Kukks)\
**Post date:** [June 7, 2018, 2:34pm UTC](https://discourse.aurelia.io/t/observable-makes-my-properties-unserializable/1291/3 "2018-06-07T14:34:18Z")

</div>

Oh wow, how the heck did I not learn of `toJSON` before. Thanks!