【笔记】再学JavaScript ES(6-10)全版本语法——ES6新增的y、u修饰符、flags 属性

---

一、y修饰符和sticky 属性

/*
* y修饰符和sticky属性
*/
const s = 'aaa_aa_a'
const r1 = /a+/g
const r2 = /a+/y
// 第一次执行
console.log(r1.exec(s)) // aaa
console.log(r2.exec(s)) // aaa
// 第二次执行
console.log(r1.exec(s)) // aa
console.log(r2.exec(s)) // null
// 第三次执行
console.log(r1.exec(s)) // a
console.log(r2.exec(s)) // aaa

可见g和新增的y都可以进行全局连续匹配，区别在于：

• g要求只要匹配对象或下次匹配对象有符合要求的地方即可
• y要求匹配对象或下次匹配对象必须从首位就符合匹配规则，否则返回null，且接下来再次匹配的话从头开始

二、u修饰符

主要用来处理Unicode字符，ES6正则中好多地方不加u修饰符会报莫名错误。。。

Unicode Han Character ‘U+20BB7’ (U+20BB7)

/*
* u修饰符
*/
const s1 = '𠮷'
const s2 = '\uD842\uDFB7'

console.log(/^\uD842/.test(s2)) // true, 把s2当作了两个字符来匹配，有误
console.log(/^\uD842/u.test(s2)) // false, 把s2当作了一个字符来匹配，正确

// 点字符:匹配除了换行符以外的任意单个字符
// 但是对于码点大于0xFFFF的 Unicode 字符，点字符不能识别，必须加上u修饰符
console.log(/^.$/.test(s1)) // false
console.log(/^.$/u.test(s1)) // true

// 使用大括号配码点表示 Unicode 字符
// 不过必须加上u修饰符，才能识别当中的大括号，否则会被解读为量词。
console.log(/\u{20BB7}/u.test(s1)) // true
console.log(/\u{61}/u.test('a')) // true

// 使用量词识别码点大于0xFFFF的 Unicode 字符也需要使用u修饰符
console.log(/𠮷{2}/u.test('𠮷𠮷')) // true

console.log(/[a-z]/iu.test('\u212A')) // true, 大小写字母匹配也需要加u修饰符

拓展：

• 字符编码笔记：ASCII，Unicode 和 UTF-8
• Unicode 编码与UTF-8、UTF-16

三、flags 属性

/*
* flags 属性
*/
const r1 = /a+/g
// 返回正则表达式的正文
console.log(r1.source) // a+

// 返回正则表达式的修饰符
console.log(r1.flags) // g

四、RegExp构造函数

/*
* RegExp构造函数
*/
// 第一种用法：第一个参数是字符串，第二个参数是正则表达式的修饰符（flag）。
var regex1 = new RegExp('xyz','i')
console.log(regex1) // /xyz/i
// 第二种用法，参数是一个正则表示式（ES5不允许此时有第二个参数——修饰符，否则会报错）
var regex2 = new RegExp(/xyz/i)
console.log(regex2) // /xyz/i

// ES6中如果RegExp构造函数第一个参数是一个正则对象，可以使用第二个参数指定修饰符。这时会忽略原有的正则表达式的修饰符，只使用新指定的修饰符。
var regex3 = new RegExp(/xyz/ig, 'i')
console.log(regex3) // /xyz/i

五、其他常用拓展

g(global)

全局多次匹配；从左到右，找到每个符合条件的都记录下来，而不是在第一个匹配后停止

i(ignore)

忽略大小写

m(more)

多行匹配；将开始和结束字符（^和$）视为在多行上工作（也就是，分别匹配每一行的开始和结束（由 \n 或 \r 分割），而不只是只匹配整个输入字符串的最开始和最末尾处。

拓展

• ES6语法——正则表达式的新特性

六、常用JS正则表达式

// 用户名正则，4到16位（字母，数字，下划线，减号）
const uPattern = /^[a-zA-Z0-9_-]{4,16}$/
console.log(uPattern.test('aimooc_top')) // true

