JavaScript可以使用正規表示式的\s來匹配空白字元，但究竟有哪些字元會被當作空白字元呢？在JavaScript中，全形空白　也算是空白字元嗎？這篇文章將會給各位解答。



正規表示式匹配的空白字元

在JavaScript中，要判斷一個字元是否為空白字元，最簡單的方式就是使用正規表示式的/\s/來測試。程式如下：

console.log((/\s/).test(" "));

\s除了能匹配到半形空白字元外，其它「差不多」的字元也是能匹配到。

執行以下的JavaScript程式可以找出所有會被\s匹配的字元：

for (let ch = 0;ch < 65536;++ch) {
    const s = String.fromCharCode(ch);
    
    if ((/\s/).test(s)) {
        console.log(`\\u${ch.toString(16).padStart(4, "0")} [${new TextEncoder().encode(s).join(", ")}]`);
    }
}

執行結果如下：

輸出的第一個欄是字元的16進制字元值，第二個欄位是以UTF-8編碼之後的位元組陣列(Uint8Array)。

\u0009 [9]
\u000a [10]
\u000b [11]
\u000c [12]
\u000d [13]
\u0020 [32]
\u00a0 [194, 160]
\u1680 [225, 154, 128]
\u2000 [226, 128, 128]
\u2001 [226, 128, 129]
\u2002 [226, 128, 130]
\u2003 [226, 128, 131]
\u2004 [226, 128, 132]
\u2005 [226, 128, 133]
\u2006 [226, 128, 134]
\u2007 [226, 128, 135]
\u2008 [226, 128, 136]
\u2009 [226, 128, 137]
\u200a [226, 128, 138]
\u2028 [226, 128, 168]
\u2029 [226, 128, 169]
\u202f [226, 128, 175]
\u205f [226, 129, 159]
\u3000 [227, 128, 128]
\ufeff [239, 187, 191]

從以上結果我們可以得知，\s的匹配範圍為：

  • 水平定位符號(TAB字元)\u0009(\t)。
  • 換行字元\u000A(\n)。
  • 垂直定位符號\u000B。
  • 換頁字元\u000C。
  • 回車字元\u000D(\r)。
  • 半形空白字元\u0020。
  • 全形空白字元\u3000。
  • 其它不同寬度的空白字元。(\u00A0、\u1680、\u2000 ~ \u200A、\u202F、\u205F)
  • 行分隔字元\u2028。
  • 段落分隔字元\u2029。
  • 零寬空格字元\uFEFF。

String.trim()消除的空白字元

JavaScript的字串有提供trim()、trimStart()、trimEnd()等方法，用來消除字串頭尾的空白字元。但哪些字元會被當作是空白字元呢？執行以下的JavaScript程式可以找出這些空白字元：

for (let ch = 0;ch < 65536;++ch) {
    const s = String.fromCharCode(ch);
    
    if (s.trim() === "") {
        console.log(`\\u${ch.toString(16).toUpperCase().padStart(4, "0")} [${new TextEncoder().encode(s).join(", ")}]`);
    }
}

執行結果和上一個小節用正規表示式的\s所找出來的空白字元範圍是一樣的。

消除字串中的空白要注意什麼？

如果要消除字串頭尾的空白，只需要直接使用trim()、trimStart()、trimEnd()等方法即可。不需要再自作聰明去用replace方法把換行字元、全形空格等非半形空格字元的空格字元取代為半形空格字元後再去做trim。

例如以下程式，就是一個不良示範：

// 不要用，這是爛Code！
console.log("　人之初 性本善　".replace("　", " ").trim());

如果要消除字串中所有的空白字元，直接呼叫replace方法，將正規表示式/\s/g作為第一個引數，空字串""作為第二個引數傳入即可。如下：

console.log("　人之初 性本善　".replace(/\s/g, ""));