title: ES6 class getter function returns undefined in react after refresh
body: <p>I am able to call the getter function. But upon refresh, the class is unable to find the getter function and returns undefined.</p>
  
  <p>This is to save data into a class and then save the class into a state.
  I have console logged the information and all the data appears present.</p>
  
  <pre><code>export class metaComparison {
      constructor(__key, __operator=null, __compareValue=null) {
          this._key     = __key;
          this._op      = __operator;
          this._compVal = __compareValue;
      }
  
      set key(__key)        { this._key     = __key; } 
      set operator(__op)    { this._op      = __op; }
      set compareVal(__val) { this._compVal = __val; }
  
      get key()        { console.log("key is: ", this._key); return this._key;}
      get operator()   { return this._op; }
      get compareVal() { return this._compVal;}
  
  }
  </code></pre>
  
  <p>File 2:</p>
  
  <pre><code>import { metaComparison } from './meta-query-class'
  .
  .
  .
  this.setState(prevState =&gt; ({
   metaQueryConditional: [...prevState.metaQueryConditional, 
   new metaComparison(this.state.selectedMetaKey)]...
  .
  .
  this.state.metaQueryConditional.map((singleQuery, idx) =&gt; {
  return(
  .
  .
  &lt;h2&gt; Metakey:  {singleQuery.key} {console.log("rendering single query which is", singleQuery, "and key is: ", singleQuery["_key"], singeQuery.key)}&lt;/h2&gt;
  </code></pre>
  
  <p>Expected results is singleQuery.key returns the key value. The key value is returned. But upon refresh, I start getting undefined.</p>