正则表达式

菜鸟教程 正则表达式 (opens new window) 在线正则验证 (opens new window)

语法

- [ABC]   	  匹配 [...] 中的所有字符
- [^ABC]   	  匹配 除了[...] 中的所有字符
- [0-9a-zA-Z] 匹配 0-9 a-z A-Z区间的字符
- .           匹配除换行符（\n、\r）之外的任何单个字符，相等于 [^\n\r]。
- [\s\S]      匹配所有。\s 是匹配所有空白符，包括换行，\S 非空白符，不包括换行。
- \w          匹配字母、数字、下划线。等价于 [A-Za-z0-9_]
- \W          匹配非字母、数字、下划线。等价于 '[^A-Za-z0-9_]'。
- \d          匹配一个数字字符。等价于 [0-9]。
- \D          匹配一个非数字字符。等价于 [^0-9]。
- \num        匹配 num，其中 num 是一个正整数。对所获取的匹配的引用。例如，'(.)\1' 匹配两个连续的相同字符。

修饰符

- i    不区分大小写
- g    全局匹配
- m    多行匹配    使边界字符 ^ 和 $ 匹配每一行的开头和结尾，记住是多行，而不是整个字符串的开头和结尾。
- s    特殊字符圆点 . 中包含换行符 \n   默认情况下的圆点 . 是 匹配除换行符 \n 之外的任何字符，加上 s 修饰符之后, . 中包含换行符 \n。

非打印字符

- \cx  匹配由x指明的控制字符。例如， \cM 匹配一个 Control-M 或回车符。x 的值必须为 A-Z 或 a-z 之一。否则，将 c 视为一个原义的 'c' 字符。
- \f   匹配一个换页符。等价于 \x0c 和 \cL。
- \n   匹配一个换行符。等价于 \x0a 和 \cJ。
- \r   匹配一个回车符。等价于 \x0d 和 \cM
- \t   匹配一个制表符。等价于 \x09 和 \cI。
- \v   匹配一个垂直制表符。等价于 \x0b 和 \cK。
- \s   匹配任何空白字符，包括空格、制表符、换页符等等。等价于 [ \f\n\r\t\v]。注意 Unicode 正则表达式会匹配全角空格符。
- \S   匹配任何非空白字符。等价于 [^ \f\n\r\t\v]。

特殊字符

