JS数组随机排序技巧分享

JS数组随机排序是前端开发中常见的需求。本文详细讲解了JavaScript实现数组随机排序的多种方法，重点推荐使用Fisher-Yates洗牌算法，该算法能有效保证随机排序的均匀性，避免了`sort()`方法结合随机数可能产生的偏差。文章还解释了为什么不能直接使用`array.sort(Math.random)`，以及如何通过创建数组副本的方式，在不改变原数组的情况下进行安全的随机排序。掌握这些方法，能帮助开发者编写出更健壮、更可靠的JavaScript代码，提升用户体验。

JavaScript实现数组随机排序的推荐方法是使用Fisher-Yates洗牌算法，1. 首先从数组末尾开始，每次随机选择一个未处理的元素；2. 然后将该元素与当前元素交换；3. 重复此过程直到所有元素都被处理，从而确保每个元素出现在任何位置的概率相等；为避免修改原数组，可先通过扩展运算符或slice()创建副本，再在副本上执行算法，最终返回新数组，实现安全的不可变操作。

JavaScript实现数组随机排序，其实就是打乱数组元素的顺序。核心在于利用sort方法，并结合一个随机函数来决定元素的排序方式。

解决方案：

最常用的方法是使用sort()方法和一个随机函数。sort()方法默认按照字符串Unicode码点排序，所以我们需要自定义排序规则来实现随机排序。

function shuffleArray(array) {
  return array.sort(() => Math.random() - 0.5);
}

// 示例
let myArray = [1, 2, 3, 4, 5];
let shuffledArray = shuffleArray(myArray);
console.log(shuffledArray); // 输出可能是 [3, 1, 5, 2, 4] 等随机顺序

这里Math.random() - 0.5会生成一个正负随机数，传递给sort()方法后，数组元素就会随机地进行比较和排序。

如何确保数组随机排序的均匀性？

虽然上面的方法简单易懂，但实际上，这种方法在理论上并不能保证完全均匀的随机分布，尤其是在数组长度较大时。这是因为sort()方法的排序算法在不同浏览器引擎中的实现可能不同，而且Math.random()的随机性也可能存在偏差。

更可靠的方法是使用Fisher-Yates (也称为 Knuth shuffle) 洗牌算法：

function shuffleArrayFisherYates(array) {
  let currentIndex = array.length,  randomIndex;

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

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

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

  return array;
}

// 示例
let myArray = [1, 2, 3, 4, 5];
let shuffledArray = shuffleArrayFisherYates(myArray);
console.log(shuffledArray);

Fisher-Yates算法从数组的最后一个元素开始，每次迭代都随机选择一个未处理的元素，然后将它与当前元素交换。这样可以保证每个元素都有相同的概率出现在数组的任何位置，从而实现更均匀的随机排序。

为什么不直接用array.sort(Math.random)？

直接使用array.sort(Math.random)是错误的，因为Math.random不是一个有效的比较函数。sort方法需要一个比较函数，该函数接收两个参数，并返回一个数字：

• 如果返回值小于0，则a排在b之前。
• 如果返回值大于0，则a排在b之后。
• 如果返回值等于0，则a和b的相对位置不变。

Math.random返回的是一个0到1之间的随机数，它并没有提供比较的逻辑。所以，我们需要用Math.random() - 0.5来生成正负随机数，从而模拟比较的逻辑。

如何在不改变原数组的情况下进行随机排序？

如果不想修改原数组，可以先创建一个数组的副本，然后在副本上进行随机排序。

function shuffleArrayImmutable(array) {
  // 创建数组副本
  let newArray = [...array]; // 或者 array.slice()

  // 使用 Fisher-Yates 算法洗牌
  let currentIndex = newArray.length,  randomIndex;

  while (currentIndex != 0) {
    randomIndex = Math.floor(Math.random() * currentIndex);
    currentIndex--;
    [newArray[currentIndex], newArray[randomIndex]] = [newArray[randomIndex], newArray[currentIndex]];
  }

  return newArray;
}

let myArray = [1, 2, 3, 4, 5];
let shuffledArray = shuffleArrayImmutable(myArray);

console.log("Original Array:", myArray); // 输出 [1, 2, 3, 4, 5]
console.log("Shuffled Array:", shuffledArray); // 输出随机排序后的数组，例如 [3, 1, 5, 2, 4]

使用扩展运算符...或slice()方法可以创建一个新的数组，避免修改原始数组。后续的随机排序操作都在这个新数组上进行。

本篇关于《JS数组随机排序技巧分享》的介绍就到此结束啦，但是学无止境，想要了解学习更多关于文章的相关知识，请关注golang学习网公众号！