前端正規表示式基礎

lihaixing發表於2018-09-15
前端

目標：解決兩個問題

  • 不認識，怎麼辦？
  • 不會寫，怎麼辦？
/^(?!0+(?:.0+)?$)(?:[1-9]d*|0)(?:.d{1,2})?$/

例項化RegExp物件

字面量 ：var reg = /is/g;

建構函式：var reg = new RegExp(`\bis\b`,`g`);

正則基礎——修飾符

g    全域性匹配（會查詢所有匹配，不會在查詢到第一個匹配時就停止）
i    執行對大小寫不敏感的匹配
m    執行多行匹配

正則進階——貪婪模式和非貪婪模式

// 貪婪模式(預設):

`1234ab`.replace(/d{3,4}/g,`大`)

// 非貪婪模式: 量詞後加？

`1234ab`.replace(/d{3,4}?/g,`大`)

正則進階——分組

// 使用()達到分組效果

`xingxing`.replace(/xing{2}/,`大’)

`xingxing`.replace(/(xing){2}/,`大`)

正則進階——或

// 使用 | 達到或的效果

Hai|xing

H(ai|xi)ng

正則進階——前瞻和後顧

// 前瞻： exp1(?=exp2)     查詢exp2前面的exp1

    `window2003`.replace(/window(?=d{4})/,`大`)

// 負前瞻:  exp1(?!exp2)     查詢後面不是exp2的exp1

    `window200`.replace(/window(?!d{4})/,`大`)

// 後顧(js不支援):  (?<=exp2)exp1   查詢exp2後面的exp1

    `2003window`.replace(/(?<=d{4})window/g,`大`)

// 負後顧(js不支援):  (?<!exp2)exp1   查詢前面不是exp2的exp1

    `200window`.replace(/(?<!d{4})window/g,`大`)

參考資料

視覺化工具：https://jex.im/regulex
慕課網視訊教程：https://www.imooc.com/video/1…

相關文章