• 日常搜索
  • 百度一下
  • Google
  • 在线工具
  • 搜转载

如何在JavaScript中生成随机数和字符串

生成随机数或字母数字字符串的能力在许多情况下都能派上用场。您可以使用它在游戏中的不同位置生成敌人或食物。您还可以使用它向用户建议随机密码或创建文件名来保存文件。

我写了一篇关于如何在 PHP中生成随机字母数字字符串的教程。在那篇文章的开头,我说几乎没有事件是真正随机的,同样的事情也适用于随机数或字符串生成。

如何在JavaScript中生成随机数和字符串  第1张

在本教程中,我将向您展示如何在 javascript 中生成伪随机字母数字字符串。

JavaScript 中生成随机数

让我们从生成随机数开始。第一个想到的方法是Math.random(),它返回一个浮点伪随机数。随机数将始终大于或等于 0 且小于 1。

该范围内返回的数字分布几乎是均匀的,因此该方法可以很好地生成随机数,在日常使用中没有明显的偏差。以下是对该方法进行十次调用的输出

Math.random():
for(let i = 0; i < 10; i++) {
  console.log(Math.random());
}
/* Outputs: 
0.9981169188071801 
0.7073616929117277 
0.05826679080842556 
0.30779242012809105 
0.37282814053539926 
0.8991639574910759 
0.5851162879630685 
0.40572834956467063 
0.5286480734412005 
0.07898699710613699 
*/

生成范围内的随机整数

正如您在上一节中看到的,Math.random()将为我们提供 0(含)到 1(不含)范围内的随机数。假设我们想要 0(含)到 100(不含)范围内的随机整数。我们在这里需要做的就是将原始范围乘以 100。

以上面代码片段的第一个输出值为例,0.9981169188071801乘以100后就是99.81169188071801。现在我们可以使用这个Math.floor()方法,它会向下取整,返回小于等于99.81169188071801的最大整数。换句话说,它会给我们 99。

以下代码片段将循环执行 10 次以显示应用于不同数字的所有这些步骤。

const max_limit = 100;
for(let i = 0; i < 10; i++) {
  let random_float = Math.random();
  let scaled_float = random_float * max_limit;
  let random_integer = Math.floor(scaled_float);
  
  let rf_str = random_float.toString().padEnd(20, ' ');
  let sf_str = scaled_float.toString().padEnd(20, ' ');
  let ri_str = random_integer.toString().padStart(2, ' ');
  
  console.log(`Random Float: ${rf_str} Scaled Float: ${sf_str} Random Integer: ${ri_str}`);
}
/* Outputs: 
Random Float: 0.7976037763162469 Scaled Float: 79.76037763162469 Random Integer: 79 
Random Float: 0.3794078358214559 Scaled Float: 37.94078358214558 Random Integer: 37 
Random Float: 0.5749118617425708 Scaled Float: 57.49118617425708 Random Integer: 57 
Random Float: 0.7110572178100005 Scaled Float: 71.10572178100006 Random Integer: 71 
Random Float: 0.9157559644743132 Scaled Float: 91.57559644743132 Random Integer: 91 
Random Float: 0.8773095295734263 Scaled Float: 87.73095295734264 Random Integer: 87 
Random Float: 0.7714603913623834 Scaled Float: 77.14603913623834 Random Integer: 77 
Random Float: 0.6431998616346499 Scaled Float: 64.31998616346499 Random Integer: 64 
Random Float: 0.7909155691442253 Scaled Float: 79.09155691442254 Random Integer: 79 
Random Float: 0.1219575935563590 Scaled Float: 12.19575935563590 Random Integer: 12 
*/

现在您了解了乘法和取底背后的逻辑,我们可以编写一个函数来生成最大限制内的随机整数。

function max_random_number(max) {
  return Math.floor(Math.random() * max);
}
for(let i = 0; i < 10; i++) {
  console.log(max_random_number(100));
}
/* Outputs: 
35 
23 
92 
94 
42 
9 
12 
56 
40 
21 
*/

