Question

我试图生成随机数来从数组中挑选随机项来更新图片拼贴，我注意到有时生成的数字与先前生成的数字相同，导致一张图片更新2-3次，所以检查这个我认为如果我将最后生成的随机数存储到变量中并创建一个检查最后生成的值是否等于的函数，那将会很棒当前生成的值，它会继续生成数字，直到生成不相等的值。

它工作正常，直到我想要多个实例...作为存储最后一个值的变量是相同的，我得到相同的数字。

var bgs = document.getElementById('collage').getElementsByClassName('bg');
var images = [1, 2, 3, 4, 5, 6, 7, 8, 9, 10];

var lv = null;
function get_random(length) {
    arr = [];
    while (arr.length < 1) {
        var cv = Math.floor(Math.random() * length);
        if (lv === cv) {
            arr = [];
            continue;
        }
        else if (lv !== cv) {
            arr.push(cv);
            break;
        }
    }
    lv = arr[0];
    return arr[0];
}

function update_collage() {
    var img = images[get_random(images.length)];
    var target = bgs[get_random(bgs.length)];
    target.style.background = "url('assets/img/thumbs/" + img + ".jpg') no-repeat center";
    target.style.backgroundSize = "cover";
}
window.setInterval(function(){
    update_collage();
}, 1200);

我怎样才能纠正这个问题，如何创建多个函数或变量实例

Answer 1

我建议使用生成器函数并根据需要实例化它：

// Generate pairwise unique random numbers < max:  
function* generate_random(max) {
  let prev;
  while (true) {
    let next = Math.floor(Math.random() * max);
    if (prev === next) continue;
    yield prev = next;
  }
}

// Example:
let generators = [generate_random(3), generate_random(3)];

for (let i = 0; i < 10; ++i) {
  // Both generators run independently:
  console.log(generators[0].next().value, generators[1].next().value);
}

在您的代码中，您可以例如取代

var img = images[get_random(images.length)];
var target = bgs[get_random(bgs.length)];

与

var img = images[generators[0].next().value];
var target = bgs[generators[1].next().value];

，其中

var generators = [generate_random(images.length), generate_random(bgs.length)];

如何在JavaScript中创建多个实例

1 个答案: