如何使用模块化JavaScript模式创建单独的对象

我试图更新间隔值x，但没有成功。我希望最终有不同的pawn对象，其内部值可以在按up/down/left/right重新绘制画布时更新

代码更新：现在可以更新x，y值，但不确定是否使用模块化JavaScript模式创建单独的对象

使用jQuery 1.5.1的JavaScript：

//Constructors
    var pawn = (function() {        

        var x = 25;
        var y = 25;     
        var getX = function() {
            return x;
        };
        var getY = function() {
            return y;
        };

        function _drawPawn(x,y) {
            var x = x || 25;
            var y = y || 25;
            var canvas = document.getElementById("canvas");
            if (canvas.getContext) {
                var b = $('body');
                var winH = b.height();
                var winW = b.width();
                $(canvas).attr('height',winH).attr('width',winW);
                var ctx = canvas.getContext("2d");  
                ctx.beginPath();
                ctx.lineWidth="3";
                ctx.arc(x, y, 10, 0, Math.PI * 2, true); // circle              
                ctx.stroke();
            }
        }

        function left() {
            x = 100;
            y = 100;
        }

        return {
            getX:getX,
            getY:getY,
            draw: function drawPawn(x,y) {
                _drawPawn(x,y);
            },
            left:left
        }
    })();   

    //Init
    $(function() {      
        var b = pawn;
        b.left();
        alert(b.getX());

            var a = pawn;
    alert(a.getX());

        //b.draw();
    });

以及html：

<canvas id="canvas" height="800px" width="600px">
    Download a modern browser like Internet Explorer 9, Firefox, Safari or Chome to view this.
</canvas>

下载Internet Explorer 9、Firefox、Safari或Chome等现代浏览器查看此内容。

在当前编写时，您的

getX（）

函数将使用提供的（空）参数列表自动调用，并返回

x

，这相当于：

var getX = x;

这将给出声明时

getX

的

x

值

要修复此问题，请删除括号：

var getX = function() {
        return x;
};

---

您还需要在返回的对象中修复此函数：

draw: function drawPawn(x, y) {
    _drawPawn(x, y);
}

由于明显的目的是调用

绘图

，而不使用参数，并使用当前绑定的

x

和

y

值，因此它应该是：

draw: function drawPawn() {
    _drawPawn(x, y);
}

---

首先就像alnitak说的从getX，getY中移除这些。

---

如果你想要不同的典当对象，你应该使用

var b=new pawn（）

测试，不起作用。我使用这个模式声明var b=pawn的方式是正确的？将函数作为字符串返回，它看起来像是的，因为您没有在

b.getX

中调用函数，您只获得了对它的引用。顺便说一句，您的模块模式可能不正确-您只能创建一个“典当”-实际上它是一个名为

pawn

，而

b

只是对同一对象的另一个引用。我在JS方面还没有足够的专家来解决这个问题，虽然.FWIW，我认为您使用了正确的语法来创建一个模块，但是“典当”本身应该是该模块的一部分，而不是整个模块。我不认为您可以新建一个模块，但您可以创建新的构造函数。如果不确定我所说的模块模式是什么意思，请阅读以下内容：我不明白你的意思，我以为你想要不同的典当对象；如果你只想要一个，你可以只使用

b=pawn

赋值。对于draw，你可以使用：

draw:\u drawPawn（x，y）

也许你应该试一试。你是什么意思？我不明白bc你没有解释清楚你想做什么。什么是“独立对象？”请在回答之前阅读Alnitak回答下面的评论。Alnitak在这里发布的回答：