如果要生成高于指定最小值但低于最大值的随机数怎么办?

在这种情况下,您可以预先添加最小值,以确保生成的数字至少等于最小值。之后,您可以简单地生成一个随机数,然后max - min在将其添加到可能的最小值之前对其进行缩放。

function min_max_random_number(min, max) {
  return min + Math.floor(Math.random() * (max - min));
}
for(let i = 0; i < 10; i++) {
  console.log(min_max_random_number(50, 100));
}
/* Outputs: 
96 
81 
95 
56 
73 
72 
71 
90 
51 
53 
*/

生成加密安全随机数

该Math.random()方法不适用于生成密码安全的随机数,但该Crypto.getRandomValues()方法可以帮助我们。此方法使用加密安全伪随机数填充传递的数组。请记住,用于生成这些随机数的算法可能因用户代理而异。

正如我之前提到的,您需要将一个基于整数的方法传递TypedArray给该方法,以便它用随机值填充它。数组的原始内容将被替换。下面的代码将用随机整数填充我们的十元素数组。

let random_values = new Uint8Array(10);
console.log(random_values);
// Outputs: Uint8Array(10) [ 0, 0, 0, 0, 0, 0, 0, 0, 0, 0 ] 
crypto.getRandomValues(random_values);
console.log(random_values);
// Outputs: Uint8Array(10) [ 207, 209, 1, 145, 70, 111, 21, 141, 54, 200 ]

构造Unit8Array()函数给了我们一个包含十个 8 位无符号整数的数组。数组值全部初始化为零。

一旦我们将这个数组传递给我们的getRandomValues()方法,随机数的值将保持在 0 到 255 之间。您可以使用其他类型的数组来生成不同范围内的随机数。例如,使用Int8Array()构造函数将为我们提供一个整数值介于 -128 和 127 之间的数组。类似地,使用 aUint16Array()将为我们提供一个整数值最大为 65,535 的数组。

let random_values = new Int8Array(10);
console.log(random_values);
// Outputs: Int8Array(10) [ 0, 0, 0, 0, 0, 0, 0, 0, 0, 0 ] 
crypto.getRandomValues(random_values);
console.log(random_values);
// Outputs: Int8Array(10) [ -82, -106, 87, 64, 42, -36, -53, 27, -38, 4 ] 
let random_values = new Uint16Array(10);
console.log(random_values);
// Outputs: Uint16Array(10) [ 0, 0, 0, 0, 0, 0, 0, 0, 0, 0 ] 
crypto.getRandomValues(random_values);
console.log(random_values);
// Outputs: Uint16Array(10) [ 47615, 60195, 53177, 15169, 215, 4928, 12200, 6307, 30320, 20271 ]

javaScript 中生成随机字母数字字符串

我们现在将使用上一节中获得的知识在 JavaScript 中生成随机字母数字字符串。

这个概念很简单。我们将从一个包含所有所需字符的字符串开始。在这种情况下,字符串将由小写字母、大写字母和 0 到 9 之间的数字组成。您可能已经知道,我们可以通过向其传递索引值来访问字符串中特定位置的字符。

生成随机字母数字字符串所需要做的就是生成随机数,然后访问该随机索引处的字符以将其附加到我们的随机字符串。以下代码片段将其全部封装在一个漂亮的小函数中:

const char_set = 'abcdefghijlkmnopqrstuvwxyzABCDEFGHIJKLMNOPQRSTUVWXYZ0123456789';
function max_random_number(max) {
  return Math.floor(Math.random() * max);
}
function get_random_string(length) {
  let random_string = '';
  for(let i = 0; i < length; i++) {
    random_string += char_set[max_random_number(char_set.length - 1)];
  }
  
  return random_string;
}
console.log(get_random_string(20));
// Outputs: lgtuRJZolu7AXj4HMoiM 
console.log(get_random_string(40));
// outputs: scOoal3VXgeAjaHIieolhi2TyWFpAn5bBPPiX6UG

