How to console log object data in javascript?

Question

I'm having some trouble returning the properties of my object. I keep getting an undefined error when I run the following code. I'm trying to reference what the rank is for each individual card. I thought the best way would be for them to each have their own object. However, when I console log I cant seem to get the properties out. Any advice?

The first console.log I need to return the rank #.

    //Deck with ranks
   var arrClubs = [
    {"img": '2_of_clubs.png',"rank": 1},{"img": '3_of_clubs.png',"rank": 2},{"img": '4_of_clubs.png',"rank": 3},{"img": '5_of_clubs.png',"rank": 4},{"img": '6_of_clubs.png',"rank": 5},{"img": '7_of_clubs.png',"rank": 6},{"img": '8_of_clubs.png',"rank": 7},{"img": '9_of_clubs.png',"rank": 8},{"img": '10_of_clubs.png',"rank": 9},{"img": 'jack_of_clubs.png',"rank": 10},{"img": 'queen_of_clubs.png',"rank": 11},{"img": 'king_of_clubs.png',"rank": 12},{"img": 'ace_of_clubs.png',"rank": 13},
 
   ]
     var suitType = Math.ceil(Math.random() * 1)
       var card = Math.floor(Math.random() * 12)
           var selectedCard //storing selected card
           
      if (suitType == "1"){   //Clubs
          
           console.log(JSON.stringify([arrClubs[rank]]))
           //selectedCard = arrClubs[card]
   
       }else if(suitType == "2"){ //Diamonds

          // console.log(arrDiamonds[card])
           //selectedCard = arrDiamonds[card]
   
       } else if (suitType == "3"){ //Hearts
   
          // console.log(arrHearts[card])
           //selectedCard = arrHearts[card]
        
       } else { //Spades
          
          // console.log(arrSpades[card])
          // selectedCard = arrSpades[card]
        
       }
              document.getElementById('p1Card').src = "./images/cards/" + selectedCard

 <img src="./images/cards/black_joker.png" height="300px" id="p1Card">
    <img src="./images/cards/red_joker.png" height="300px" id="p2Card">

First of all, make a general rule to mostly use "===" and convert other values to the same type or check for its type and all to avoid surprises. Also, I can see the object printing in the snippet — innocent
– innocent, Commented Nov 19, 2022 at 17:01
I need the property in the object. It's coming back as undefined when I do arrClubs.rank — Alexis
– Alexis, Commented Nov 19, 2022 at 17:02
you just want is console.log(JSON.stringify([arrClubs[card].rank])) — vinesh_dodiya
– vinesh_dodiya, Commented Nov 19, 2022 at 17:05
Ok. You are stringifying the value so its acting like a string. Remove the stringify and also you need to loop over the array or access a specific Object from the array of objects and then access rank over them. eg: arrClubs[0].rank — innocent
– innocent, Commented Nov 19, 2022 at 17:06

Aniket Raj · Accepted Answer · 2022-11-19 17:02:26Z

1

Here you can try this logic :

var arrClubs = [
    {"img": '2_of_clubs.png',"rank": 1},{"img": '3_of_clubs.png',"rank": 2},
 ];
 
 console.log(arrClubs[0].rank)

answered Nov 19, 2022 at 17:02

Aniket Raj

2,1291 gold badge8 silver badges17 bronze badges

Sign up to request clarification or add additional context in comments.

Comments

Metro Smurf · Accepted Answer · 2022-11-19 17:00:17Z

1

There's no need to stringify the array, you can simply log it:

var arrClubs = [
    {"img": '2_of_clubs.png',"rank": 1},{"img": '3_of_clubs.png',"rank": 2},{"img": '4_of_clubs.png',"rank": 3},{"img": '5_of_clubs.png',"rank": 4},{"img": '6_of_clubs.png',"rank": 5},{"img": '7_of_clubs.png',"rank": 6},{"img": '8_of_clubs.png',"rank": 7},{"img": '9_of_clubs.png',"rank": 8},{"img": '10_of_clubs.png',"rank": 9},{"img": 'jack_of_clubs.png',"rank": 10},{"img": 'queen_of_clubs.png',"rank": 11},{"img": 'king_of_clubs.png',"rank": 12},{"img": 'ace_of_clubs.png',"rank": 13}
]

console.log(arrClubs)

Or better yet, throw it into a table:

console.table(arrClubs)

answered Nov 19, 2022 at 17:00

Metro Smurf

38.5k20 gold badges117 silver badges146 bronze badges

Comments

tstrmn · Accepted Answer · 2022-11-19 17:04:37Z

0

It's not necessary to use JSON.stringify for console logs.

If you want to log the whole array, use: console.log(arrClubs).

To only log the first rank value: console.log(arrClubs[0].rank).

To log all ranks, you could create an array with those values with like this:

const ranks = arrClubs.map(item => item.rank);
console.log(ranks);

answered Nov 19, 2022 at 17:04

tstrmn

3812 silver badges11 bronze badges

Collectives™ on Stack Overflow

How to console log object data in javascript?

3 Answers 3

Comments

Comments

Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

3 Answers 3

Comments

Comments

Comments

Your Answer

Sign up or log in

Post as a guest

Related