[JS] 使用 Regex 來 Split
今天在用 React 做東西時，剛好有一個需求，希望能將 text 的每一個字拆成一個一個 React Component
(主要是希望在點擊各個單字時，可以每個單字有自己個別的 onClick)
所以要將 text 依「非字母」作為分隔字元切開存進陣列，所以分隔字元長這樣：
(不能使用\w因為會包含數字)
/[^A-Za-z]/
我希望保留文章原始樣貌，所以要用 () 來保留這些分隔字元：
/([^A-Za-z])/
最後因為中間會出現我用不到的 '' 所以使用 fliter 去掉，最後變成這樣：
const text = 'Test 123.\nThis is Huston speaking.';
text.split(/([^A-Za-z])/).filter(text => text)
使用的結果：
[ 'Test',
' ',
'1',
'2',
'3',
'.',
'\n',
'This',
' ',
'is',
' ',
'Huston',
' ',
'speaking',
'.' ]
試試看能不能拼回原樣：
const text = 'Test 123.\nThis is Huston speaking';
text.split(/([^A-Za-z])/).filter(text => text).join('')
沒錯就是我要的：
'Test 123.\nThis is Huston speaking.'
又是一個很容易用了就忘的東西，於是筆記起來！