正则表达式可以通过字面量或RegExp构造函数定义。

var pattern2 = /\[bc\]at/i;
var pattern2 = new EegExp("[bc]at", "i");

匹配示例：

一个正则表达式是一个模式与标志的组合体。

• 模式部分可以是任何简单或复杂的正则表达式。
  • 模式中使用的所有元字符都必须转义
• 标志：
  • g：全局模式，模式将被应用于所有字符串。
  • i：不区分大小写模式。
  • m：多行模式。
  • y：粘附模式，表示只查找从lastIndex开始及之后的字符串。
  • u: Unicode模式，启用Unicode匹配。
  • s：dotAll模式，表示元字符．匹配任何字符（包括\n或\r）

    RegExp实例方法

    1、exec()专门为捕获组而设计
    https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/RegExp/exec

    // Match "quick brown" followed by "jumps", ignoring characters in between
    // Remember "brown" and "jumps"
    // Ignore case
    let re = /quick\s(brown).+?(jumps)/igd;
    let result = re.exec('The Quick Brown Fox Jumps Over The Lazy Dog');

    参数：要应用模式的字符串
    返回值

2、test()用于检测目标字符串与某个模式是否匹配

捕获组与非捕获组

https://shimo.im/docs/GdKhP9QgxXHpqPpP/read

• 捕获组
  • 目的：为了将分组中匹配到的内容保存到内存中，以供后续使用
  • 形式：
    • 捕获组：使用()包起来的正则表达式
    • 命名捕获组
      • ES6新增
      • 写法：(?pattern) 或 (?’name’pattern)
      • 
  • 应用：详见【实战演练：捕获组反向引用】
