随机播放 JavaScript 数组

Question

伙计们。我正在制作一个记忆游戏，为了实现它，我不得不以某种方式在 Array 中随机播放图像。我在 Stack Overflow 上找到了一个旧答案，Fisher–Yates shuffle，并使用了它，它有效但我不明白如何。有人可以逐步解释这段代码中每个元素代表什么吗？特别是第一行，一个变量中怎么会有三个值。谢谢。

function shuffle(array) {
  var currentIndex = array.length, temporaryValue, randomIndex;

  // While there remain elements to shuffle...
  while (0 !== currentIndex) {

    // Pick a remaining element...
    randomIndex = Math.floor(Math.random() * currentIndex);
    currentIndex -= 1;

    // And swap it with the current element.
    temporaryValue = array[currentIndex];
    array[currentIndex] = array[randomIndex];
    array[randomIndex] = temporaryValue;
  }

  return array;
}

这样使用：

var arr = [2, 11, 37, 42];
arr = shuffle(arr);
console.log(arr);

Answer 1

第一行实际上只是shorthand写出了三个变量：

所以，这个：

var currentIndex = array.length, temporaryValue, randomIndex;

转换为：

var currentIndex = array.length;   // 4
var temporaryValue;                // undefined
var randomIndex;                   // undefined

Answer 2

把它分成几部分。假设数组长度为 n。我们从 currentIndex = n 开始，一直持续到 currentIndex = 0，这意味着所有元素都已迭代并以一定概率移动到某个位置。

进入循环，第一行有两个函数

Math.random()：在range [0, 1)中生成一个随机实数。是的，它在 1 点打开，所以它永远不会生成 1
Math.floor()：给出作为参数给它的实数的整数部分

现在观察，Math.random()*currentIndex会在range [0, n)中生成一个随机数（基本乘法）。 Math.floor() 将取整数部分，因此我们将有一个介于 {0, 1, 2, ... n-1} 之间的整数。这个值是 randomIndex.

现在我们只是交换 currentIndex 和 randomIndex 的数字。我们从末尾开始对所有元素执行此操作。所以数组被打乱了。

但是，这不是一个很好的洗牌算法，因为您在每次迭代中都在减少随机性的范围。更好的洗牌方法是将数字与随机数成对绑定，然后以这些绑定的随机数作为键对对进行排序，然后摆脱它们以对原始数字数组进行洗牌。

Answer 3

var currentIndex = array.length, temporaryValue, randomIndex;

一个变量中没有3个值，只有3个变量声明了一个初始化，其他的都是undefined。最好像这样格式化代码：

var currentIndex = array.length,
    temporaryValue,
    randomIndex;

while (0 !== currentIndex) {
    // ...
    currentIndex -= 1;
    // ...
}

currentIndex 从 array.length 变为 0，因此 array.length 次迭代

randomIndex = Math.floor(Math.random() * currentIndex);

随机数从0到currentIndex - 1

temporaryValue = array[currentIndex];
array[currentIndex] = array[randomIndex];
array[randomIndex] = temporaryValue;

交换位置 randomIndex 和 currentIndex 的元素。

这应该为您提供理解这段代码的基础知识。

Answer 4

<p id="result">

<script>
var arrayList= ['a','b','c','d','e','f','g'];
arrayList.sort(function(){
    return 0.5 - Math.random()
})

document.getElementById("result").innerHTML  = arrayList;

</script>

随机播放 JavaScript 数组

shuffle JavaScript Array

javascript

arrays

shuffle