如何随机化JS然后重复？

Question

我的代码可以将牌组随机化到永远不会抽出同一张牌的程度。抽取一张牌后，它会将其从阵列中移除。问题是，一旦所有的牌都被抽出，它就会进入 "Null"，我宁愿它只是重新随机化牌组并再次回到开始。

有办法吗？

var cards = [
    'clubs-ace',
    'clubs-2',
    'clubs-3',
    'clubs-4',
    'clubs-5',
    'clubs-6',
    'clubs-7',
    'clubs-8',
    'clubs-9',
    'clubs-10',
    'clubs-jack',
    'clubs-queen',
    'clubs-king',
    'diamonds-ace',
    'diamonds-2',
    'diamonds-3',
    'diamonds-4',
    'diamonds-5',
    'diamonds-6',
    'diamonds-7',
    'diamonds-8',
    'diamonds-9',
    'diamonds-10',
    'diamonds-jack',
    'diamonds-queen',
    'diamonds-king',
    'hearts-ace',
    'hearts-2',
    'hearts-3',
    'hearts-4',
    'hearts-5',
    'hearts-6',
    'hearts-7',
    'hearts-8',
    'hearts-9',
    'hearts-10',
    'hearts-jack',
    'hearts-queen',
    'hearts-king',
    'spades-ace',
    'spades-2',
    'spades-3',
    'spades-4',
    'spades-5',
    'spades-6',
    'spades-7',
    'spades-8',
    'spades-9',
    'spades-10',
    'spades-jack',
    'spades-queen',
    'spades-king'
];
var kingsCup = 0;
var gameComplete = false;

