Javascript 如何创建仅存在于对象状态中的变量？

问题的标题可能不是最好的，但以下是我迄今为止编写的代码：

var menuState = {

    //state variables
   menuBttn: {
        x: _canvas.width/2, 
        y:_canvas.height/2, 
        img: imageArray[2], 
        over: false, 
        click: function() {
            changeState(2);
        }
    },

    preload: function () {

    },

    update: function(){
        surface.clearRect(0, 0, _canvas.width, _canvas.height);
        for (var i = 0; i < menuAssets; i++){
        surface.drawImage(//draw menuBttn);              
        }
    },

    exit: function(){

    },

};

这是Phaser.io（一个制作游戏的库）中的工作方式，但我正在尝试制作自己的游戏引擎

---

我该怎么办呢？

我认为你做得对。菜单按钮仅存在于您创建的对象范围内，因此其他类无权访问

menuBttn

，因为它位于

menuState

内。使用

这个

关键字也非常聪明

---

另一个选项是创建创建新按钮的make_按钮函数，并在

menuState

对象内创建它。您可能正在寻找“模块模式”，它使用立即调用的函数表达式（IIFE）和闭包来创建“私有”成员，例如

var foo=（函数（）{
//私人职能
功能栏（文本）{
console.log（文本）；
}
//私有变量
var private=‘初始值’；
//要分配给foo的对象
返回{runBar:function（text）{
条形图（文本）；
},
setPrivate：函数（值）{
私人=价值；
},
getPrivate:function（）{
回归私人；
}
};
}());
console.log（foo.runBar（'bar text'））；//条形文本
foo.setPrivate（“新值”）；
console.log（foo.getPrivate（））；//新值

这样做，就像你在第一个例子中所做的那样。如果使用“menuState.menuBttn”或希望访问menuBttn属性，则可以访问menuBttn。您可以选择“menuState.menuBttn.x”。此外，您不能在函数中放置单行注释

    surface.drawImage(//draw menuBttn);  

---

它会破坏函数，并会导致错误

在像我一样使用

this

关键字时，我注意到的问题是IDE显示了一个错误，上面写着：“expected”。当我在浏览器中运行代码时，它不会显示相同的错误，但我的代码不起作用。对象没有作用域，执行上下文有作用域。@PixelProgrammer您描述的错误是因为要为对象指定变量和值，您不使用等号，而是使用冒号。在你的帖子中，你说“我想我可以这样做：”将等号改为冒号，你应该是好的。@RobG oops，你是对的。我想我想说的是，如果你在一个对象内部定义一个对象，那么外部对象就无法访问它，除非你显式引用父对象。我不知道phaser，但在标准对象文本中，你不能使用

this.menuBttn

定义属性名。我认为您希望这个对象是您将文本分配给的对象，这是不正确的。这是执行上下文的参数，在全局代码中是全局对象。它是在运行时通过调用函数（或绑定）的方式来设置的，而不是词汇上的（箭头函数除外，但它们在这里并不相关）。@RobG我有一个暗示，这就是事实。好吧，既然那是不可能的，你有没有办法声明一个变量，它只存在于这个对象/状态的范围内，但可以在这个对象/状态的不同属性之间共享？@RobG，等等，你是说你不能做

obj={this.subobjc={…}

？因为我确信这是100%有效的，并且正是您应该如何定义只与该上下文相关的对象。在这种情况下，

menuState

全局可用，但

menuBttn

不会全局可用。@frei它可能对Phaser.js解析的语法有效，但对javascript无效。这是我最初计划的方式，但是我遇到了一些问题，你可以在这里看到-更新了我的答案。最后一个代码未按预期工作。

var menuState = (function () {
var menuBttn = {
    x: canvas.width / 2,
    y: canvas.height / 2,
    over: false,
    click: function () {
        console.log('clicked');
    }
};
var update = function () {
    console.log(menuBttn);
};
/* if you are in menuState scope then you can access menuBttn with out using menuState*/
console.log(menuBttn);
return{menuBttn: menuBttn, update: update};
})();

    surface.drawImage(//draw menuBttn);