本文介绍如何使用原生JavaScript生成指定位数的验证码。核心思路利用String.fromCharCode将随机数转换为大小写字母，结合数字随机生成数组元素。通过遍历确保最终结果中同时包含字母和数字，若缺失则进行修正替换，最后拼接为字符串返回。
原生JS验证码生成原理
利用原生JavaScript实现指定长度验证码的生成，生成的验证码内容需同时包含字母与数字字符。
实现思路主要依赖String对象的fromCharCode方法，将特定范围内的随机数值转换为对应的大小写英文字母。程序通过随机数决定数组当前索引位置填充大写字母、小写字母还是数字。函数接收一个参数作为生成数组的长度，填充完毕后对数组元素进行校验：若生成的数组中完全不含数字，则随机选取一个字母位置替换为随机数字；若完全不含字母，则随机选取一个数字位置替换为大写或小写字母；若已同时包含字母和数字，则保持现状。所有判断逻辑执行完毕后，调用数组的join方法将元素拼接为字符串并返回结果。
核心代码实现
function verificationCode(num) {
var arr = [];
var letterFlag = false;
var numberFlag = false;
for (i = 0; i < num; i++) {
// 获取随机大写字母
var uppercase = String.fromCharCode(Math.round(Math.random() * 25 + 65));
// 获取随机小写字母
var lower = String.fromCharCode(Math.round(Math.random() * 25 + 97));
// 获取随机数字
var number = Math.round(Math.random() * 9);
// 获取0-2的随机数来随机决定该位置是大写字母，小写字母或者是数字
var temp = Math.round(Math.random() * 2)
if (temp == 0) {
arr[i] = uppercase;
} else if (temp == 1) {
arr[i] = lower;
} else {
arr[i] = number;
}
}
// 检查arr是否同时有字母与数字
for (var j = 0; j < arr.length; j++) {
if (Object.prototype.toString.call(arr[j]) == "[object String]") {
letterFlag = true;
}
if (typeof(arr[j]) == 'number') {
numberFlag = true;
}
}
// 对不同情况做处理
// 字母数字都有
if (letterFlag && numberFlag) {
return arr.join("");
}
// 没有字母时
if (letterFlag == false && numberFlag == true) {
uppercase = String.fromCharCode(Math.round(Math.random() * 25 + 65));
lower = String.fromCharCode(Math.round(Math.random() * 25 + 97));
temp = Math.round(Math.random() * 1)
if (temp == 0) {
arr[Math.round(Math.random() * (num - 1))] = uppercase;
} else {
arr[Math.round(Math.random() * (num - 1))] = lower;
}
return arr.join("");
}
// 没有数字时
if (letterFlag == true && numberFlag == false) {
number = Math.round(Math.random() * 9);
arr[Math.round(Math.random() * (num - 1))] = number;
return arr.join("");
}
}
var code = verificationCode(10);
console.log(code);代码运行效果展示
以上内容为本文的全部分享，希望能为读者的学习提供辅助，同时也欢迎读者继续支持本站。