国产xxxx99真实实拍_久久不雅视频_高清韩国a级特黄毛片_嗯老师别我我受不了了小说

資訊專欄INFORMATION COLUMN

正則表達式：從Copy到手寫

SmallBoyO / 965人閱讀

摘要：比如正則表達式為它們分別匹配的是，元字符在正則表達式中，有特殊含義的非數字字符。如果把下面的正則表達式轉換成下圖，會有助于我們理解正則表達式的含義。如果想要讓正則表達式使用非貪婪模式匹配，在量詞后面加個即可。

1. RegExp對象

JavaScript有兩種方式實例化RegExp對象

字面量

構造函數

字面量
const reg = /all/;
console.log(reg);   // /all/
"This is all I have.".replace(reg, "ALL");    // This is ALL I have.
構造函數
const reg = new RegExp("all");
console.log(reg);   // /all/
"This is all I have.".replace(reg, "ALL"); // This is ALL I have.
2. 元字符

原義文本字符

元字符

原義文本字符
代表它本來含義的字符。比如正則表達式為 /abc/、/123/；它們分別匹配的是 abc、123 ，
元字符
在正則表達式中，有特殊含義的非數字字符。如： d w . + () 等。部分元字符的含義并不唯一，在不同的書寫方式，含義可能不同。

元字符表：http://tool.oschina.net/uploads/apidocs/jquery/regexp.html

3. 工具推薦

不是所有正則表達式都像前面寫的那么簡單，因為正則表達式語法有些復雜，我們在寫的時候多多少少也會有些錯誤，或者閱讀別人寫的正則表達式的時候也難理解。

如果把下面的正則表達式轉換成下圖，會有助于我們理解正則表達式的含義。

^http(|s)://[a-zA-Z0-9_-]+(.[a-zA-Z0-9_-]+)+/$

給大家推薦一個工具 https://regexper.com

4. 量詞
字符 含義
+ 出現一次或多次(至少出現一次)
? 出現零次或一次(最多出現一次)
* 出現零次或多次(任意次)
{n} 出現n次
{n, m} 出現n到m次
{n,} 至少出現n次 
// d表示匹配數字
// 匹配一個數字
"1234567890".replace(/d/, "a"); // a234567890
// 匹配一個或多個數字(至少匹配一個)
"1234567890".replace(/d+/, "a"); // a
"1234567890".replace(/d?/, "a"); // a234567890
"1234567890".replace(/d*/, "a"); // a
"1234567890".replace(/d{3}/, "a"); // a4567890
"1234567890".replace(/d{2,4}/, "a"); // a567890
"1234567890".replace(/d{3,}/, "a"); // a
"12".replace(/d{3,}/, "a"); // 12

使用工具 https://regexper.com/ 圖解

d{2,6}

5. 貪婪模式和非貪婪模式

從上面 4. 量詞 的例子中，"1234567890".replace(/d+/, "a"); 輸出的是 a 而不是 a234567890；"1234567890".replace(/d{2,4}/, "a"); 輸出的是 a567890 而不是 a34567890。

貪婪模式：正則表達式盡可能多的匹配，一直到匹配失敗
非貪婪模式：正則表達式盡可能少的匹配，一旦匹配成功就不再匹配

因為默認情況下，正則表達式都是使用貪婪模式做匹配的。如果想要讓正則表達式使用非貪婪模式匹配，在量詞后面加個 ? 即可。

"1234567890".replace(/d{2,4}/, "a");  // a567890
"1234567890".replace(/d{2,4}?/, "a"); // a34567890

"1234567890".replace(/d+/, "a");      // a
"1234567890".replace(/d+?/, "a");     // a234567890
6. 類

正則表達式中，可以使用 [] 來構建一個類，正則表達式中的類是指符合某些特性的對象

字符類 
正則表達式 [abcd] 是把 a、b、c、d 歸為一類，該表達式可以匹配這類字符
"12345a6b7c8D9e".replace(/[abcd]/g, "|");   // 12345|6|7|8D9e
范圍類 
正則表達式提供了 [a-z] 來表示從 a 到 z 的任意字符（包含 a 和 z）
"1a2b3c4q5z".replace(/[a-z]/g, "|");   // 1|2|3|4|5|
"1a2b3c4T5Z".replace(/[a-z]/g, "|");   // 1|2|3|4T5Z
"1a2b3c4T5Z".replace(/[a-zA-Z]/g, "|");   // 1|2|3|4|5|
"1a2b3c4q5z".replace(/[0-9]/g, "|");   // |a|b|c|q|z

[a-zA-Z0-9]

預定義類
字符 等價于 含義
d [0-9] 數字字符
D [^0-9] 非數字字符
w [a-zA-Z0-9_] 字母、數字、下劃線（單詞字符）
W [^a-zA-Z0-9_] 非字母、數字、下劃線（非單詞字符）
s [ x0Bf ] 空白字符
S [^ x0Bf ] 非空白字符
. [^ ] 除了換行、回車之外的任意字符
7. 邊界
字符 含義
^ 以xxx開頭
$ 以xxx結尾
 單詞邊界
