Regexper - JavaScriptの正規表現を可視化
正規表現は慣れないと分かりづらいものです。また、複雑なものを作ってしまうと、作った時は良くとも、後でメンテナンスができなくなってしまいます。正規表現のデバッグも困難で、どう判定されているのか理解するのに時間を要するでしょう。 そこで使ってみたいのがRegexperです。Web上で正規表現を可視化してくれます。
Regexperの使い方
正規表現の例です。下にビジュアル化された図が表示されています。
+を*に変更しました。図も変わっています。
繰り返しを使った場合。
最初と最後を定義。
Regexperを使うと複雑な正規表現であっても可視化されます。これによって理解度が進むのかは分かりませんが、それでも説明しやすくなるのではないでしょうか。また、これによってデバッグしやすくなれば、誤った正規表現によるバグも発生しなくなるはずです。
RegexperはJavaScript製のオープンソース・ソフトウェア(MIT License)です。
Regexper javallone/regexper-static: Regular Expression Visualization Site (static site version)