js案例混合验证码之概率误区
前言:
在学习js的初级阶段我们大概率会遇上一个经典的题目如何生成验证码,一开始我们做的一般是生成数字验证码,这个问题比较简单,只要在循环中嵌入一个random方法就可以了。之后要求一般会提升为生成数字和字母混合验证码。在处理混合验证码的时候,许多同学会犯一个比较严重的错误,就是取的内容不够真正的随机。
我一开始在考虑这个问题的时候,思路是先生成一个数组用来装数字,再生成两个数组分别盛装大小写字母。最后利用concat方法将三个数组拼接在一起,然后随机从中取四位数。这种方法确实能生成四位数字和字母验证码,但是却是错的,因为它并没有做到真正的随机。在拼接的数组中,一共有10位数字+26大写字母+26小写字母。如果我们从其中抽取一位字符,那么抽取到数字和大小写字母的概率还相同吗?
下面介绍一种方法,这种方法的思路是先建立一个数据库,这个数据库中包含数字,和大小写字母。数据库的数据数量不限(是你验证码位数的整数倍),但是要保证数字和大小写字母的数量是相同。然后从数据库中随机抽取四位。
代码:
<!DOCTYPE html>
<html lang="en">
<meta charset="UTF-8">
<title>Title
//建库
function rs() {
var str ="";
for(var i=0;i<4;i++){
var num =random(0,9);
var az =String.fromCharCode(random(97,122));
var AZ =String.fromCharCode(random(65,90));
str += str+num+az+AZ;
}
//开始真正的随机抽取四个
var stq ="";
for(var j=0;j<4;j++){
stq += str[random(0,str.length-1)]
}
return stq;
}
console.log(rs());
function random(a,b) {
return Math.round(Math.random()*(a-b)+b);
}
</html>
结果如图:
![](https://upload-images.jianshu.io/upload_images/19326383-8876ed73c5fcbb62.png?imageMogr2/auto-orient/strip|imageView2/2/w/249/format/webp)
总结:
代码本身并不难,重点是不能陷入误区,和这一题易错点相似的还有随机生成六位十六进制颜色值的问题,许多同学在做一这题的时候每一位都直接从包含数字和字母的数组中随机生成一位字符,最后拼接在一起,这其实还是陷入了概率误区。