Запоминание позиций при удалении записей в JavaScript

Question

Я создаю карточную игру, которая должна иметь следующую функциональность:

1. 3 Карты попадают на игровое поле на позиции 0, 1 и 2 -> [0] [1] [2]
2. Пользователь может выбрать одну из карт
3. Выбранную карту необходимо удалить, а оставшиеся две карты необходимо поднять на более высокую позицию.Затем новая позиция должна быть добавлена ​​в позицию 0.

Примеры ([X] пустая / несуществующая карта):

• Пользователь выбирает карту в позиции 2 -> [0] [1] [2]
• Пользователь выбирает карту в позиции 0 -> [0] [X] [2] [3]
• Пользователь выбирает карту в позиции 1 ->[0] [1] [X] [3]

Идея состоит в том, что всякий раз, когда карта попадает в положение 5, никакие другие карты, кроме этой, не могут быть выбраны.Я немного растерялся, как его создать, поэтому буду признателен за любую помощь.

В настоящее время я получил следующий код для добавления карты на доску:

 function addCardToBoard() {
    let curCard = myDeck.getCard();
    let cardHtml = "<div class='card'>" + curCard.category + "<br>" + curCard.method + "</div>";
    $(cardHtml).prependTo("#cards").on("click", function() { 
        $(this).remove();
        clickCard(curCard); 
    });
}

иметод function clickCard(myCard){} для обнаружения клика по определенной карте.

Answer 1

Это исправило проблему.Создание массива и добавление элементов и последующая отправка индекса карты вместо самой карты.

function addCardToBoard() {
        let curCard = myDeck.getCard();
        cardsArray.unshift(curCard);
        let cardHtml = "<div class='card'>" + curCard.category + "<br>" + curCard.method + "</div>";
        $(cardHtml).prependTo("#cards").on("click", function() { 
            $(this).remove();
            clickCard(cardsArray.indexOf(curCard)); 
        });
    }