Javascript:如何检查所有三个变量是否不同？

Question

我正在为大学做一个网站项目，我想在网站上显示三张图片。我的文件夹中存储了10张图片(全部名为“slika 1 to 10”，脚本有三个变量，它们都随机生成一个1到10之间的数字，然后显示图片“slika”+randomNumber。

如何检查所有三个变量是否不同，以便每次刷新网站时这三张图片始终不同。

JS代码:

window.onload=odaberiSliku;

var broj1=Math.floor(Math.random() * 10) +1;
var broj2=Math.floor(Math.random() * 10) +1;
var broj3=Math.floor(Math.random() * 10) +1;

    function odaberiSliku() {
        document.getElementById("slika1").src = "slike/randomslike/slika"+broj1+".jpg";
        document.getElementById("slika2").src = "slike/randomslike/slika"+broj2+".jpg";
        document.getElementById("slika3").src = "slike/randomslike/slika"+broj3+".jpg";
    }

如果有人想知道，变量名称是克罗地亚语。

Answer 1

同时Lux's answer完全没问题，如果您 (1) 生成 n 长度的动态列表和/或 (2) 如果列表变得非常大，则它不可扩展。

有一种更简单的方法可以实现您想要做的事情。您基本上是在尝试生成唯一的随机数 - 这类似于生成唯一的增量数字数组并对它们进行洗牌。

我相信这种方法会更好地为您服务，而不是通过反复试验的方法根据预先存在的列表来测试每个随机生成的数字。

您所需要的只是:

1. generate a simple array ，比如 1-10(上限应与您拥有的图像数量相对应)，
2. shuffle it ,
3. 取打乱数组中的前 3 个元素
4. 迭代切片数组
5. 将每个数字连接到 URL 模板
6. 将其分配给您选择的元素

概念验证代码如下:

var imageCount = 10,
    arr = new Array(imageCount).join().split(',').map(function(item, index) {
        return ++index;
    }),
    shuffle = function(a) {
        var j, x, i;
        for (i = a.length; i; i -= 1) {
            j = Math.floor(Math.random() * i);
            x = a[i - 1];
            a[i - 1] = a[j];
            a[j] = x;
        }
    };

// Shuffle the array
shuffle(arr);

// Get first 3 elements
var sliced = arr.slice(0, 3);

// Iterate through first 3 elements, and assign image source
for (var i = 0; i < sliced.length; i++) {
  document.getElementById("slika" + i).src = "slike/randomslike/slika" + sliced[i] + ".jpg";
}