JavaScript原型的构造方法

Question

在meterA.js文件中我有这个

    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);
        }
    }

然后在文件pane.html中，我尝试使用以下方法初始化电表：

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

但是我收到“ MeterA不是构造函数”错误，为什么？

Answer 1

var MeterA = new MeterA({ ...

我相信使用MeterA作为变量名和类名是这里的问题。 Javascript中的变量声明被“提升”到函数的顶部，因此MeterA变得未定义

这里有一些很好的解释： http : //net.tutsplus.com/tutorials/javascript-ajax/quick-tip-javascript-hoisting-explained/

Answer 2

这些方面的东西应该起作用：

var MeterA = (function () {

    // constructor
    var MeterA = function (options) {
        this.init(options);
    };

    // prototype
    MeterA.prototype = {
        init: function (options) {
            console.log(options);
        }
    };

    return MeterA;

})();

obj = new MeterA({
    opt1: 'sasa',
    opt2: false
});

我推荐Javascript Patterns 2010 ，以更深入地了解构造函数模式。

关于初学者的 javascript 基本JavaScript设计模式的另一本好书，第1卷。