javascript - 用文字代替数字？Fisher-Yates 随机化

Question

我在这里找到了关于 Fisher-Yates 和随机化的非常有趣的东西：如何随机化（随机播放）JavaScript 数组？

内容！

//function source code from https://stackoverflow.com/questions/2450954/how-to-randomize-shuffle-a-javascript-array

//define input array. 

//If you like, a site such as http://textmechanic.com/text-tools/numeration-tools/generate-list-numbers/ could be useful to generate different length arrays.
const inputArray = [1,2,3,4,5,6,7,8,9,10,11,12,13,14,15,16,17,18,19,20,21,22,23,24,25,26,27,28,29,30];

//define Durstenfield shuffle
const durstenShuffle = function(array) {
  for (var i = array.length - 1; i > 0; i--) {
    let j = Math.floor(Math.random() * (i + 1));
    let temp = array[i];
    array[i] = array[j];
    array[j] = temp;
  }
  document.getElementById("dfresults").append(array.toString());
};

//define Fisher-Yates shuffle
const fisherShuffle = function(array) {
  let currentIndex = array.length,
    temporaryValue,
    randomIndex;

  while (0 !== currentIndex) {
    randomIndex = Math.floor(Math.random() * currentIndex);
    currentIndex -= 1;

    temporaryValue = array[currentIndex];
    array[currentIndex] = array[randomIndex];
    array[randomIndex] = temporaryValue;
  }
  document.getElementById("fyresults").append(array.toString());
};

//run Fisher shuffle
fisherShuffle(inputArray);
//run Durstenfield shuffle
durstenShuffle(inputArray);

html,
body {
  font-size: 16px;
  font-family: sans-serif;
}
h1,
h2 {
  font-family: serif;
  margin: 1rem 0.5rem;
}
h1 {
  font-size: 1.75rem;
}
h2 {
  font-size: 1.25rem;
}
p {
  line-height: 1.5;
  margin: 0.5rem 0.5rem;
}

<h1>Shuffling</h1>
<p>Comparing the Fisher-Yates to Durstenfield shuffle. Both return randomly sorted numbers quickly and efficiently. Is it O(n)? Only you can tell!</p>
<p>The array to be sorted is 30 numbers, 1-30 inclusive. Originally, I intended to do a performance comparison but because of deliberate error introduced into performance.now() due to Spectre mitigation fixes, that was infeasible to do clientside. So enjoy some shuffled numbers!</p>

<p>Specifically, on pageload each shuffle function will take the input array and return a shuffled result to the DOM.</p>

<div class="results">
  <h2>Results</h2>
  <p>Fisher-Yates: <span id="fyresults"></span></p>
  <p>Durstenfield: <span id="dfresults"></span></p>
</div>

现在我想用名字替换这 30 位数字（例如：Thomas、Adrian、James、Patrick、Victor...）

我怎样才能做到这一点？我对此很陌生，我迈出了第一步

标签： javascriptrandomshuffleknuthfisher-yates-shuffle

Answer 1

由于shuffle函数会打乱数组索引，因此您可以像以前一样打乱数组，但在数组中添加名称字符串。

   
   // replace numbers with names   
const inputArray = ["Thomas", "Adrian", "James", "Patrick", "Victor"];

//define Durstenfield shuffle
const durstenShuffle = function(array) {
  for (var i = array.length - 1; i > 0; i--) {
    let j = Math.floor(Math.random() * (i + 1));
    let temp = array[i];
    array[i] = array[j];
    array[j] = temp;
  }
  document.getElementById("dfresults").append(array.toString());
};

//define Fisher-Yates shuffle
const fisherShuffle = function(array) {
  let currentIndex = array.length,
    temporaryValue,
    randomIndex;

  while (0 !== currentIndex) {
    randomIndex = Math.floor(Math.random() * currentIndex);
    currentIndex -= 1;

    temporaryValue = array[currentIndex];
    array[currentIndex] = array[randomIndex];
    array[randomIndex] = temporaryValue;
  }
  document.getElementById("fyresults").append(array.toString());
};

fisherShuffle(inputArray);
durstenShuffle(inputArray);

<div class="results">
  <h2>Results</h2>
  <p>Fisher-Yates: <span id="fyresults"></span></p>
  <p>Durstenfield: <span id="dfresults"></span></p>
</div>