Question

所以我在HTML5 Canvas上做了一个小游戏。我有一个显示在画布上的图像数组和一个按钮（它只是一个事件监听器，用于检查是否单击了画布的某个区域。）单击此按钮时，我想要一个随机图像被选中这样我就可以让它执行一项任务（运行一个函数，一个动画，我将在随机选择被排序后实现）。

我假设我可以使用math.random（）的某些变体来随机选择图像，但是我首先需要将每个图像分配给一个值，例如如果有5张图片，0到4？

这是数组代码：

        var imageArray = new Array();
        imageArray[0] = "./assets/1.png";
        imageArray[1] = "./assets/2.png";
        imageArray[2] = "./assets/3.png";
        imageArray[3] = "./assets/4.png";
        imageArray[4] = "./assets/5.png";

        var box = new Image();
        box.onload = function () {
            ctx.drawImage(box, 50, 180, 150, 133);
            ctx.drawImage(box, 220, 180, 150, 133);
            ctx.drawImage(box, 390, 180, 150, 133);
            ctx.drawImage(box, 50, 320, 150, 133);
            ctx.drawImage(box, 220, 320, 150, 133);
            ctx.drawImage(box, 390, 320, 150, 133);
            ctx.drawImage(box, 50, 460, 150, 133);
            ctx.drawImage(box, 220, 460, 150, 133);
            ctx.drawImage(box, 390, 460, 150, 133);
        };
        box.src = imageArray[4];

Answer 1

要获得随机整数，您可以执行以下操作：

Math.floor(Math.random() * max);

其中max是您要生成的最大数量，或者是您的数组长度。如果max为4，则可能的输出为0, 1, 2, 3。

Answer 2

你可以尝试这样的事情：

Math.floor(Math.random()*imageArray.length)

它会给你一个介于0和数组长度之间的随机数

看看这个，它可以帮到你 Generating random whole numbers in JavaScript in a specific range?

从数组中挑选一个随机项？

2 个答案: