Requesting Feedback on my CodePen Game

Code Feedback
1

Hello,

I recently made a Blackjack Game on CodePen.

If you could spare a moment to check it out, I could really use some feedback on:

#1: How to make the code cleaner and run more efficiently. The code I wrote is a brute force, spaghetti mess.

#2: How to make the CSS look more professional. The interface looks like it was made by a 1st grader on MS Paint. Are there any specific design tips and tricks that could help?

Thank you.

2

Referring to cards array(line 38):

url addresses for cards almost the same.

Instead of having the whole URL for each card, you can use literals

`https://www.improvemagic.com/wp-content/uploads/2020/11/${card-url}.png`

that way, you need to store card id-s only, and generate array of links by looping through card’s id-s

referring to switch case - there is definitely some pattern, I mean:
cases for returning 11 >>> 0, 13, 26, 39
cases for returning 2 >>> 1, 14, 27, 40

probably could utilize some of those and make this part of code bit more compact

lines 149 -166

when you have two very similar functions, try to think if it makes sense to bake one function from those, to avoid repetitions. It is not always makes sense, because sometimes it decreases readability of code, but it is a thing to consider

1 Like
4

These are great ideas. So the array would only store [11/k2, 11/k3...], and as for the switch cases, maybe:

switch(index) { 
  case (index % 13 === 0):
  return 11;
  break;
  case (index % 13 === 1):
  return 2;
  break;
  case (index % 13 === 3):
  return 3;
  break;
}

...etc

I think that should work.

Thank you for this advice. Absolute gold.

5

I would try and test this at least.

And I would use if …else here maybe, because all this:

case 9:
     case 22:
     case 35:
     case 48:
     case 10:
     case 23:
     case 36:
     case 49:
     case 11:
     case 24:
     case 37:
     case 50:
     case 12:
     case 25:
     case 38:
     case 51:
     return +10;
     break;

can be replaced just by else {...

General advice - go through code and see for repetitions.

for example:
in endGame() function
it looks like you’re using this: betAmount.textContent = 0; inside every if block
so maybe it should be just one line outside of if block?

stuff like that.

But be careful, it’s easy to break things when you’re refactoring like that.

1 Like
7

This is all excellent advice. Thank you very much.

9

@RandellDawson

Wow thank you for all the advice.

The DRY thing is great. For the reset() and next() functions, this would look a lot better:

function reset() {
  next();
  playerCash.textContent = 100;
}

I dont know what I was thinking with genCard(). I shouldn’t be checking for undefined. If anything, I should be checking if the index is -1. In an earlier version, I did this:

function genCard() {
  let cardIndex = Math.floor(Math.random() * 52);
  while (dealtCards.indexOf(cardIndex) !== -1) {
    cardIndex = Math.floor(Math.random() * 52);
  }
  dealtCards.push(cardIndex);
  return cardIndex;
}

But the while loop slowed the program down a lot. It lagged for like 5 seconds.

The shuffling algorithm sounds super slick. I would never have come up with something like that in a million years. I’m going to try that out.

Great catch on the Blackjack rules. I had completely forgotten about the 3:2 payout. Also, I didn’t know about the no-doubling-down-after-being-dealt-a-third-card rule.

Thank you for taking the time to provide this feedback.

11

This topic was automatically closed 182 days after the last reply. New replies are no longer allowed.