function drawCard() {
    if (gameComplete == false) {
        var randomNumber = Math.floor(Math.random() * (cards.length - 1));
        cards = cards.filter((e, i) => i !== randomNumber);
        console.log(cards.length);
        console.log(cards[randomNumber]);
        document.getElementById("cards").src = 'assets/js/games/cards/' + cards[randomNumber] + '.png';

        switch(cards[randomNumber]) {
            case "clubs-ace":
                document.getElementById("task").innerHTML = "Waterfall!";
            break;
            case "clubs-2":
                document.getElementById("task").innerHTML = "Pick someone to drink."
            break;
            case "clubs-3":
                document.getElementById("task").innerHTML = "Take a drink.";
            break;
            case "clubs-4":
                document.getElementById("task").innerHTML = "Last to touch the floor drinks.";
            break;
            case "clubs-5":
                document.getElementById("task").innerHTML = "All guys drink.";
            break;
            case "clubs-6":
                document.getElementById("task").innerHTML = "All chicks drink.";
            break;
            case "clubs-7":
                document.getElementById("task").innerHTML = "Last to reach for the sky drinks.";
            break;
            case "clubs-8":
                document.getElementById("task").innerHTML = "Pick a mate that will drink anytime you drink.";
            break;
            case "clubs-9":
                document.getElementById("task").innerHTML = "Rhyme";
            break;
            case "clubs-10":
                document.getElementById("task").innerHTML = "Categories";
            break;
            case "clubs-jack":
                document.getElementById("task").innerHTML = "Everyone must drink.";
            break;
            case "clubs-queen":
                document.getElementById("task").innerHTML = "You're now the question master.";
            break;
            case "clubs-king":
                kingsCup = kingsCup + 1;
                if (kingsCup < 4) {
                    document.getElementById("task").innerHTML = "KING! Add a dash of your drink to the kings cup!";
                }
                else {
                    gameComplete = true;
                    document.getElementById("task").innerHTML = "GAME OVER! You must down the kings cup!";
                }
            break;
            case "diamonds-ace":
                document.getElementById("task").innerHTML = "Waterfall!";
            break;
            case "diamonds-2":
                document.getElementById("task").innerHTML = "Pick someone to drink."
            break;
            case "diamonds-3":
                document.getElementById("task").innerHTML = "Take a drink.";
            break;
            case "diamonds-4":
                document.getElementById("task").innerHTML = "Last to touch the floor drinks.";
            break;
            case "diamonds-5":
                document.getElementById("task").innerHTML = "All guys drink.";
            break;
            case "diamonds-6":
                document.getElementById("task").innerHTML = "All chicks drink.";
            break;
            case "diamonds-7":
                document.getElementById("task").innerHTML = "Last to reach for the sky drinks.";
            break;
            case "diamonds-8":
                document.getElementById("task").innerHTML = "Pick a mate that will drink anytime you drink.";
            break;
            case "diamonds-9":
                document.getElementById("task").innerHTML = "Rhyme";
            break;
            case "diamonds-10":
                document.getElementById("task").innerHTML = "Categories";
            break;
            case "diamonds-jack":
                document.getElementById("task").innerHTML = "Everyone must drink.";
            break;
            case "diamonds-queen":
                document.getElementById("task").innerHTML = "You're now the question master.";
            break;
            case "diamonds-king":
                kingsCup = kingsCup + 1;
                if (kingsCup < 4) {
                    document.getElementById("task").innerHTML = "KING! Add a dash of your drink to the kings cup!";
                }
                else {
                    gameComplete = true;
                    document.getElementById("task").innerHTML = "GAME OVER! You must down the kings cup!";
                }
            break;
            case "hearts-ace":
                document.getElementById("task").innerHTML = "Waterfall!";
            break;
            case "hearts-2":
                document.getElementById("task").innerHTML = "Pick someone to drink.";
            break;
            case "hearts-3":
                document.getElementById("task").innerHTML = "Take a drink.";
            break;
            case "hearts-4":
                document.getElementById("task").innerHTML = "Last to touch the floor drinks.";
            break;
            case "hearts-5":
                document.getElementById("task").innerHTML = "All guys drink.";
            break;
            case "hearts-6":
                document.getElementById("task").innerHTML = "All chicks drink.";
            break;
            case "hearts-7":
                document.getElementById("task").innerHTML = "Last to reach for the sky drinks.";
            break;
            case "hearts-8":
                document.getElementById("task").innerHTML = "Pick a mate that will drink anytime you drink.";
            break;
            case "hearts-9":
                document.getElementById("task").innerHTML = "Rhyme";
            break;
            case "hearts-10":
                document.getElementById("task").innerHTML = "Categories";
            break;
            case "hearts-jack":
                document.getElementById("task").innerHTML = "Everyone must drink.";
            break;
            case "hearts-queen":
                document.getElementById("task").innerHTML = "You're now the question master.";
            break;
            case "hearts-king":
                kingsCup = kingsCup + 1;
                if (kingsCup < 4) {
                    document.getElementById("task").innerHTML = "KING! Add a dash of your drink to the kings cup!";
                }
                else {
                    gameComplete = true;
                    document.getElementById("task").innerHTML = "GAME OVER! You must down the kings cup!";
                }
            break;
            case "spades-ace":
                document.getElementById("task").innerHTML = "Waterfall!";
            break;
            case "spades-2":
                document.getElementById("task").innerHTML = "Pick someone to drink.";
            break;
            case "spades-3":
                document.getElementById("task").innerHTML = "Take a drink.";
            break;
            case "spades-4":
                document.getElementById("task").innerHTML = "Last to touch the floor drinks.";
            break;
            case "spades-5":
                document.getElementById("task").innerHTML = "All guys drink.";
            break;
            case "spades-6":
                document.getElementById("task").innerHTML = "All chicks drink.";
            break;
            case "spades-7":
                document.getElementById("task").innerHTML = "Last to reach for the sky drinks.";
            break;
            case "spades-8":
                document.getElementById("task").innerHTML = "Pick a mate that will drink anytime you drink.";
            break;
            case "spades-9":
                document.getElementById("task").innerHTML = "Rhyme";
            break;
            case "spades-10":
                document.getElementById("task").innerHTML = "Categories";
            break;
            case "spades-jack":
                document.getElementById("task").innerHTML = "Everyone must drink.";
            break;
            case "spades-queen":
                document.getElementById("task").innerHTML = "You're now the question master.";
            break;
            case "spades-king":
                kingsCup = kingsCup + 1;
                if (kingsCup < 4) {
                    document.getElementById("task").innerHTML = "KING! Add a dash of your drink to the kings cup!";
                }
                else {
                    gameComplete = true;
                    document.getElementById("task").innerHTML = "GAME OVER! You must down the kings cup!";
                }
            break;
        }
        document.getElementById("kingCount").innerHTML = 4 - kingsCup + " Kings Remaining";
    }

}

我让游戏在抽到最终国王时结束，但我想在不刷新页面的情况下继续游戏。

[编辑：已添加完整源代码]

Answer 1

一开始，让我们在 cards 数组下创建一个新数组，名为 currentDeck

var currentDeck = [...cards];

然后在 drawCard() 函数中，让我们用刚刚创建的 currentDeck 数组替换 cards 数组。这将使我们能够在不触及我们存储为 cards 的所有卡片列表的情况下从牌组中移除卡片。

当游戏结束时，您可以添加一个 else 语句，其中 gameComplete 为真，它将 currentDeck 数组重置为 cards 数组，就像我们之前所做的那样。

var currentDeck = [...cards];

cards 绝不能修改

Answer 2

这是一个使用 rando.js's randoSequence function to simplify the random shuffling. It also uses a ternary operator and the javascript pop() 方法的解决方案。它会打乱 cards 并将打乱的内容存储在 shuffled 中。然后它会在抽牌时一次从 shuffled 中移除一个，并在用完时用 cards 值的新洗牌版本重新填充 shuffled 变量。

var cards = ["a", "b", "c"], shuffled = [];
var drawCard = () => (shuffled = shuffled.length ? shuffled : randoSequence(cards)).pop().value;

//Log the results to show it works...
for(var i = 0; i < 10; i++) console.log(drawCard());

<script src="https://randojs.com/1.0.0.js"></script>

如何随机化JS然后重复？

How to randomize JS and then repeat?

javascript

random

playing-cards