Question

In file meterA.js I have this

    window.MeterA = function(options)
    {
        return this.init(options);
    }

   MeterA.prototype = {
        init: function(options) {
            this.container = options.container;
            this.width = options.width;
            this.height = options.height;
            this.sliderSize = options.sliderSize;
            var Canvas = {
                meter: TBE.CreateRectCanvasElement (displayWidth, displayHeight),
                slider: TBE.CreateSquareCanvasElement (sliderSize)
            };
            Container.appendChild (Canvas.meter);
            Container.appendChild (Canvas.slider);
        }
    }

Then in file pane.html, I tried to initialise meter with:

var MeterA = new MeterA({
    container:  Div.meterA, 
    width:      GetNumberIgnoreUnit(Div.speedMeter.style.width, 2), 
    height:     GetNumberIgnoreUnit(Div.speedMeter.style.height, 2), 
    sliderSize: 10
});

But I get “MeterA is not a constructor” as error, why is it?

Answer 1

var MeterA = new MeterA({ ...

I believe using MeterA as the variable name and the class name is the problem here. Variable declarations in Javascript are “hoisted” to the top of the function so MeterA becomes undefined

Some good explanation here : http://net.tutsplus.com/tutorials/javascript-ajax/quick-tip-javascript-hoisting-explained/