接上篇 上次咱们自己对文件大小进行限制，写的比较粗糙，咱们这次来优化一下
文件大小我们可以通过beforeAvatarUpload(file) 函数接收到的file中 file.size获取（这里试验了下我们获取的是比特单位，需要我们转码成对应的单位）
这次我们使用正则表达式来解决
首先，查一下基础的概念
正则表达式修饰符
| 字符 | 含义 |
|---|---|
| i | 执行不区分大小写的匹配 |
| g | 执行一个全局匹配，简言之，即找到所有的匹配，而不是在找到第一个之后就停止 |
| m | 多行匹配模式，和上面一样不会找到立即停止，一行找完会找下一行 |
正则表达式的字符类
| 字符 | 匹配 |
|---|---|
| [...] | 方括号内的任意字符 |
| [^...] | 不在方括号内的任意字符 |
| . | 除换行符和其他Unicode行终止符之外的任意字符 |
| \w | 任意ASCII字符组成的单词，等价于[a-zA-Z0-9] |
| \W | 任意非ASCII字符组成的单词，等价于[^a-zA-Z0-9] |
| \s | 任意Unicode空白符 |
| \S | 任意非Unicode空白符的字符，注意\w和\S不同 |
| \d | 任何ASCII数字，等价于[0-9] |
| \D | 除了ASCII数字之外的任何字符，等价于[^0-9] |
| [\b] | 退格直接量（特例） |
正则表达式的重复字符语法
| 字符 | 含义 |
|---|---|
| {n,m} | 匹配前一项至少n次，但不能超过m次 |
| {n,} | 匹配前一项n次或者更多次 |
| {n} | 匹配前一项n次 |
| ? | 匹配前一项0次或者1次，也就是说前一项是可选的，等价于{0,1} |
| + | 匹配前一项1次或者多次，等价于{1,} |
| * | 匹配前一项0次或多次，等价于{0,} |
模式匹配的String方法
| 方法名 | 用途 |
|---|---|
| search() | 匹配后返回对应位置 |
| replace() | 替换匹配到的内容 |
| match() | 匹配后返回对应字符串为数组 |
| exec() | 类似match()，未匹配到返回null |
基本概念还有很多，我们这次能用到的基本上已经列出来了，下面开工
- 首先我们了解一下换算单位
1 Byte（B） = 8 bit 1 Kilo Byte（KB） = 1024B 1 Mega Byte（MB） = 1024 KB 1 Giga Byte （GB）= 1024 MB 1 Tera Byte（TB）= 1024 GB 1 Peta Byte（PB） = 1024 TB 1 Exa Byte（EB） = 1024 PB 1 Zetta Byte（ZB） = 1024 EB 1Yotta Byte（YB）= 1024 ZB 1 Bronto Byte（BB） = 1024 YB 1Nona Byte（NB）=1024 BB 1 Dogga Byte（DB）=1024 NB 1 Corydon Byte（CB）=1024DB
知道了这些我们拿到文件大小就能换算
- 大于1024k我们就显示未MB，小于则显示K
showSize(val) { const size = val / 1024 if (size > 1024) { const MB = (size / 1024).toFixed(2) return `${MB}MB` } return `${size.toFixed(2)}KB`},复制代码 接下来我们使用正则表达式来动态限制文件大小
- 获取要限制的单位，我们使用match()
这里要注意match()返回的是数组不是字符串，后面我们还要对单位做处理
const regUnit = /\D+/g // 这里有漏洞，会获取空格及除了数字外其他字符const unit = maxSize.match(regUnit)复制代码
所以应该使用
const regUnit = /[a-z]+/giconst unit = maxSize.match(regUnit)复制代码
/[a-z]+/gi [a-z]匹配从a到z字符，至少匹配一个 g全局匹配匹配多个 i不区分大小写防止mB、Mb类似这种
- 获得限制文件的数
const regNum = /\d+/gconst num = maxSize.match(regNum) * 1 // 快速把Array转为Number复制代码
- 写成一个函数，接收两个参数，限制的大小以及传入文件的大小
limitFileSize(maxSize, fileSize) { const regUnit = /[a-z]+/gi const regNum = /\d+/g const unit = maxSize.match(regUnit) const num = maxSize.match(regNum) * 1 switch (unit && unit.toString().toLowerCase()) { //把单位转为字符串且统一为小写 case 'k': case 'kb': return fileSize / 1024 < num case 'm': case 'mb': return fileSize / 1024 / 1024 < num case 'g': case 'gb': return fileSize / 1024 / 1024 / 1024 < num default: break }},复制代码 - 大功告成
参考文献 JavaScript权威指南（第六版） JavaScript高级程序设计（第三版）