B 非單詞邊界 
"img/png/img-1.png".replace(/img/g, "image"); // image/png/image-1.png
"img/png/img-1.png".replace(/^img/g, "image"); // image/png/img-1.png

"img/png/img-1.png".replace(/png/g, "jpg"); // img/jpg/img-1.jpg
"img/png/img-1.png".replace(/png$/g, "jpg"); // img/png/img-1.jpg

"This is all I have.".replace(/is/g, "IS"); // ThIS IS all I have.
"This is all I have.".replace(/is/g, "IS"); // This IS all I have.
"This is all I have.".replace(/Bis/g, "IS"); // ThIS is all I have.
9. 分組 作用

與 | 使用

與量詞使用

反向引用

與 | 使用

/http(|s):///

/http(|s):///.test("https://");   // true
/http(|s):///.test("http://");    // true
/a(b|c)d/.test("ad");               // false
/a(b|c)d/.test("abd");              // true
/a(b|c)d/.test("acd");              // true
與量詞使用

如何匹配 javascript 出現兩次 javascriptjavascript ？

/javascript{2}/.test("javascriptjavascript");    // false
/javascript{2}/.test("javascript");          // true
/(javascript){2}/.test("javascriptjavascript");  // true
反向引用

含有分組的正則表達式匹配成功時，將子表達式匹配到的內容，保存到內存中一個以數字編號的組里，可以簡單的認為是對一個局部變量進行了賦值，這時就可以通過反向引用方式，引用這個局部變量的值。

