当前位置:首页 > JavaScript

js实现随机

2026-02-01 23:43:46JavaScript

生成随机数

使用 Math.random() 生成一个介于 0(含)和 1(不含)之间的随机浮点数:

const randomFloat = Math.random(); // 例如 0.123456789

需要生成指定范围的随机整数时,结合 Math.floor()Math.ceil()

function getRandomInt(min, max) {
  return Math.floor(Math.random() * (max - min + 1)) + min;
}
const randomInt = getRandomInt(1, 10); // 生成 1-10 的整数

随机数组元素

从数组中随机选择一个元素:

js实现随机

const array = ['apple', 'banana', 'orange'];
const randomItem = array[Math.floor(Math.random() * array.length)];

打乱数组顺序(Fisher-Yates 算法):

function shuffleArray(array) {
  for (let i = array.length - 1; i > 0; i--) {
    const j = Math.floor(Math.random() * (i + 1));
    [array[i], array[j]] = [array[j], array[i]];
  }
  return array;
}
shuffleArray([1, 2, 3]); // 可能返回 [2, 3, 1]

生成随机字符串

生成指定位数的随机字母数字字符串:

js实现随机

function randomString(length) {
  const chars = 'ABCDEFGHIJKLMNOPQRSTUVWXYZabcdefghijklmnopqrstuvwxyz0123456789';
  let result = '';
  for (let i = 0; i < length; i++) {
    result += chars.charAt(Math.floor(Math.random() * chars.length));
  }
  return result;
}
randomString(8); // 例如 "aB3cD9fG"

密码学安全随机数

需要更高安全性时(如生成密钥),使用 crypto.getRandomValues()

const secureArray = new Uint32Array(1);
window.crypto.getRandomValues(secureArray);
console.log(secureArray[0]); // 安全的随机整数

随机颜色生成

生成十六进制随机颜色:

function randomHexColor() {
  return `#${Math.floor(Math.random() * 0x1000000).toString(16).padStart(6, '0')}`;
}
randomHexColor(); // 例如 "#3a7b29"

标签: js
分享给朋友:

相关文章

css3结合js制作

css3结合js制作

CSS3 结合 JavaScript 制作动态效果 CSS3 和 JavaScript 结合可以实现丰富的动态效果,包括动画、交互和响应式设计。以下是几种常见的实现方式: CSS3 动画与 Jav…

js 实现vue模板

js 实现vue模板

实现 Vue 模板的 JavaScript 方法 通过原生 JavaScript 可以实现类似 Vue 的模板渲染功能,主要包括数据绑定、指令处理和模板解析。以下是核心实现思路: 数据绑定与响应式…

js实现图片上传

js实现图片上传

图片上传的基本实现 使用HTML的<input type="file">元素配合JavaScript的File API可以实现图片上传功能。HTML部分需要创建一个文件选择输入框和一个用于…

js实现日历

js实现日历

实现日历的基本思路 使用JavaScript实现日历的核心是动态生成日期表格,并处理月份切换逻辑。需要计算当前月的天数、起始星期几,并动态渲染到页面上。 获取当前日期信息 通过Date对象获取当前…

js实现预览

js实现预览

文件上传预览实现 使用JavaScript实现文件上传预览功能,可以通过FileReader对象读取文件内容并显示预览。以下代码支持图片、文本和PDF文件的预览: // HTML部分需要包含inp…

js类实现

js类实现

使用类实现 JavaScript 功能 在 JavaScript 中,类(Class)是一种语法糖,基于原型继承机制。通过 class 关键字可以更直观地定义对象模板。 基本类定义 class…