使用toString()生成随机字母数字字符串

我们可以用来生成随机字母数字字符串的另一种方法是toString()对随机生成的数字使用该方法。该toString()方法返回一个代表我们指定数值的字符串。此方法接受一个可选radix参数,该参数指定要表示数字的基数。值为 2 将返回二进制字符串,值为 16 将返回十六进制字符串。此参数的默认值为 10。最大值可以为 36,因为它涵盖了所有 26 个字母和 10 个数字。

radix以下是针对不同值对该方法的几次调用的输出:

let number = 3498650143868;
console.log(number.toString(2));
// Outputs: 110010111010010111110011001000110001111100 
console.log(number.toString(10));
// Outputs: 3498650143868 
console.log(number.toString(16));
// Outputs: 32e97cc8c7c 
console.log(number.toString(36));
// Outputs: 18n99yoak

您可能已经注意到,随着我们增加radix. 在下面的代码片段中,我们将使用max_random_number()上一节中的函数来获取随机数。然后,我们将使用该toString()方法将此随机数转换为字母数字字符串。

function max_random_number(max) {
  return Math.floor(Math.random() * max);
}
for(let i = 0; i < 10; i++) {
  console.log(max_random_number(Number.MAX_SAFE_INTEGER).toString(36));
}
/* Outputs: 
1tr84s6c2sl 
1yj4varyoj7 
1zdg9nn0z6r 
lubrjj1zih 
13tt2n5vw9t 
1mv6sctjgf 
yx3fhnznhf 
1wj4mdcrqb9 
26sir75af2r 
qdv9xv800t 
*/

如果您想要更大的字母数字字符串并希望它们具有固定长度(例如 40 个字符或 100 个字符)怎么办?在这种情况下,我们可以创建一个循环,不断追加生成的字符串,直到达到所需的长度。

function max_random_number(max) {
  return Math.floor(Math.random() * max);
}
function get_random_string(length) {
  let random_string = '';
  while(random_string.length < length) {
   random_string += max_random_number(Number.MAX_SAFE_INTEGER).toString(36);
  }
  return random_string.substring(0, length);
}
console.log(get_random_string(40));
// Outputs: bn0nfhcsjm18ylzqrm6bo1iktka2aq7qbbl5ybki 
console.log(get_random_string(100));
// Outputs: rdosjhthsevmk91mj9zvqexz2z0v3pe2beasbzoworanzjg3bfpf975rzfy2fmo6pmj4p69u0x80ce92jh2vljx90g6r0lzd8vb0

最后的想法

在本教程中,我们学习了如何在 JavaScript 中生成随机数和字母数字字符串。借助该Math.random()方法,在 JavaScript 中生成随机整数很容易。我们所要做的就是缩放输出,使其符合我们想要的范围。getRandomValues()如果您希望您的随机数在密码学上是安全的,您也可以考虑使用该方法。

一旦我们知道如何生成随机数,创建随机字母数字字符串就很容易了。我们需要做的就是弄清楚如何将我们的数字转换为字符。我们在这里使用了两种方法。第一个涉及访问预定义字符串中随机数字索引处的字符。如果您想具体说明应包含在随机字母数字字符串中的字符,则此技术很有用。另一种方法涉及使用该toString()方法将我们的十进制数转换为不同的基数。这涉及对我们max_random_number()函数的更少调用。

当然还有更多技术可用于生成随机字母数字字符串。这完全取决于您的需求以及您希望通过您的方法发挥多大的创造力。


文章目录
  • 在 JavaScript 中生成随机数
    • 生成范围内的随机整数
    • 生成加密安全随机数
  • 在 javaScript 中生成随机字母数字字符串
    • 使用toString()生成随机字母数字字符串
  • 最后的想法
  • 发表评论