JSFiddle - React, Tailwind, and code Playground

by denniswaltermartinez

Babel + JSX

class Card {
  constructor(name, value, alias = '') {
    this.name = name
    this.value = value
    this.alias = alias
  }
}

class Deck {
  constructor() {
    this.deck = this.generateDeck()
  }

  generateDeck() {
    const suits = ['clubs', 'diamonds', 'hearts', 'spades']
    const numberPerSuit = 13
    let deck = []

    for (let i = 0; i < suits.length; i++) {
      for (let x = 1; x <= numberPerSuit; x++) {

        deck = [...deck, new Card(suits[i], x, this.getFaceValueAlias(x))]
      }
    }
    
    // Shuffle
    deck.sort(() => Math.random() - 0.5)
    
    return deck
  }

  getFaceValueAlias(number) {
    switch (number) {
      case 1: return 'Ace';
      case 11: return 'Jack';
      case 12: return 'Queen';
      case 13: return 'King';
    }
  }

  draw(numberOfCards = 1) {
  	if (this.deck.length < 1) return `You can't draw any more. No cards remaining!`
    
    return this.deck.splice(1, numberOfCards)
  }
  
  remaining() {
  	return this.deck.length > 1 ? this.deck : 'No more cards remaining'
  }
}

const deck = new Deck()
console.log(deck.remaining())

const hand = deck.draw(4)
console.log(hand)
console.log(deck.remaining())

const hand2 = deck.draw(4)
console.log(deck.remaining())