Creating Game Cards

Question

Problem with creating objects in JavaScript.

Trying to create a deck of playing cards, which I can display, however, I want. I am well versed in HTML materials to show them, just having a problem that understands what I'm doing wrong in JavaScript, which only creates undefined maps for me.

(function () { function Card (rank, suit) { this.rank = rank; this.suit = suit; }; function Deck() { this.deck = new Array(); this.makeDeck = makeDeck; this.shuffle = shuffle; this.deal = deal; } function makeDeck() { var ranks = new Array("A", "2", "3", "4", "5", "6", "7", "8", "9", "10", "J", "Q", "K"); var suits = new Array("Clubs", "Diamonds", "Hears", "Spades"); this.deck = new Array(52); var i, j; for (i = 0; i < suits.length; i++) { for (j = 0; j < ranks.length; j++) { this.deck[i*ranks.length + j] = new Card(ranks[j], suits[i]); document.write("Card made \n"); } } }; function shuffle() { var i, n, j, temp; for (i = 0; i < n; i++) { for (j = 0; j < this.deck.length; j++) { k = Math.floor(Math.random() * this.deck.length); temp = this.deck[j]; this.deck[j] = this.deck[k]; this.deck[k] = temp; } } document.write("Cards Shuffled"); }; function deal() { if (this.deck.length > 0) { return this.deck.shift(); } else return null; }; var deck = new Deck(); deck.makeDeck(); deck.shuffle(); for (i = 0; i < 2; i++) { for (j = 0; j < 5; j++) { var Card = new Card(deck.deal); var c = JSON.stringify(Card); document.write(this.deck[j]); } } } ()); 

Answer 1

This is the problem line:

this.deck = new Card(ranks[j], suits[i]);

this.deck should be an array that includes all of your cards, but with the line above, you redefine it every time with a new new map.

You have 2 options:

First option

Instead of this.deck = new Array(52) , use this.deck = [] instead, initializing an empty this.deck array.

Then use this.deck.push(new Card(ranks[j], suits[i])) to pull all the card combinations into the deck.

Second option

The problem with the first option is that array.push not very efficient. Read this for more details. That would not matter for an array of size 52, just placing it on the table for each information.

Alternatively, you can use this.deck[i] = new Card(ranks[j], suits[i]) to populate the array. You can use this.deck = [] or this.deck = new Array(52) for this. Or everything will work.

Answer 2

In your "main" part of execution:

 var deck = new Deck(); deck.makeDeck(); deck.shuffle(); for (i = 0; i < 2; i++) { for (j = 0; j < 5; j++) { var Card = new Card(deck.deal); var c = JSON.stringify(Card); document.write(this.deck[j]); } } 

A few things to note.

• Change var Card to var Card = new Card(deck.deal); since the Card variable overrides the Card function after the first iteration.
• deck.deal is a function. You need deck.deal return value, so you should use deck.deal()
• document.write(this.deck[j]); - Instead, use deck.deck[j] , because you need to access the deck that you initialized in var deck , and to access the actual deck of cards you need access to the properties of the deck of objects. Therefore you need to use deck.deck[j]

Answer 3

I am not an expert in JS, but one thing that calls me is for this loop to assign this.deck = new Card(ranks[j], suits[i]); should also not be indexed when creating maps, as in:

 for (i = 0; i < suits.length; i++) { for (j = 0; j < ranks.length; j++) { this.deck[ranks.length*i+j] = new Card(ranks[j], suits[i]); } } 

Perhaps that’s why you don’t have the deck you wanted to form.