Question

I have two objects defined something like this (simplified for sake of the question):

var firstObject = function(){ };
firstObject.prototype.doSomethingFirstObjectsDo();

var secondObject = function(){ };
secondObject.prototype.doSomethingSecondObjectsDo();

Next I have an Object Manager which works as a sort of interface for my main application to create objects:

var ObjectManager = function()
{
    this.create = {
        FIRST:firstObject,
        SECOND:secondObject
    };
};

ObjectManager.prototype.createObject = function(type)
{
    return new this.create[type]();
};

Finally an example of the main application using the Object Manager to Dynamically Create Either firstObjects or secondObjects:

var MainApplication = function(options)
{
    this.objectTypes = options.objectTypes;
    this.objManager = new ObjectManager();
};

MainApplication.prototype.createObjects = function()
{
    //Iterate through all the types this application needs to create
    for (var type in this.objectTypes)
    {
        var dynamicallyCreatedObject = this.objManager.createObject(type);
        //Do Something Else
    }
};

This approach works great, but has one disadvantage that I can see – being that you need to formally define the name of the Constructor Function for each Object “Type” that could be created.

In the event that I wanted to create a “thirdObject” – which would be already formally defined – I would also need to go back and add a reference to the “thirdObject”‘s constructor function in the ObjectManager.

Ideally, I would like to remove the need for an “ObjectManager” and simply be able to dynamically call the constructor method with the “new” keyword like this:

//Inside MainApplication
for (var type in this.objectTypes)
{
    var dynamicallyCreateObject = new [type]();  //Invalid Syntax
};

Anybody have any thoughts on a better way to handle dynamically creating different objects in JavaScript using the “new” keyword?

---

Responding to Some Initial Comments:

I should have mentioned that the entire application is enclosed within an anonymous function.

(function(){
    //All of My Mentioned Code is Found Here
    $(document).ready(function(){
        mainApp = window.mainApp = new MainApplication(options);
    });
});

@casablanca: From what you are saying I believe I’ll need to actually define a NameSpace inside the entire anonymous function, since once it finishes I have no real way to directly refer to that scope again. I think I know what I need to do now, I was kind of hoping there was another way to work with that “new” keyword – but it doesn’t seem like that is the case.

Answer 1

Assuming I understand your desire (and I’m not sure that I do) you can use the global window object in DOM 0 browsers, or create your own reference to the global scope, and use that to look up variables defined locally.

var $global = this;
var firstObject = function(){};

var objName = "firstObject";
var instance = new $global[objName];