很多情況下，我們可能需要將某種格式的字符串轉換成另一種格式的字符串。例如：將 05/28/2018 轉換成 2018-05-28；將Markdown語法的超鏈接 [Test](https://www.test.com/) 轉換成HTML的超鏈接 Test

"05/28/2018".replace(/(d{2})/(d{2})/(d{4})/, "$3-$1-$2");
// => 2018-05-28
"[Test](https://www.test.com/)".replace(/[(.+)]((http(|s)://.+))/, "$1");
// => Test
忽略分組

有時候我們在寫正則表達式的時候會多次使用分組，但有一些分組是不需要反向引用的，比如正則表達式 /http(|s):/// 中的分組，我們不需要進行反向引用，這時候我們應該使用 (?:) 來忽略分組

不忽略分組：

/http(|s):///

忽略分組：

/http(?:|s):///

10. 前瞻后顧

正則表達式是從頭部(左)向尾部(右)開始匹配的，文本的尾部方向稱為“前”，文本的頭部方向稱為“后”

前瞻：正則表達式在匹配到規則的時候，向前檢查是否符合斷言

后顧：正則表達式在匹配到規則的時候，向后檢查是否符合斷言

名稱 正則 含義
正向前瞻 exp(?=assert) 向前檢查符合斷言的
負向前瞻 exp(?!assert) 向前檢查不符合斷言的
正向后瞻 (?<=assert)exp 向后檢查符合斷言的
負向后瞻 (? 向后檢查不符合斷言的 
"ab1cde2fg".replace(/[a-z](?=d)/g, "X"); // aX1cdX2fg
"ab1cde2fg".replace(/[a-z](?!d)/g, "X"); // Xb1XXe2XX

"ab1cde2fg".replace(/(?<=d)[a-z]/g, "X"); // ab1Xde2Xg
"ab1cde2fg".replace(/(?
11. 修飾符


global: 是否全文搜索，默認 false


ignoreCase: 是否大小寫敏感，默認 false


multiline: 是否多行搜索，默認 false


lastIndex: 是當前表達式匹配內容的最后一個字符的下一個位置


source: 正則表達式的文本字符



"aaaaa".replace(/a/, "A");      // Aaaaa
"aaaaa".replace(/a/g, "A");     // AAAAA

"aAQq".replace(/[a-z]/g, "X"); // XAQX
"aAQq".replace(/[a-z]/gi, "X"); // XXXX

/[a-z]/.test("AA");    // false
/[a-z]/i.test("AA");    // true

`img/png/img-1.png
img/png/img-1.png
img/png/img-1.png`.replace(/^img/g, "image");
// => image/png/img-1.png
//    img/png/img-1.png
//    img/png/img-1.png
`img/png/img-1.png
img/png/img-1.png
img/png/img-1.png`.replace(/^img/gm, "image");
// => image/png/img-1.png
//    image/png/img-1.png
//    image/png/img-1.png
const reg = /d/gim;
console.log(reg.source);    // d


12. RegExp對象中 test() 和 exec()
test()

用于測試參數字符串中是否存在匹配正則表達式模式的字符串；如果存在則返回true，否則返回false


const reg = /w/;
reg.test("|"); // false
reg.test("a"); // true
reg.test("a"); // true


當使用 g 全文搜索時，test 函數會出現如下問題：




上述問題其實是正則表達式對象的 lastIndex 屬性在作怪




如果正則表達式使用了全文搜索 g ，又想避免上述問題，應在執行 test 函數前先將 lastIndex 置 0


const reg = /w/g;
reg.test("ab"); // true
reg.lastIndex = 0;
reg.test("ab"); // true
reg.lastIndex = 0;
reg.test("ab"); // true

exec()

使用正則表達式模式對字符串執行搜索，并將匹配到的結果以數組形式返回，如果沒有匹配，返回null




結果數組屬性



index：匹配字符的第一個字符的位置


input：被匹配的字符串



返回的數組



第一個元素是與正則表達式匹配的內容


第二個元素是與第一個子表達式相匹配的內容


第三個元素是與第二個子表達式相匹配的內容（以此類推）



現有如下字符串數組，我們使用 exec 從每個元素中提取圖片的路徑


const arr = [
    "[測試1](https://www.test1.com/img/img-1.png)",
    "[測試1](http://www.test1.com/img/img-1.jpg)",
    "[測試2](https://static.test2.com/image/haha/img-1.png)"
]


正則表達式：


const reg = /[.+](http(|s)://[a-zA-Z0-g_-]+(.[a-zA-Z0-9_-]+)+/((.+/)+.+.(png|jpg)))/;




const res = reg.exec(arr[2]);




上述正則表達式使用了較多的分組，我們在閱讀圖形的時候可能造成干擾，忽略不必要的分組。


const reg2 = /[.+](http(?:|s)://[a-zA-Z0-g_-]+(?:.[a-zA-Z0-9_-]+)+/((?:.+/)+.+.(?:png|jpg)))/;




reg2.exec(arr[2]);

文章版權歸作者所有，未經允許請勿轉載,若此文章存在違規行為，您可以聯系管理員刪除。

轉載請注明本文地址：http://specialneedsforspecialkids.com/yun/28720.html

相關文章

  • 正則表達式：從Copy到手寫

    摘要：比如正則表達式為它們分別匹配的是，元字符在正則表達式中，有特殊含義的非數字字符。如果把下面的正則表達式轉換成下圖，會有助于我們理解正則表達式的含義。如果想要讓正則表達式使用非貪婪模式匹配，在量詞后面加個即可。 1. RegExp對象 JavaScript有兩種方式實例化RegExp對象 字面量 構造函數 字面量 const reg = /all/; console.log(reg)...

    flybywind 評論0 收藏0

  • 正則表達式：從Copy到手寫

    摘要：比如正則表達式為它們分別匹配的是，元字符在正則表達式中，有特殊含義的非數字字符。如果把下面的正則表達式轉換成下圖，會有助于我們理解正則表達式的含義。如果想要讓正則表達式使用非貪婪模式匹配，在量詞后面加個即可。 1. RegExp對象 JavaScript有兩種方式實例化RegExp對象 字面量 構造函數 字面量 const reg = /all/; console.log(reg)...

    fxp 評論0 收藏0

  • 使用PHP輔助 快速制作一套自己的手寫字體實踐

    摘要：參考代碼地址四制作字體模板把自己最常接觸的漢字找出來之后，需要制作一套字體模板，這套字體模板的用處是讓手寫漢字后，順利的找到對應的漢字，這里需要依靠第三方網站提供的一些功能。 一、背景 筆者以前在網上看到有民間高手制作字體的相關事跡，覺得把自己的手寫字用鍵盤敲出來是一件很有意思的事情，所以一直有時間想制作一套自己的手寫體，前幾天在網上搜索了一下制作字體的方法，發現技術上并不是太難，結合...

    moven_j 評論0 收藏0

  • 使用lxml代替beautifulsoup

    摘要：深入使用過的都會深深地喜歡上它雖然很流行但是深入了解后你就再也不會使用了我覺得不好用速度也慢雖然可以使用作為解析器了另外這種簡直就是手工時代的操作很多人使用這幾個函數其實它們使用起來不是很愉快手工操作的另一個特征是需要自己手寫正則表達式正則 深入使用過lxml的都會深深地喜歡上它,雖然BeautifulSoup很流行,但是深入了解lxml后,你就再也不會使用bs了 我覺得beautif...

    Drinkey 評論0 收藏0

  • 面試題里的那些各種手寫

    摘要：最近準備初級前端面試，發現有很多手寫實現什么的，例如什么手寫實現，。后面以這道題為引線面試官可能會追問什么是執行上下文的判斷，的區別手寫一個函數實現斐波那契數列首先拷一個阮神在他教程里的一個寫法。 最近準備初級前端面試，發現有很多手寫實現什么的，例如什么手寫實現bind，promise。手寫ajax，手寫一些算法。翻閱了很多書籍和博客。 這里做一個總結改進，算是對我后面大概為期一個月找...

    wh469012917 評論0 收藏0

發表評論

0條評論

最新活動
閱讀需要支付1元查看
<