Object oriented JavaScript help

Question

Hi,

I have the following code:

var HD = function() { };

HD.Car = (function() {
    var _date = "09/07/2010";
    return {
        Make: undefined,
        Model: undefined,
        showMakeAndModel: function() {
            document.write(this.Make + " " + 
                           this.Model + 
                           " (data correct as of " + _date + ")");
            }
        };
    })();

var bert = new HD.Car();
bert.Make = "Ford";
bert.Model = "Capri";
window.onload = bert.showMakeAndModel();

And get the following error:

HD.Car is not a constructor

All I'm trying to do is test (to learn) the 'singleton pattern' with closure (for private members) so not a 'real' example, but the book I'm reading suggests this is the way to do it.

So a little confused - any help would be much appreciated.. Rob

Answer 1

Remove new, because it is only needed for constructor functions. Now HD.Car will be the object that an anonymous and self-executing function returns. Then remove parens after HD.Car. So it should look like:

var bert = HD.Car;

Now HD.Car is a singleton.

If you want it to be more like a factory you should do:

HD.Car = function() {
    var _date = "09/07/2010";
    return {
        Make: undefined,
        Model: undefined,
        showMakeAndModel: function() {
            document.write(this.Make + " " + 
                           this.Model + 
                           " (data correct as of " + _date + ")");
        }
   };
};​

var bert = new HD.Car();

Answer 2

In JavaScript you can only use the new keyword with functions.

HD.Car is not a function, it's an object.

Just don't use new for your example.

Answer 3

You have some incorrect ()() around the HD.Car class definition. This fixed sample works:

var HD = function() { }; 

HD.Car = function() { 
    var _date = "09/07/2010"; 
    return { 
        Make: undefined, 
        Model: undefined, 
        showMakeAndModel: function() { 
            document.write(this.Make + " " +  
                           this.Model +  
                           " (data correct as of " + _date + ")"); 
            } 
        }; 
    }; 

var bert = new HD.Car(); 
bert.Make = "Ford"; 
bert.Model = "Capri"; 
window.onload = bert.showMakeAndModel();

Answer 4

Your error is coming from the fact that you're executing your constructor function, as indicated by the open and close parentheses after the declaration of HD.Car (and just before var bert). So, the function is executing and returning an object, which you're then trying to use with the "new" operator.

If you remove those parentheses, I believe you'll get the functionality you want.

Answer 5

For a bit more info:

How to write a singleton class in javascript.

Hopefully that will shed a bit more light for you!