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

Smith沿着这些方针应该有效：

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 Essential JavaScript Design Patterns For Beginners, Volume 1.

的另一个好读物

Javascript中原型的构造函数

2 个答案: