Element 的神奇用法

前言

  最近在找 URL 的正則表達式時意外發現 Element 的神奇用法，在此做個紀錄。

內容

  範例如下

var a = document.createElement('a');
 a.href = 'http://www.example.com:123/foo/bar.html?fox=trot#foo';

 ['href','protocol','host','hostname','port','pathname','search','hash'].forEach(function(k) {
    console.log(`${k}:${a[k]}`);
 });
//href:http://www.example.com:123/foo/bar.html?fox=trot#foo
//protocol:http:
//host:www.example.com:123
//hostname:www.example.com
//port:123
//pathname:/foo/bar.html
//search:?fox=trot
//hash:#foo

範例使用 Element 來解析 URL ， 先造好 Element ，在賦予 URL ，接著就可以透過陣列的方式取得 URL 的各項解析，要注意的是 [0] 代表的是完整的 URL ，從 [1] 開始才是各項解析。

參考資料

[ tw.coderbridge.com ] 獲取URL的一部分(正則表達式) (Getting parts of a URL (Regex))

 正則表達式的非貪心量化

前言

  最近在 [ zh.wikipedia.org ] 正規表示式 裡發現非貪心量化的寫法，在此把學習的過程做個紀錄。

內容

  範例如下

const reg = /\d+?/dg;
let s = '123_456,12_34';
for( const match of s.matchAll(reg) ){
  console.log(match.indices );
}
//Result
//[[0, 1]]
//[[1, 2]]
//[[2, 3]]
//[[4, 5]]
//[[5, 6]]
//[[6, 7]]
//[[8, 9]]
//[[9, 10]]
//[[11, 12]]
//[[12, 13]]

所謂的非貪心量化是指在 + 、 * 、 ? 與 {,}的後方再加一個"?"這樣可以打搜尋的結果分割成每一個符合條件的個體，範例如果只使用"\d+"的話，搜尋的結果只會有 4 個，加了"?"後就變成每個數字都是結果了。

參考資料

[ zh.wikipedia.org ] 正規表示式

 簡易的身分證字號的正則表達式

前言

  最近在 [ zh.wikipedia.org ] 正規表示式 裡發現身分證字號的正則表達式，在此做個紀錄。

內容

  範例如下

簡易的身份證字號的正則表達式

表達是寫法是"\w[1289]\d{8}"，要注意的是身份證字號的第一個數字只可能是 1 、 2 、 8 或 9 ，第二個身分證字號不符合是因為數字開頭不符合，當然這畢竟是簡易的，並非身份證字號的完整規則。

參考資料

[ zh.wikipedia.org ] 正規表示式

[ coding.tools ] 正則表達式在線測試工具

 在正則表達式過濾特定開頭的寫法

前言

  在之前的 在正則表達式過濾特定結尾的寫法 有過濾特定字尾的寫法，由於在 [ developer.mozilla.org ] 正規表達式 裡只介紹"過濾特定字尾"，但最近發現"過濾特定開頭"的寫法，在此把學習的過程做個紀錄。

內容

  最近在 [ zh.wikipedia.org ] 正規表示式 裡發現有"過濾特定開頭"的寫法，範例如下

過濾特定開頭的寫法

正則表達式的寫法是"?<="，範例中符合條件的只有"Windows"，這就是和之前的 在正則表達式過濾特定結尾的寫法 相反的寫法。

  本以為在 [ developer.mozilla.org ] 正規表達式 裡已是全部的寫法了，但 [ zh.wikipedia.org ] 正規表示式 裡介紹的比較全，這次的學習就到此結束。

參考資料

[ developer.mozilla.org ] 正規表達式

[ coding.tools ] 正則表達式在線測試工具

[ zh.wikipedia.org ] 正規表示式

相關文章與資料

在正則表達式過濾特定結尾的寫法

 正則表達式的檢查非換行字元

前言

  最近看到正則表達式裡有"."的寫法，在此做個紀錄。

內容

  "."的寫法範例如下

"."的用法

查了一下 [ developer.mozilla.org ] 正規表達式 後解說如下"匹配除了換行符號之外的單一字元"，在範例裡所有有"n"的內容都匹配了，但最後一個"n"卻不匹配，原因是因為它前方有換行符號，所以"."也可以換成"[^\r\n]"，不過"."比較簡短就是了。

參考資料

[ developer.mozilla.org ] 正規表達式

[ coding.tools ] 正則表達式在線測試工具