Javascript creation of objects

Question

I'm creating a javascript object that will store information about the user logged into my site (for easy access), but for me, It's been very difficult to understand the ways of creating an object in javascript. I've seen examples using the prototype way, and anothers using the closures way, I decided to stay with the closures, because I'll need only a single instance of this object, and so, don't is a big overhead.

I wonder if what I'm doing is correct, and if there is any way to improve my code, this is my code:

(function(window){
    var mysite = (function() {
        var me = this;

        return { //public interface
            init : function(userInfo){
                me.user = userInfo;
                return this;
            },
            sayHello : function(){
                return 'Hello, my name is ' + me.user.name + ' and I am ' + me.user.age + ' years old.';
            }
        }
    }());

    window.mysite = function(userInfo){
        return mysite.init(userInfo);
    }
})(window);

var mysite = mysite({name : 'Jonathan', age : 17});
mysite.sayHello();

Edit #1

If I would like to add sub-objects to the main object MySite, and these sub-objects have their own methods and properties, as well as access to properties and methods of the main object (MySite), I'd like to do something like this:

mysite.timezone.calculeUserTimezone();

How to proceed?

Raynos · Accepted Answer · 2011-07-18 12:37:39Z

1

Using the prototype

(function(window) {
    var MySite = function(opt) {
        this.user = opt;
    };

    MySite.prototype.sayHello = function() {
        return 'Hello, my name is ' + this.user.name + ' and I am ' + this.user.age + ' years old.';
    };

    window.mysite = function(options) {
        return new MySite(options);
    }
})(window);

var a = mysite({
    name: 'Jonathan',
    age: 17
});
console.log(a.sayHello());

I would go for the prototypical approach instead. Your not taking advantage of closures so this way is neater.

Live Example

Using closures

(function(window) {
    var MySite = function(opt) {
        var user = opt;

        this.sayHello = function() {
            return 'Hello, my name is ' + user.name + ' and I am ' + user.age + ' years old.';
        }
    };

    window.mysite = function(options) {
        return new MySite(options);
    }
})(window);

var a = mysite({
    name: 'Jonathan',
    age: 17
});
console.log(a.sayHello());

Live Example

edited Jul 18, 2011 at 12:37

answered Jul 18, 2011 at 12:12

Raynos

170k57 gold badges359 silver badges399 bronze badges

Sign up to request clarification or add additional context in comments.

8 Comments

jonathancardoso Over a year ago

Your not taking advantage of closures Could you explain this better? Following the example you posted, if I wanted the user to be private property, how would I do? Thanks.

Raynos Over a year ago

@Jonathan there is no such thing as private in JavaScript ;) I also forgot to mention that your code was a single object that keeps being re-initialized and doesn't allow you to create multiple instances.

jonathancardoso Over a year ago

But in my example me.user can't be acessed outside the closure.

Raynos Over a year ago

@Jonathan and why does that matter?

jonathancardoso Over a year ago

Because I wouldn't want that a user with firebug has easy access to this property, I know that javascript is in practice, totally public, but I want to hinder access to this property. Now one last question, following the two examples you gave, if I had another object (inside mySite), with its own functions and properties, how could I do?

|

dhinesh · Accepted Answer · 2011-07-18 12:16:48Z

0

   var mysite = (function() {
        var me = this;

        return { //public interface
            init : function(userInfo){
                me.user = userInfo;
                return this;
            },
            sayHello : function(){
                return alert(me.user.name);
            }
        }
    })();


mysite.init({name : 'Jonathan', age : 17});
mysite.sayHello();

I think this will also be good, because mysite will be a single object which can be accessed everywhere.

answered Jul 18, 2011 at 12:16

dhinesh

4,8142 gold badges28 silver badges44 bronze badges

Collectives™ on Stack Overflow

Javascript creation of objects

2 Answers 2

8 Comments

Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

2 Answers 2

8 Comments

Comments

Your Answer

Sign up or log in

Post as a guest

Related