首页 > web前端 > js教程 > 正文

JavaScript中生成随机数字和字符串

王林
发布: 2023-09-02 08:57:12
原创
1410 人浏览过

JavaScript中生成随机数字和字符串

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

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

在本教程中,我将向您展示如何在 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() 方法不适合生成加密安全的随机数,但是 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() 构造函数为我们提供了一个由 10 个 8 位无符号整数组成的数组。数组值全部初始化为零。

一旦我们将此数组传递给 getRandomValues() 方法,随机数的值将保持在 0 到 255 之间。您可以使用其他类型数组来生成不同范围的随机数。例如,使用 Int8Array() 构造函数将为我们提供一个整数值在 -128 到 127 之间的数组。同样,使用 Uint16Array() 将为我们提供一个整数值最大为 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中生成随机数字和字符串的详细内容。更多信息请关注PHP中文网其他相关文章!

相关标签:
来源:php.cn
本站声明
本文内容由网友自发贡献,版权归原作者所有,本站不承担相应法律责任。如您发现有涉嫌抄袭侵权的内容,请联系admin@php.cn
热门教程
更多>
最新下载
更多>
网站特效
网站源码
网站素材
前端模板