正则表达式

创建

创建正则表达式的方式

• 字面量创建正则表达式 =>没有办法操作变量

  • 字面量创建的正则表达式需要采用变量时需要使用eval()方法将字符串变为js语句

  let str = 'regexp'
  let as = 'e'
  console.log(eval(`/${as}/`).text(str));
  

• 使用对象创建正则表达式

    let str = 'regexp'
    let reg = new RegExp('e','g')
    // 对象创建的正则表达式不需要写/ /转义符，并且可以直接使用变量
    reg.test(str)
  

  使用对象创建的正则表达式的一个小demo

  <div class='text'> this is a text !<div>
  <script>
    let key = prompt('请输入要匹配的字符')
    let reg = new RegExp(key, 'g')
    let text = document.querySelector('.text')
    text.innerHTML = text.innerHTML.replace(reg, search => {
      return `<span style='color:red'>${search}</span>`
    })
  </script>
  

  html dom prompt() 方法
  prompt(text,defaultText)

  参数	描述
  text	可选。对话框中要显示的提示文本。
  defaultText	可选。默认的输入文本。

选择符的使用

  let tel = '010-1111111'
  console.log(/010\-\d{7,8}|020\-\d{7,8}/.test(tel))
  // 原子组
  console.log(/(010|020)\-\d{7,8}/.test(tel))

原子表和原子组

[] ()
原子组[123456]
表示任意匹配其中一个
原子表(12|34)
表示匹配选择符两边的任意一组

  let reg = /[123456]/
  let reg1 = /(12|34)/
  let str ='1241256'
  str.match(reg)  --->  1
  str.match(reg1) --->  12 12

转义符’’

let price = 12.34
// 这里需要将.和d转义所以用到了'\'
consloe.log(/\d+\.\d+/.test(price))
// 在对象法创建的正则中需要用双斜杠转义，因为'/d'==='d'
let reg = new RegExp('\\d+\\.\\d+')
let link = 'https://www.baidu.com'
console.log(/https?:\/\/\w+\.\w+\.\w+/.test(link))
// 这时的匹配还不完整，需要完整匹配需要下一章字符边界约束的知识

字符边界约束

^起始符 $结束符
还是上面的例子 price应该为全数字并且小数点之后最多两位

let price = 12.56
console.log(/^\d+\.\d{2}$/.test(price))

空白元字符

  let hd = `张三:010-99999999,李四:010-88888888`;
  console.log(hd.match(/[^-\d:,\s]+/g));
  // \s 匹配空白元字符 \S匹配非空白字符
  // 在原子组中[^]表示除了某些后边匹配到的字符剩下的字符
  // 例如[^\d\s-:,]表示除了 数字 空白符 - ： ，字符剩下的字符

w和W

\w匹配数字字母下划线

  let email = `1471062948@qq.com`
  console.log(email.match(/^\w+@\w+.\w+$/))

\W匹配 除了 数字字母下划线

点元字符

\d 数字0-9 \w 数字字母下划线 \s 空白符 . 除了换行符
如果想要单独匹配一个. 就需要用转义符来转义.

匹配所有字符

[\w\W] [\d\D] [\s\S]

模式修正符

  let str = 'searchText'
  console.log(str.match(/t/gi))
  //  这样可以匹配到两个t 一个大写一个小写
  console.log(str.replace(/t/gi, '@'))
  // 这样可以把匹配到的字符全部替换成想要的字符

m多行匹配实例

  let books = `
    #1 《三国演义》, 200元 #
    #2 《红楼梦》, 300元 #
    #3 www.baidu.com # 
    #4 《西游记》, 600元 #
    `;
    // 有这样一组数据，我们想把它格式化成如下格式
    [{id:1,name:'《三国演义》',price:'200元'}]
    // 首先我们从源数据中切割出需要的信息
    let res = books.match(/^\s*#\d+\s+.+\s+#$/gm)
    // 我们用match匹配到一个数组得到有效的数据
    let booksRes = res.map(item => {
    // console.log(item.trim().replace(/#/g, '').replace(/,/g, ' '))
    let [id, name, price] = item.trim().replace(/#/g, '').replace(/,/g, ' ').replace(/\s+/g, ' ').split(' ')
    return { id, name, price }
  })
  console.log(booksRes);