web-dev-qa-db-ja.com

JavaScriptのオブジェクト内のオブジェクト

私はJavascriptにやや慣れていないので、これはたぶん初心者の間違いかもしれませんが、見回す際に特に役立つ何かは見つかりませんでした。私はゲームを書いており、一時停止メニュー用のオブジェクトを作成しようとしています。

私がやりたいことの1つは、整理のために、メニューのボタンをpause_menuオブジェクト内のオブジェクトにすることです。最終的にこれらのオブジェクトにイベントハンドラーを追加しますが、pause_menuオブジェクト内でも同様に行いたいと思います。いくつかのボタンはまだ完全にはコーディングされていませんが、先に進む前に、少なくとも何かを機能させたいと思います。

Raphael.js v1.5.2を使用して形状をレンダリングしています。 Raphaelのものはインターフェースの残りの部分で機能しますが、そのためのコードはこれほど見た目が良くないので、これに似たものが私にとっては望ましいでしょう。

私の現在の問題は、var pause_menu = new pause_menu（）;を実行しても実際には何もレンダリングされないことです。

これは私がこれまでに一時停止メニュー用に持っているコードです：

//Pause Menu Object:
function pause_menu() {

    function pause_button() {
        this.button = game.rect(0, 350, 150, 50, 5);
        this.text =  game.text(75, 375, 'PAUSE');
    }
    function resume_button() {
        this.button;
        this.text;
    }
    function quit_button() {
        this.button;
        this.text;
    }
    this.pause_button = new pause_button(); //the button that the user presses to pause the game (I want an event handler on this to trigger .show() method for presently hidden menu items)
    this.resume_button = new resume_button();
    this.quit_button = new quit_button();
    this.box = game.rect(150, 50, 400, 300, 5).hide(); //the box that surrounds the menu when it appears
}
var pause_menu = new pause_menu();

OK、だからここにソリューションがあります（イベントハンドラーを使用）：

var pause_menu = {

    pause_button: { button : game.rect(0, 350, 150, 50, 5).click(function (event){
                       pause_menu.menu_box.show();
                  }), text : game.text(75, 375, 'PAUSE') },
    menu_box: game.rect(150, 50, 400, 300, 5).hide(),
    resume_button: {},
    quit_button: {}

};
javascriptobjectnestedjavascript-objects
25
Michael Taufen
var pause_menu = {
    pause_button : { someProperty : "prop1", someOther : "prop2" },
    resume_button : { resumeProp : "prop", resumeProp2 : false },
    quit_button : false
};

その後：

pause_menu.pause_button.someProperty //evaluates to "prop1"

などなど.

29
Jonathan

オブジェクトを別の親オブジェクトのプロパティであると宣言する限り、オブジェクト階層のレベルは必要なだけ持つことができます。各レベルのコンマに注意してください、それはトリッキーな部分です。各レベルの最後の要素の後にコンマを使用しないでください。

{el1, el2, {el31, el32, el33}, {el41, el42}}

var MainObj = {

  prop1: "prop1MainObj",
  
  Obj1: {
    prop1: "prop1Obj1",
    prop2: "prop2Obj1",    
    Obj2: {
      prop1: "hey you",
      prop2: "prop2Obj2"
    }
  },
    
  Obj3: {
    prop1: "prop1Obj3",
    prop2: "prop2Obj3"
  },
  
  Obj4: {
    prop1: true,
    prop2: 3
  }  
};

console.log(MainObj.Obj1.Obj2.prop1);
11
João Pimentel Ferreira