title: Object.defineProperty duplicates property values
body: <p>I was experimenting with some bits of code below and everything seems to be working as expected. The goal was to bind <code>a.val</code> to <code>b.val</code> such that when <code>a.val</code> changed, <code>b.val</code> would also change automatically.</p>
  
  <pre><code>// instantiate 
  var a = {}
  var b = {}
  
  // set value
  a.val = 10
  
  // check values
  console.log("A.val is:", a.val) // 10
  console.log("B.val is:", b.val) // undefined
  
  // bind values
  Object.defineProperties(a, {
    val: {
      configurable: true, // can be changed or deleted
      enumerable: true,   // can be iterated over
      get: ()=&gt; this.val,
      set: (value)=&gt; {
          this.val = value
          b.val = value
          return value
      }
    }
  })
  
  // reset value
  a.val = 20
  
  // check values
  console.log("A.val is:", a.val) // 20
  console.log("B.val is:", b.val) // 20
  </code></pre>
  
  <p>So I wanted to move forward with this concept and abstract the <code>Object.defineProperties</code> part into a function. I thought I could make a for loop and loop through the properties of one object, call <code>Object.defineProperty</code>. But I ran into some issues: </p>
  
  <pre><code>function getSet(props){
    for(var key in props){
      Object.defineProperty(props, key, {
        configurable: true, // can be changed or deleted
        enumerable: true,   // can be iterated over
        get: ()=&gt; this[key],
        set: (value)=&gt; {
            this[key] = value
            return value
        }
      })
    }
  
    return props
  }
  
  var a = getSet({name: 'the letter a', age: 12})
  
  a.name // undefined
  a.name = 'the letter a'
  a.age // 'the letter a'
  </code></pre>
  
  <p>Essentially I have inadvertently bound the two properties of the object I was passing to the <code>getSet</code> function. Furthermore I have erased their initial values. </p>
  
  <p>My question is, why does that happen, and how do I get closer to my goal, of binding the properties of one object to another. </p>
  
  <p>Through testing several other possible solutions I ran into a <code>Maximum call stack size exceeded</code> error: I presume when referencing <code>this</code> in the getter or setter, the act of getting the value from the object I am trying to define properties on triggers a call to the getter, and loops indefinitely. Not entirely sure when/why this happens.</p>