99re热视频这里只精品,久久久天堂国产精品女人,国产av一区二区三区,久久久精品成人免费看片,99久久精品免费看国产一区二区三区

Javascript 量詞 +, *, ? 和 {n}

2023-02-17 11:01 更新

假設我們有一個像這樣 ?+7(903)-123-45-67? 的字符串，并想要找到其中所有數(shù)字。但與之前不同的是，我們對單個數(shù)字不感興趣，只對全數(shù)感興趣：?7, 903, 123, 45, 67?。

數(shù)字是一個或多個數(shù)字 \d 的序列。為了標記我們需要的數(shù)量，我們需要加一個 量詞。

數(shù)量 {n}

最簡單的量詞便是大括號中的數(shù)字：{n}。

在一個字符（或一個字符類，或 [...] 等）后附加一個量詞，用來指出我們具體需要的數(shù)量。

它有一些高級的形式，讓我們看一些例子：

確切的位數(shù)：{5}

\d{5} 表示 5 位數(shù)，與 \d\d\d\d\d 相同。

下面這個例子查找一個五位數(shù)的數(shù)字： 

alert( "I'm 12345 years old".match(/\d{5}/) ); //  "12345"

我們可以添加 \b 來排除位數(shù)更多的數(shù)字：\b\d{5}\b。

范圍：{3,5}，匹配 3-5 個

要查找 3-5 位的數(shù)字，我們可以將限制寫在花括號中：\d{3,5} 

alert( "I'm not 12, but 1234 years old".match(/\d{3,5}/) ); // "1234"

我們可以省略上限。

那么正則表達式 \d{3,} 就會查找位數(shù)大于等于 3 的數(shù)字： 

alert( "I'm not 12, but 345678 years old".match(/\d{3,}/) ); // "345678"

讓我們回到字符串 +7(903)-123-45-67。

我們如果需要一個及以上的數(shù)字，就使用 \d{1,}： 

let str = "+7(903)-123-45-67";

let numbers = str.match(/\d{1,}/g);

alert(numbers); // 7,903,123,45,67

縮寫

大多數(shù)常用的量詞都有簡寫形式：

?+?

代表“一個或多個”，與 {1,} 相同。

例如，\d+ 用來查找所有數(shù)字： 

let str = "+7(903)-123-45-67";

alert( str.match(/\d+/g) ); // 7,903,123,45,67

???

代表“零個或一個”，與 {0,1} 相同。換句話說，它使得符號變得可選。

例如，模式 ou?r 查找 o，后跟零個或一個 u，然后是 r。

所以 colou?r 會找到 color 和 colour： 

let str = "Should I write color or colour?";

alert( str.match(/colou?r/g) ); // color, colour

?*?

代表“零個及以上”，與 {0,} 相同。也就是說，字符可以出現(xiàn)任何次數(shù)或者不出現(xiàn)。

例如，\d0* 查找一個數(shù)字后面跟著任意數(shù)量的零（可能有很多或沒有）的數(shù)字： 

alert( "100 10 1".match(/\d0*/g) ); // 100, 10, 1

將其與 +（一個或更多）做比較： 

alert( "100 10 1".match(/\d0+/g) ); // 100, 10
// 1 沒有被匹配出來，因為 0+ 要求至少有一個 0

更多示例

量詞是很常用的。它們是構成復雜正則表達式的主要“模塊”，所以讓我們看更多示例。

小數(shù)的正則表達式（帶浮點的數(shù)字）：\d+\.\d+

實現(xiàn)： 

alert( "0 1 12.345 7890".match(/\d+\.\d+/g) ); // 12.345

”沒有特性（attribute）的打開的 HTML 標簽（例如 <span> 或 <p>）“的正則表達式。

  1. 最簡單的：/<[a-z]+>/i 

    alert( "<body> ... </body>".match(/<[a-z]+>/gi) ); // <body>

    正則表達式查找的匹配項是字符 '<' 后跟一個或多個拉丁字母，然后是 '>'。

  2. 進階版：/<[a-z][a-z0-9]*>/i

    根據標準，HTML 標簽名稱可以在除了第一個位置之外的任何位置有一個數(shù)字，例如 <h1>。

    alert( "<h1>Hi!</h1>".match(/<[a-z][a-z0-9]*>/gi) ); // <h1>

“打開或關閉的不帶特性的 HTML 標簽”的正則表達式：/<\/?[a-z][a-z0-9]*>/i

我們在模式開頭附近添加了一個可選的斜杠 /?。必須用一個反斜杠轉義它，否則 JavaScript 會認為它是這個模式的結束符。 

alert( "<h1>Hi!</h1>".match(/<\/?[a-z][a-z0-9]*>/gi) ); // <h1>, </h1>

為了使正則表達式更精確，我們通常需要使其更復雜

我們能夠從這些例子中看到一個共同的規(guī)則：正則表達式越精確 —— 它就越長越復雜。

例如，對于 HTML 標簽，我們可以使用更簡單的正則表達式：<\w+>。但是由于 HTML 對標簽名稱有更嚴格的限制，所以 <[a-z][a-z0-9]*> 更可靠

我們可以使用 <\w+> 還是需要 <[a-z][a-z0-9]*>？

在實際開發(fā)中，這兩種變體都是可以接受的。具體用哪個取決于我們對于“額外”匹配的寬容程度，以及通過其他方式將它們從結果中刪除的困難程度。

任務

如何找到省略號 "..."？

重要程度: 5

創(chuàng)建一個正則表達式來查找省略號：連續(xù) 3（或更多）個點。

例如：

let regexp = /你的正則表達式/g;
alert( "Hello!... How goes?.....".match(regexp) ); // ..., .....

解決方案

答案： 

let regexp = /\.{3,}/g;
alert( "Hello!... How goes?.....".match(regexp) ); // ..., .....

請注意，點（.）是一個特殊字符，所以我們必須對其進行轉義，即將其插入為 \.。

針對 HTML 顏色的正則表達式

創(chuàng)建一個正則表達式來查找格式為 #ABCDEF 的 HTML 顏色值：首個字符是 #，后面緊接著的是六位的十六進制字符。

用例： 

let regexp = /...你的正則表達式.../

let str = "color:#121212; background-color:#AA00ef bad-colors:f#fddee #fd2 #12345678";

alert( str.match(regexp) )  // #121212,#AA00ef

P.S. 在這個任務中，我們不需要其他的顏色格式，例如 #123 或 rgb(1,2,3) 等。

解決方案

我們需要尋找首個字符是 #，后面緊接著的是六位的十六進制字符的匹配項。

一個十六進制字符可以描述為 [0-9a-fA-F]。如果我們使用修飾符 i，那么只需要 [0-9a-f]。

然后我們可以使用量詞 {6} 來查找其 6 個字符。

那么，我們得到正則表達式：/#[a-f0-9]{6}/gi。

let regexp = /#[a-f0-9]{6}/gi;

let str = "color:#121212; background-color:#AA00ef bad-colors:f#fddee #fd2"

alert( str.match(regexp) );  // #121212,#AA00ef

問題是其從更長的序列中匹配了顏色值：

alert( "#12345678".match( /#[a-f0-9]{6}/gi ) ) // #123456

為了解決這個問題，我們可以在末尾加上 \b：

// 顏色值
alert( "#123456".match( /#[a-f0-9]{6}\b/gi ) ); // #123456

// 不是顏色值
alert( "#12345678".match( /#[a-f0-9]{6}\b/gi ) ); // null


以上內容是否對您有幫助：
在線筆記
App下載
App下載

掃描二維碼

下載編程獅App

公眾號
微信公眾號

編程獅公眾號