- ^    匹配输入字符串的开始位置，在方括号中使用时表示不接受方括号表达式中的字符集合
- $    匹配输入字符串的结尾位置。如果设置了 RegExp 对象的 Multiline 属性，则 $ 也匹配 '\n' 或 '\r'。
- ( )  标记一个子表达式的开始和结束位置。子表达式可以获取供以后使用。 在JScript 中则使用 $0…$9 属性。要匹配圆括号字符，请使用 '\(' 或 '\)'。
- *    匹配前面的子表达式零次或多次
- +    匹配前面的子表达式一次或多次
- .    匹配除了换行符\n之外的任何单字符
- ?    匹配前面的子表达零次或一次
- \    将下一个字符标记为特殊字符
- [    标记一个中括号表达式的开始
- {    标记限定符表达式的开始
- |    指明两项之间的一个选择

限定符

- *    匹配前面的子表达式零次或多次， 等价于{0,}
- +    匹配前面的子表达式一次或多次,  等价于{1,}
- ?    匹配前面的子表达式零次或一次,  等价于{0,1}
- {n}  n是一个非负整数，匹配确定的n次
- {n,m} n <=m , 最少匹配n次而且最多匹配m次，注意逗号和两个数直接不能有空格

定位符

- ^    匹配输入字符串开始的位置。如果设置了 RegExp 对象的 Multiline 属性，^ 还会与 \n 或 \r 之后的位置匹配。
- $    匹配输入字符串结尾的位置。如果设置了 RegExp 对象的 Multiline 属性，$ 还会与 \n 或 \r 之前的位置匹配。
- \b   匹配一个单词边界，即字与空格间的位置。
- \B   非单词边界匹配。

转义

- 要匹配特殊字符,和限定符的话，要加转义符合 \  例如： \$   \\   \.

选择

- () 表示捕获分组，() 会把每个分组里的匹配的值保存起来， 多个匹配值可以通过数字 n 来查看(n 是一个数字，表示第 n 个捕获组的内容)。
- |
- 列出 ?=、?<=、?!、?<! 的使用区别
    - exp1(?=exp2)   查找 exp2 前面的 exp1。
    - (?<=exp2)exp1  查找 exp2 后面的 exp1。
    - exp1(?!exp2)   查找后面不是 exp2 的 exp1。
    - (?<!exp2)exp1  查找前面不是 exp2 的 exp1。

方法

• search() 方法可使用正则表达式或字符串作为参数。字符串参数会转换为正则表达式：

var str = "Visit Runoob!"; 
var n = str.search(/Runoob/i);
var n = str.search("Runoob");

• test() 方法用于检测一个字符串是否匹配某个模式，如果字符串中含有匹配的文本，则返回 true，否则返回 false。

var patt = /e/;
patt.test("The best things in life are free!");

/e/.test("The best things in life are free!")

• match() 方法可在字符串内检索指定的值，或找到一个或多个正则表达式的匹配。返回数组

var str = "The rain in SPAIN stays mainly in the plain"; 
var n = str.match(/ain/gi); // ['ain', 'AIN', 'ain', 'ain']

str.match(/ain/) == 'ain'   // ture    这里其他拿到的是 ['ain']    经过 == 隐示转换， 把['ain'].toStrin() == 'ain'

• String.prototype.replace() 替换

语法： str.replace(regexp|substr, newSubStr|function)

• function(match, p1, p2..., offset, string, NamedCaptureGroup)
  • match 匹配的子串。（对应于上述的$&。）
  • p1,p2, ... 假如replace()方法的第一个参数是一个RegExp 对象，则代表第n个括号匹配的字符串。（对应于上述的$1，$2等。）例如，如果是用 /(\a+)(\b+)/ 这个来匹配，p1 就是匹配的 \a+，p2 就是匹配的 \b+。
  • offset 匹配到的子字符串在原字符串中的偏移量。（比如，如果原字符串是 'abcd'，匹配到的子字符串是 'bc'，那么这个参数将会是 1）
  • string 被匹配的原字符串。
  • NamedCaptureGroup 命名捕获组匹配的对象

如何用 vscode 在项目中将颜色值统一替换为变量？如 color: #F5F5F5; 替换为 color: $color-F5F5F5;

- #([0-9a-fA-F]{3,6});
- $color-$1;
- .js,.gitignore,.md,.svg,var.scss

面试题：用正则表达式书写一个获取URL参数的函数

function getUrlParmas(name){
    const reg = new RegExp("(^|&)" + name + "=([^&]*)(&|$)", "i")
    let result = window.location.search.substr(1).match(reg)
    if(result !== null){
        return unescape(result[2])
    }
    return null
}
window.location = 'http://www.baidu.com?name=yu&age=18'
let name = getUrlParams('name')


// 获取所有的url参数
function paramesUrl(url){
    let pattern = /(\w+)=(\w+)/ig
    let parames = {}
    url.replace(pattern, function(a, b, c){
        parames[b] = c
    })
    return parames
}

let url = 'http://www.baidu.com?name=yu&age=18'
let params = paramesUrl(url)
console.log(params)

用正则实现千分位分隔符，如将 1234567 转为 1,234,567

(\d)(?=(\d{3})+.)

(?<!..*)(\d)(?=(?:\d{3})+(?:$|.))

num.toString().replace(/(?<!\..*)(\d)(?=(?:\d{3})+($|\.))/g, '$1,')

/**
 * 格式化数字，每隔三位添加逗号
 * @param {number} num 数值
 * @returns {string} 格式化后的数值字符串
 */
export function parseNum(num) {
  try {
    return num.toString().replace(/(?<!\..*)(\d)(?=(?:\d{3})+($|\.))/g, '$1,')
  } catch (error) {
    const numberString = (num || 0).toString()
    // 在转换一些以万为单位的金额时，小数点位数会超过3位，小数点中的数字暂不解析
    const decimalPointIndex = numberString.indexOf('.')
    let intString = decimalPointIndex > -1 ? numberString.slice(0, decimalPointIndex) : numberString
    let decimalString = decimalPointIndex > -1 ? numberString.slice(decimalPointIndex) : ''
    return intString.replace(/(\d)(?=(?:\d{3})+($|\.))/g, "$1,") + decimalString
  }
}

分析一下这个正则表达式：/^(?=.*[A-Za-z])(?=.*\d)[A-Za-z\d]{8,}$/