ブラックジャックのプログラムにおいて、MVCを参考に入出力処理を分離したい

オブジェクト指向の勉強として、JavaScriptでトランプを作成しています。  
手始めにブラックジャックを作っていますが、今後別のゲームを作ることも考えて拡張性のある作りにしたいです。
これまで作ったプログラムは以下のようになっています。

const $ = require('jquery');

// カードクラス
class Card {
  constructor(suit, rank = 0) {
    this._suits = ['joker', 'spades', 'hearts', 'diamonds', 'clubs'];

    this.suit = suit;
    this.rank = rank;
    this.isFront = false;
    this.imgSrc = (suit === 0) ? `joker.png` : `${this._suits[suit]}_${this._convertRank(rank)}.png`;
  }

  // カードを表にする
  faceUp() {
    this.isFront = true;
  }

  // カードを裏にする
  faceDown() {
    this.isFront = false;
  }

  // ランクを適切な表示に変更
  _convertRank(rank) {
    const result =
      rank === 1 ? 'A' :
      rank === 11 ? 'J' :
      rank === 12 ? 'Q' :
      rank === 13 ? 'K' :
      rank;
    return result;
  }
}

// 手札クラス
class Hand {
  constructor(cards) {
    this.cards = cards;
  }

  // 受け取ったカードを加える
  pushCard(card) {
    this.cards.push(...card);
  }

  // 指定された枚数のカードを取り出す
  popCard(count = 1) {
    let result = [];
    for (let i = 0; i < count; i++) {
      result.push(this.cards.pop());
    }
    return result;
  }

  // 指定したスート・ランクのカードを取り出す
  selectCard(suit, rank) {
    let result = this.cards.find((elm) => {
      return elm.suit === suit && elm.rank === rank;
    });
    return result;
  }

  // 全てのカードを表にする
  faceUpAll() {
    for (let card of this.cards) {
      card.faceUp();
    }
  }

  // 全てのカードを裏にする
  faceDownAll() {
    for (let card of this.cards) {
      card.faceDown();
    }
  }

  // カードをシャッフルする
  shuffleCard() {
    for (let i = this.cards.length - 1; i > 0; i--) {
      let rand = Math.floor(Math.random() * (i + 1));
      [this.cards[i], this.cards[rand]] = [this.cards[rand], this.cards[i]];
    }
  }
}

// 山札クラス
class Deck extends Hand {
  constructor(joker) {
    let cards = [];

    // ジョーカー以外を生成
    for (let i = 1; i <= 4; i++) {
      for (let j = 1; j <= 13; j++) {
        cards.push(new Card(i, j));
      }
    }

    // 引数で指定した枚数のジョーカーを生成
    for (let i = 0; i < joker; i++) {
      cards.push(new Card(0));
    }

    super(cards);
    this.shuffleCard();
  }
}

// プレイヤークラス
class Player {
  constructor(name, hand) {
    this.name = name;
    this.hand = hand;
    this._points = this._calculatePoints();
  }

  // 合計点数を取得
  get points() {
    return this._calculatePoints();
  }

  // 合計点数を計算
  _calculatePoints() {
    let points = 0;
    let aceCount = 0;
    for (let card of this.hand.cards) {
      points += (() => {
        switch (card.rank) {
          case 11:
          case 12:
          case 13:
            return 10;
          case 1:
            aceCount++;
            return 11;
          default:
            return card.rank;
        }
      })();
    }
    while (points > 21 && aceCount > 0) {
      aceCount--;
      points -= 10;
    }
    return points;
  }
}

// ゲームクラス
class Game {
  constructor(...players) {
    // カード1式
    this.deck = new Deck(1);

    // ディーラー
    this.dealer = new Player('ディーラー', new Hand(this.deck.popCard(2)));
    this.dealer.hand.cards[0].faceUp();

    // プレイヤー
    this.players = [];
    for (let playerName of players) {
      const player = new Player(playerName, new Hand(this.deck.popCard(2)));
      player.hand.faceUpAll();
      this.players.push(player);
    }

    // プレイヤー・ディーラー
    this.everyone = [this.dealer, ...this.players];

    // 順番
    this.nowTurn = 0;

    this._outputScreen();
    this._modifyScreen();
  }

  // ヒット時の処理
  hit(player) {
    player.hand.pushCard(this.deck.popCard());
    player.hand.faceUpAll();
    this._modifyScreen();
  }

