使用 JavaScript 中的数组获取随机十六进制

Question

我写了一些生成随机颜色的代码。它基于一个从 0 到 9 和 A、B、C、D、E、F 的数组：

<!DOCTYPE html>
<html lang="es">

<head>
    <meta charset="utf-8">
    <title>Ejercicio 7</title>
    <script type="text/javascript">

        function changeColor() {
            const intensity = [1, 2, 3, 4, 5, 6, 7, 8, 9, 0, "A", "B", "C", "D", "E", "F"];
            let randomColor1 = intensity[Math.floor(Math.random() * intensity.length)];
            let randomColor2 = intensity[Math.floor(Math.random() * intensity.length)];
            let randomColor3 = intensity[Math.floor(Math.random() * intensity.length)];
            let randomColor4 = intensity[Math.floor(Math.random() * intensity.length)];
            let randomColor5 = intensity[Math.floor(Math.random() * intensity.length)];
            let randomColor6 = intensity[Math.floor(Math.random() * intensity.length)];
            const randomColor = `#${randomColor1}${randomColor2}${randomColor3}${randomColor4}${randomColor5}${randomColor6}`;
            document.body.style.backgroundColor = randomColor;

        }
    </script>
</head>

<body onload="changeColor()">
    <button onclick="changeColor()">Pincha aquí</button>
</body>

</html>

问题是我不明白这段重复的代码：

intensity[Math.floor(Math.random() * intensity.length)]

我知道它给了我数组 "intensity" 中的一个随机元素，但我不知道它是如何工作的。有人可以向我解释吗？提前谢谢你。

Answer 1

使用 Math.random() 你会得到一个介于 0 和 1 之间的数字（浮点数）（但不是 Andreas 指出的 1）。

如果您想要从 0 到 X 的数字，则必须乘以 X Math.random() * X。

并且强度指数从 0 变为 intensity.length。

这就是为什么您需要 Math.random() * intensity.length 来随机获取强度指数。

由于这个乘法的结果是一个浮点数，你可以使用 floor 来去除小数点，此时你有： Math.floor(Math.random() * intensity.length)

要得到的随机强度指标是：

intensity[Math.floor(Math.random() * intensity.length)]

Answer 2

你可能会在网上找到很多随机十六进制颜色生成器的例子，例如，https://css-tricks.com/snippets/javascript/random-hex-color/:

function randomHexColor() {
  return Math.floor(Math.random()*16777215).toString(16);
}

使用 JavaScript 中的数组获取随机十六进制

Getting a Random hexadecimal using an array in JavaScript

javascript

arrays

random

hex

colors