Object.defineProperty and return values

Question

I'm playing around with a javascript object that defines some getters and setters using the Object.defineProperty method.

function User() {       
    var _username;  
    var _id;

    Object.defineProperty(User, 'id', {
        get: function() {
            return _username;
        }       
    });         

    Object.defineProperty(User, 'username', {
        get: function() {
            return _username;
        },
        set: function(username) {
            this._username = username;          
        }
    }); 
}

For one of the properties (id), I only want a getter. Originally I had a typo and it was returning the value of _username, but I quickly realized that the above did not work. Just for curiosity sake though, I'm trying to understand why it didn't work as expected. If I did the following:

var u = new User();
u.username = 'bob';
alert(u.username);
alert(u.id);

the last statement would alert undefined instead of bob. Why is that? And is there a way to get it to return another property?

Answer 1

You must define the properties on this instead of the constructor function

function User(params) {       
   var _username;

   Object.defineProperty(this, 'id', {
        get: function() {
            return _username;
        }       
   });         

   Object.defineProperty(this, 'username', {
        get: function() {
            return _username;
        },
        set: function(username) {
            _username = username;          
        }
   }); 
   if (params && params.username) {
       this.username = params.username;
   }
}
User.prototype.stringify = function () {
    return JSON.stringify({ username: this.username});
}