  // CPUのターン
  cpuTurn() {
    setTimeout(() => {
      const turn = this.nowTurn;
      if (turn < this.players.length) {
        if (this.players[turn].points < 18) {
          this.hit(this.players[turn]);
        } else {
          this.nowTurn++;
        }
        this.cpuTurn();
      } else {
        this.dealerTurn();
      }
    }, 500);
  }

  // ディーラーのターン
  dealerTurn() {
    setTimeout(() => {
      this.dealer.hand.faceUpAll();
      this._modifyScreen();
      if (this.dealer.points < 17) {
        this.hit(this.dealer);
        this.dealerTurn();
      } else {
        this._modifyResult();
      }
    }, 500);
  }

  // コンテンツを挿入
  _outputScreen() {
    let content = '';
    this.everyone.forEach((player, index) => {
      const className = index === 0 ? 'dealer' : 'seat' + index;
      content += `<dl class="${className}">`;
      content += `<dt class="name">${player.name}</dt>`;
      content += '<dd class="hand"><ul></ul></dd>';
      content += `<dd class="points"></dd>`;
      content += '<dd class="result"></dd>';
      content += '</dl>';
    });
    $('.game_screen').html(content);
    $('.seat1 .points').after(
      '<dd class="button"><button class="hit_button">ヒット</button> ' +
      '<button class="stand_button">スタンド</button></dd>'
    );
  }

  // コンテンツを更新
  _modifyScreen() {
    this.everyone.forEach((player, index) => {
      const className = index === 0 ? '.dealer' : '.seat' + index;
      const $target = $(className);
      let content = '';
      for (let card of player.hand.cards) {
        const imgSrc = card.isFront ? card.imgSrc : 'back_blue.png';
        content += `<li><img src="img/${imgSrc}"></li>`;
      }
      $('.hand ul', $target).html(content);
      $('.points', $target).html(`合計点数: ${player.points}`);

      // バスト時の表示
      if (player.points > 21) {
        $('.points', $target).append(' BUST').css('color', '#f00');
        if (index === 1) $(`.seat1 .button`).remove();
      }
    });
  }

  // 勝敗を判定
  _getResult(player) {
    const dealer = this.dealer.points;
    if (player > 21) return 'Lose...';
    if (dealer > 21) return 'Win!!';
    if (player > dealer) return 'Lose...';
    if (player < dealer) return 'Win!!';
    return 'Draw Game';
  }

  // 結果を表示
  _modifyResult() {
    this.players.forEach((player, index) => {
      $(`.seat${index + 1} .result`).html(this._getResult(player.points));
    });
  }
}

// メイン処理
$(() => {
  const game = new Game('プレイヤー', 'CPU1', 'CPU2');

  // デバッグ用にconsoleに山札の一覧をテーブルで表示
  console.table(game.deck.cards);

  // ヒット
  $('.hit_button').on('click', () => {
    game.hit(game.players[0]);
    if (game.players[0].points > 21) {
      game.cpuTurn();
    }
  });

  // スタンド
  $('.stand_button').on('click', () => {
    game.cpuTurn();
    $(`.seat1 .button`).remove();
  });
});

現状はGameクラスにあらゆる処理を詰め込んでおり、自分でも訳が分からなくなりつつあります。
そこで、MVCなるものを参考にして入出力処理を切り分けようと考えました。
しかし、サイトによって書いてあることが異なっていたり、参考になるコードが見つからなかったりでいまいち理解できていません。
自分なりの解釈ですが、以下のようなイメージで合っているでしょうか。

Model
各データと、それらを処理するメソッドを持つ

View
modelの参照、データを加工し出力するメソッドを持つ

Controller
model・viewの参照、それらのメソッドを順番に実行するメソッドを持つ

// Modelクラス
class Model {
  constructor(data1, data2) {
    this.data1 = data1;
    this.data2 = data2;
  }
  hoge() {
    this.data1++;
  }
  fuga() {
    this.data2--;
  }
}

// Viewクラス
class View {
  constructor(model) {
    this.model = model;
  }
  piyo() {
    console.log(this.model.data1);
    console.log(this.model.data2);
  }
}

// Controllerクラス
class Controller {
  constructor(model, view) {
    this.model = model;
    this.view = view;
  }
  clickBtn() {
    this.model.hoge();
    this.model.fuga();
    this.view.piyo();
  }
}

// メイン処理
$(() => {
  const model = new Model(3, 6);
  const view = new View(model);
  const controller = new Controller(model, view);

  $('.btn').on('click', () => {
    controller.clickBtn();
  });
});

また、他にもオブジェクト指向としておかしな部分があればご教授いただけたら幸いです。