• 非捕获组
  • 存在的意义是只匹配字符信息，不捕获文本，从而节省内存
  • 除命名捕获组外，凡是以 (?) 开头的捕获组就是非捕获组
  • 非捕获组具有以下特点：
    • 不捕获文本，不占用内存无分组编号
    • 不可被反向引用

      元字符

      所有元字符见：https://www.runoob.com/regexp/regexp-metachar.html

      基础元字符

      | \ | 将下一个字符标记为一个特殊字符、或一个原义字符、或一个 向后引用、或一个八进制转义符。
      例如，’n’ 匹配字符 “n”。’\n’ 匹配一个换行符。序列 ‘\\‘ 匹配 “\“ 而 “\(“ 则匹配 “(“。 | | —- | —- | | ^ | 匹配输入字符串的开始位置。
      如果设置了 RegExp 对象的 Multiline 属性，^ 也匹配 ‘\n’ 或 ‘\r’ 之后的位置。 | | $ | 匹配输入字符串的结束位置。
      如果设置了RegExp 对象的 Multiline 属性，$ 也匹配 ‘\n’ 或 ‘\r’ 之前的位置。 | | | 匹配前面的子表达式零次或多次。例如，zo 能匹配 “z” 以及 “zoo”。 等价于{0,}。 | | + | 匹配前面的子表达式一次或多次。
      例如，’zo+’ 能匹配 “zo” 以及 “zoo”，但不能匹配 “z”。+ 等价于 {1,}。 | | . | 匹配除换行符（\n、\r）之外的任何单个字符。
      要匹配包括 ‘\n’ 在内的任何字符，请使用像”(.|\n)“的模式。 | | ? | 匹配前面的子表达式零次或一次。例如，”do(es)?” 可以匹配 “do” 或 “does” 。? 等价于 {0,1}。 | | ? | 当该字符紧跟在任何一个其他限制符 【, +, ?, {n}, {n,}, {n,m}】后面时，匹配模式是非贪婪的。
      非贪婪模式尽可能少的匹配所搜索的字符串。
      例如，对于字符串 “oooo”，’o+?’ 将匹配单个 “o”，而 ‘o+’ 将匹配所有 ‘o’。 |

集合元字符

字符系列

捕获组、非捕获组

{}系列

匹配多少次

其他补充

String.prototype.replace

https://developer.mozilla.org/zh-CN/docs/Web/JavaScript/Reference/Global_Objects/String/replace
第二个参数是Function时，该函数的变量信息：

主要用到前2个，比如：

• match：【字符串首字母大写】
• p1,p2：【将字符串驼峰化】

  全局标志会改变正则的lastindex

  

  实战演练

  例题：https://juejin.cn/post/7070284710131269669
  测试工具：https://c.runoob.com/front-end/854/
  可视化工具：https://regexper.com/#%2F%5C%2F%5C%2F%28.%29%2B%2Fg

  捕获组反向引用

  ```javascript const date = ‘2021-02-10’; // 捕获组 date.replace(/(\d{4})-(\d{2})-(\d{2})/, ‘$1-$3-$2’); // ‘2021-10-02’

// 命名捕获组 date.replace(/(?\d{4})-(?’month’\d{2})-(?\d{2})/,’$-$-$‘); // ‘10-02-2021’

<a name="fz2JW"></a>
## 实现一个 trim 方法
[https://www.cnblogs.com/rubylouvre/archive/2009/09/18/1568794.html](https://www.cnblogs.com/rubylouvre/archive/2009/09/18/1568794.html)（介绍了12种实现）<br />str.replace(/^\s\s*/, '').replace(/\s\s*$/, '');<br />str.replace(/^\s+|\s+$/g, '');
<a name="rZKlJ"></a>
## 解析url
```javascript
function urlParse(url) {
  const paramStr = /.+\?(.+)$/.exec(url)[1]; // 将 ? 后面的字符串取出来
  const paramAtr = paramStr.split('&');
  const obj = {};
  paramArr.forEach((param) => {
    if(param.includes('=')) { // 处理有=的参数/=/.test(param)
      let [key, val] = param.split('=');
      val = decodeURIComponent(val); // 解码
      val = /^\d+$/.test(val) ? parseFloat(val) : val; // 判断是否转为数字
      // 添加对象
      if(obj[key]) {
        obj[key] = [].concat(obj[key], val)
      } else {
        obj[key] = val; 
      }
    } else {
      obj[param] = true;
    }
  });
  return obj;
}

模板字符串（非react）

模板字符串形态’我是{{name}}，年龄{{age}}，性别{{sex}}’
模板字符串正则：/{{(\w+)}}/

function render(template, data) {
  const reg = /\{\{(\w+)\}\}/
  if(reg.test(template)) {
    const name = reg.exec(template)[1];
    template = template.replace(reg, data[name]);
    return render(template, data);
  } else {
   return template; 
  }
}

示例：

数字价格千分位分割

知识点：

• (?!pattern) not followed by
• (?=pattern) follewed by

'123456789'.replace(/(?!^)(?=(\d{3})+$)/g, ',') // 123,456,789

手机号344分割：每四个数字前的位置，并把这个位置替换为-

'18379836654'.replace(/(?=(\d{4})+$)/g, '-') // 183-7983-6654

将字符串驼峰化

function camelCase(str) {
  const reg = /[-_\s]+(.)?/g
  str.replace(reg, (match, char) => {
    // char匹配的是第一个()内的内容
    return char ? char.toUpperCase() : ''
  });
  return str;
}
console.log(camelCase('foo Bar')) // fooBar
console.log(camelCase('foo-bar--')) // fooBar
console.log(camelCase('foo_bar__')) // fooBar

字符串首字母大写

找到字符串的开头字符+所有以空格开头的首字符
\s+可以匹配多空格情况

function capitalize(str) {
  const reg = /(?:^|\s+)\w/g;
  return str.toLowerCase().replace(reg, (match) => match.toUpperCase());
}
console.log(capitalize('hello world')) // Hello World
console.log(capitalize('hello WORLD')) // Hello World

提取连续重复的字符

反向引用的应用

function collectRepeatStr(str) {
  const reg = /(.+)\1+/g
  const result = [];
  return str.replace(reg, ($0, $1) => {
    $1 && result.push($1)
  });
  return result;
}
console.log(collectRepeatStr('11')) // ["1"]
console.log(collectRepeatStr('12323')) // ["23"]
console.log(collectRepeatStr('12323454545666')) // ["23", "45", "6"]

实用VSCode正则

查找带有extra属性的TreeNode组件引用：

(?<=<TreeNode)(.*\n)*\s{1,}extra=

其他组件类似

不可输入—

先排除-是为了防止永远进入到第一个判断。