JavaScript: How to create nested object using variable names for the nested objects?

Question

How do I create a nested object using variables. In this case I have a object called hands that is created in the global context. Now I have x players ( in this case 3) that I am dealing each a hand of 5 cards.

So I want the hands object to look like hands[playerNum][cardInst][dealtCard] as the end result. I am used to Perl Hashes, and this is pretty straight forward in Perl.

However no matter how I try to put the objects into hands, I am not seeing the cards. See the code below. var hands = {}; is declared outside the function. What am I missing?

 function dealCards() { console.log("Dealing Cards\\r\\n"); var numPlayers = 3; var curCard; for (i=0;i<5;i++) { var cardInst = i.toString(); for (pn =0;pn<numPlayers;pn++){ // get current value for pn and store it var playerNum = pn.toString(); //get card off of game deck curCard = gameDeck.shift(); //add card info to variables var dcardID = baseDeck[curCard].id; var dcardName = baseDeck[curCard].name; var dcardText = baseDeck[curCard].text; var dcardImg = "none"; //create new card object var dealtCard = new card(dcardID,dcardName,dcardText,dcardImg); hands[playerNum][cardInst] = dealtCard; console.log("blah"); } } console.log(hands); } function card(id,name,text,img){ this.id = id; this.name = name; this.text = text; this.img = img; } 

var hands = {};



function dealCards() {
    console.log("Dealing Cards\r\n");
    var numPlayers = 3;
    var curCard;

    for (i=0;i<5;i++) {
        var cardInst = i.toString();

        for (pn =0;pn<numPlayers;pn++){
            // get current value for pn and store it
            var playerNum = pn.toString();

            //get card off of game deck
            curCard = gameDeck.shift();

            //add card info to variables
            var dcardID = baseDeck[curCard].id;
            var dcardName = baseDeck[curCard].name;
            var dcardText = baseDeck[curCard].text;
            var dcardImg = "none";

            //create new card object
            var dealtCard = new card(dcardID,dcardName,dcardText,dcardImg);



            hands[playerNum][cardInst] = dealtCard;
            console.log("blah");
        }
    }
    console.log(hands);
}

function card(id,name,text,img){
    this.id = id;
    this.name = name;
    this.text = text;
    this.img = img;
}

Any help would be appreciated!

Z

Answer 1

Two things; hands[playerNum] isn't being initialised, and function card() doesn't have a return Try initialising the internal object (with key playerNum) before adding to it;

function dealCards() {
    console.log("Dealing Cards\r\n");
    var numPlayers = 3;
    var curCard;

    for (i=0;i<5;i++) {
        var cardInst = i.toString();

        for (pn =0;pn<numPlayers;pn++){
            // get current value for pn and store it
            var playerNum = pn.toString();

            //get card off of game deck
            curCard = gameDeck.shift();

            //add card info to variables
            var dcardID = baseDeck[curCard].id;
            var dcardName = baseDeck[curCard].name;
            var dcardText = baseDeck[curCard].text;
            var dcardImg = "none";

            //create new card object
            var dealtCard = new card(dcardID,dcardName,dcardText,dcardImg);

            if (hands[playerNum] === undefined){
                hands[playerNum] = {};
            }



            hands[playerNum][cardInst] = dealtCard;
            console.log("blah");
        }
    }
    console.log(hands);
}
function card(id,name,text,img){
    this.id = id;
    this.name = name;
    this.text = text;
    this.img = img;
    return this;
}

Also, personally I don't like using the constructor style of "this dot property". It's a better habit to return a new object so you never accidentally capture other properties from the current 'this' context.

function card(id,name,text,img){
    return {
       id: id,
       name: name,
       text: text,
       img: img
    }
}