Using `Object.defineProperty` with RangeError

Question

I'm trying to use Object.defineProperty to update my obj object to have a get and set accessor on obj.name .

var obj = {};

Object.defineProperty(obj, 'name', { 
    get: function() { return this.name; },
    set: function(x) { this.name = x; }
});

console.log("obj:", obj);
console.log("obj.name:", obj.name);

But I'm getting a Uncaught RangeError: Maximum call stack size exceeded .

How can I use Object.defineProperty to add get and set accessors on the name property in obj ?

http://jsfiddle.net/kman007_us/ZwYp6/

Answer 1

When you get obj.name , the get function is called, which returns the value of this.name .
When you get this.name , the get function is called, which returns the value of this.name .
When you get this.name , the get function is called, which returns the value of this.name .
When you get this.name , the get function is called, which returns the value of this.name .
When you get this.name , the get function is called, which returns the value of this.name .
When you get this.name , the get function is called, which returns the value of this.name .
When you get this.name , the get function is called, which returns the value of this.name .
When you get this.name , the get function is called, which returns the value of this.name .
When you get this.name , the get function is called, which returns the value of this.name .
When you get this.name , the get function is called, which returns the value of this.name .
When you get this.name , the get function is called, which returns the value of this.name .
When you get this.name , the get function is called, which returns the value of this.name .
When you get this.name , the get function is called, which returns the value of this.name .
When you get this.name , the get function is called, which returns the value of this.name .
When you get this.name , the get function is called, which returns the value of this.name .
When you get this.name , the get function is called, which returns the value of this.name .
When you get this.name , the get function is called, which returns the value of this.name .
When you get this.name , the get function is called, which returns the value of this.name .
When you get this.name , the get function is called, which returns the value of this.name .
When you get this.name , the get function is called, which returns the value of this.name .
When you get this.name , the get function is called, which returns the value of this.name .
When you get this.name , the get function is called, which returns the value of this.name .
When you get this.name , the get function is called, which returns the value of this.name .
When you get this.name , the get function is called, which returns the value of this.name .
When you get this.name , the get function is called, which returns the value of this.name .
When you get this.name , the get function is called, which returns the value of this.name .
When you get this.name , the get function is called, which returns the value of this.name .
When you get this.name , the get function is called, which returns the value of this.name .
Uncaught RangeError: Maximum call stack size exceeded.

---

Try return this.__name; and this.__name = x; instead.

Answer 2

You cannot access a property in the getters or setters by the same name as a property you are defining using Object.defineProperty . You've created a recursive function call that never exits.