// 密码强度正则，最少6位，包括至少1个大写字母，1个小写字母，1个数字，1个特殊字符
const pPattern = /^.*(?=.{6,})(?=.*\d)(?=.*[A-Z])(?=.*[a-z])(?=.*[!@#$%^&*? ]).*$/
console.log('==' + pPattern.test('aimooc#')) // true

// 正整数正则
const posPattern = /^\d+$/
// 负整数正则
const negPattern = /^-\d+$/
// 整数正则
const intPattern = /^-?\d+$/
console.log(posPattern.test('42')) // true
console.log(negPattern.test('-42')) // true
console.log(intPattern.test('-42')) // true

// 正数正则
const posPattern = /^\d*\.?\d+$/
// 负数正则
const negPattern = /^-\d*\.?\d+$/
// 数字正则
const numPattern = /^-?\d*\.?\d+$/
console.log(posPattern.test('42.2'))
console.log(negPattern.test('-42.2'))
console.log(numPattern.test('-42.2'))

// Email正则
const ePattern = /^([A-Za-z0-9_\-\.])+\@([A-Za-z0-9_\-\.])+\.([A-Za-z]{2,4})$/
console.log(ePattern.test('123456789@qq.com')) // true

// 手机号正则
const mPattern = /^1[34578]\d{9}$/
console.log(mPattern.test('15532394699')) // true

// 身份证号（18位）正则
const cP = /^[1-9]\d{5}(18|19|([23]\d))\d{2}((0[1-9])|(10|11|12))(([0-2][1-9])|10|20|30|31)\d{3}[0-9Xx]$/
console.log(cP.test('11011519960211299X')) // true

// URL正则
const urlP = /^((https?|ftp|file):\/\/)?([\da-z\.-]+)\.([a-z\.]{2,6})([\/\w \.-]*)*\/?$/
console.log(urlP.test('http://aimooc.top')) // true

// ipv4地址正则
const ipP = /^(?:(?:25[0-5]|2[0-4][0-9]|[01]?[0-9][0-9]?)\.){3}(?:25[0-5]|2[0-4][0-9]|[01]?[0-9][0-9]?)$/
console.log(ipP.test('115.38.67.98')) // true
console.log(ipP.test('321.38.67.98')) // false

// RGB Hex颜色正则
const cPattern = /^#?([a-fA-F0-9]{6}|[a-fA-F0-9]{3})$/
console.log(cPattern.test('#b8b8b8')) // true

// 日期正则，简单判定,未做月份及日期的判定
const dP1 = /^\d{4}(\-)\d{1,2}\1\d{1,2}$/
console.log(dP1.test('2020-05-21')) // true
console.log(dP1.test('2020-13-12')) // true
// 日期正则，复杂判定
const dP2 = /^(?:(?!0000)[0-9]{4}-(?:(?:0[1-9]|1[0-2])-(?:0[1-9]|1[0-9]|2[0-8])|(?:0[13-9]|1[0-2])-(?:29|30)|(?:0[13578]|1[02])-31)|(?:[0-9]{2}(?:0[48]|[2468][048]|[13579][26])|(?:0[48]|[2468][048]|[13579][26])00)-02-29)$/
console.log(dP2.test('2020-05-21')) // true
console.log(dP2.test('2020-15-11')) // false
console.log(dP2.test('2021-02-29')) // false

// QQ号正则，5至11位
const qqPattern = /^[1-9][0-9]{4,10}$/
console.log(qqPattern.test('113120980')) // true

// 微信号正则，6至20位，以字母开头，字母，数字，减号，下划线
const wxPattern = /^[a-zA-Z]([-_a-zA-Z0-9]{5,19})+$/
console.log(wxPattern.test('aimooc_wx')) // true

// 车牌号正则
const cPattern = /^[京津沪渝冀豫云辽黑湘皖鲁新苏浙赣鄂桂甘晋蒙陕吉闽贵粤青藏川宁琼使领A-Z]{1}[A-Z]{1}[A-Z0-9]{4}[A-Z0-9挂学警港澳]{1}$/
console.log(cPattern.test('冀BJBJBJ')) // true

// 包含中文正则
const cnPattern = /[\u4E00-\u9FA5]/
console.log(cnPattern.test('前端开发')) // true

简洁版

export const Validator = {
  isEmil: /^([a-zA-Z0-9_\.\-])+\@(([a-zA-Z0-9\-])+\.)+([a-zA-Z0-9]{2,4})+$/, // 校验邮箱
  isPhoneNumber: /^1[3456789]\d{9}$/, // 手机号码验证
  isMobileNumber: /^(\(\d{3,4}\)|\d{3,4}-|\s)?\d{7,14}$/, // 固定电话号码验证
  isIdCard: /(^[1-9]\d{5}(18|19|([23]\d))\d{2}((0[1-9])|(10|11|12))(([0-2][1-9])|10|20|30|31)\d{3}[0-9Xx]$)|(^[1- 9]\d{5}\d{2}((0[1-9])|(10|11|12))(([0-2][1-9])|10|20|30|31)\d{3}$)/, // 身份证号码验证
  isMoney: /^([1-9][\d]{0,7}|0)(\.[\d]{1,2})?$/, // 金额格式验证(最大金额99999999.99)
  isCreditCard: /^[0-9]*$/, // 银行卡号验证
  isZHCNUserName: /^([\u4e00-\u9fa5]{1,20}|[a-zA-Z\.\s]{1,20})$/, // 大陆居民姓名验证
  isEmoJi: /\uD83C[\uDF00-\uDFFF]|\uD83D[\uDC00-\uDE4F]/, // 表情验证
  isChinese: /[^\u4e00-\u9fa5]+$/, // 汉字校验--数字也会返回true
  isDecimalTwo: /^[0-9]+(.[0-9]{2})?$/, // 两位小数正实数校验
  isDecimalOneOrTwo: /^[0-9]+(.[0-9]{1,2})?$/, // 1~2位小数正实数校验
  isEnSpecialChar: /[`~!@#$%^&*()_+<>?:"{},.\/;'[\]]/im, // 英文特殊字符校验
  isCnSpecialChar: /[·！#￥（——）：；“”‘、，|《。》？、【】[\]]/im, // 中文特殊字符校验
  isHighPassword: /(?=.*[a-zA-Z])(?=.*\d)(?=.*[`~!@#$%^&*()_+<>?:"{},.\/;'[\]])[a-zA-Z\d`~!@#$%^&*()_+<>?:"{},.\/;'[\]]{8,16}/i, // 8-16位由数字字母或英文特殊字符(三者都要有)的密码校验
  isPassword: /^[A-Za-z0-9`~!@#$%^&*()_+<>?:"{},.\/;'[\]]+$/, // 由数字字母英文特殊字符任意组合的密码校验
  isUrl: /(((^(https?|ftp|file)?:(?:\/\/)?)(?:[-;:&=\+\$,\w]+@)?[A-Za-z0-9.-]+(?::\d+)?|(?:www.|[-;:&=\+\$,\w]+@)[A-Za-z0-9.-]+)((?:\/[\+~%\/.\w-_]*)?\??(?:[-\+=&;%@.\w_]*)#?(?:[\w]*))?)$/ //是否为url链接
}