正常的开发情况下,我们很多情况下,都会碰到匹配数字字母的情况。我们可以如下的写法:
[0-9] 匹配数字
[a-zA-Z] 匹配字母
[\w] 匹配字母数字下划线
[\w^\_] 匹配字母数字
正常情况下,我们这样写,理论上没有任何问题,这个时候,你可以复制下面的代码到浏览器尝试一下,是否匹配的到
const a = '0123456789'
const b = 123
const c = '1234567890'
const d = '1'
const rule = /[\w^\_]/g
console.log(rule.test(a)) // true
console.log(rule.test(b)) // true
console.log(rule.test(c)) // false
console.log(rule.test(d)) // false
为了照顾读者的时间,我直接将答案贴在了后边。而细心的你也发现了,上面代码中变量a和c ,都是数字,只是变量c互相之间有空格,现在很负责的告诉您,这不是空格,而是全角情况下输入的数字。
1、全角,半角
半角:一个字符占用一个字节
全角:一个字符占用两个字节
而我们的汉语方块字已经日韩文字,本身比较大,所以需要使用两个字节来存储。而英语或者其他一些标点之类的,每一个字符仅需要一个字符就可以存储。这也就造成了我们的汉语在视觉上比英语的一个字符宽一些。而有时候,问了整体看起来整齐一些,我们输入标点符号的时候也可以切换到全角模式。
除了标点之类的可以切换到全角模式下输入,数字字符一类的也可切换到全角模式下输入。这也就造成了如下的体验模式:
### 半角(默认)
0123456789
### 全角
1234567890
既然搞清楚了全角,半角的区别,那么我们如何验证他们的区别呐?
2、Unicode 编码
unicode 编码是国际组织制定的可以容纳世界上所有文字和符号的字符编码方案
0x0000至0x10FFFF,共1114112个。其中汉字在其中的位置是\u4e00-\u9f5a。当然了,既然字符有一个编码符号,相对应的也有其下标编号(姑且这样叫)。汉字在离unicode的下标编号就是19968-40794。
charCodeAt()
将具体的字符,转化到对应的下标。这个返回值是 0 - 65535 之间的整数。比如:
"一".charCodeAt() // 19968 注:这是汉语的 一
"0".charCodeAt() // 48
fromCharCode()
将对应的下标数字转换到字符
String.fromCharCode(19968) // "一"
String.fromCharCode(48) // "0"
而我们写正则到时候需要写类似于\u4e00-\u9f5a格式到。也很好理解,就是如下到转换方式:
(19968).toString(16) // "4e00"
(48).toString(16) // "30"
所以我们为了得到正则具体到值,可以按照如下到方式:
charCodeAt() 转化得到具体到下标到数,在利用toString()方法,得到具体到Unicode码即可。
3、结论
利用以上讲到到方法,我们很容易可以得到全角数字的范围。
"0".charCodeAt() //65296
"9".charCodeAt() //65305
(65296).toString(16) // "ff10"
(65305).toString(16) // "ff19"
现在我们测试字母数字的时候可以如下写规则了
[\w^\_\uff10-\ff19] // 匹配字母数字
如果需要同时匹配 数字英文汉字,还可以写如下规则:
[\w^\_\uff10-\uff19\u4e00-\u9f5a] // 匹配字母数字汉语
如果你有精力测试的话,你会发现如下的结论
"0".charCodeAt() // 48
65296 - 48 = 65248
对,你没有想错,全角和半角的数值差是65248,当然了,仅仅针对有全角半角之分的字符。
测试一下: