2011-06-21 31 views
14

Soy algo nuevo en Javascript, así que tal vez esto sea solo un error novato, pero no he encontrado nada que me ayude específicamente mientras miro. Estoy escribiendo un juego, y estoy tratando de construir un objeto para el menú de pausa.Objetos dentro de objetos en javascript

Una de las cosas que me gustaría hacer es hacer que los botones en el menú sean objetos dentro del objeto pause_menu por el bien de la organización. Eventualmente voy a agregar manejadores de eventos a estos objetos, y me gustaría hacer eso dentro del objeto pause_menu también. Algunos de los botones aún no están completamente codificados, pero me gustaría que al menos algo funcione antes de continuar.

Estoy usando Raphael.js v1.5.2 para representar las formas. El material de Raphael funciona para el resto de la interfaz, pero el código para eso no es tan agradable de ver como este, por lo que algo similar a esto sería preferible para mí.

Mi problema actual es que en realidad no aparece nada cuando lo hago var pause_menu = new pause_menu();

Este es el código que tengo hasta ahora para el menú de pausa:

//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, así que aquí está la solución (con un controlador de eventos):

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: {} 

}; 
+0

seguro de que el tema es sin el resto del código, pero tenga en cuenta que eres sobrescribiendo la función 'pause_menu' cuando haces' var pause_menu = new pause_menu(); 'en el mismo ámbito variable que la función. – user113716

+0

Gracias patrick, en el juego real 'var pause_menu = new pause_menu();' no está en el mismo alcance que la función. ¿Se sobreescribe porque el nombre de la variable es el mismo que la función? –

+0

parece que necesita crear un método render() que represente las instancias game.rect()? –

Respuesta

18
var pause_menu = { 
    pause_button : { someProperty : "prop1", someOther : "prop2" }, 
    resume_button : { resumeProp : "prop", resumeProp2 : false }, 
    quit_button : false 
}; 

a continuación:

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

etc etc.

+9

Eso no es JSON. Son solo literales de objetos. Error común. – user113716

+0

Una combinación de esto y la respuesta de Lance resuelve el problema, ¡gracias chicos! –

3

Puede tener tantos niveles de jerarquía de objetos como desee, siempre que declare que un Objeto es propiedad de otro Objeto principal. Presta atención a las comas en cada nivel, esa es la parte difícil. No utilice comas después de que el último elemento en cada nivel:

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

No