正規表現と後方参照で楽をしよう

ここのところ立て続けに正規表現と後方参照で乗り切る事態に遭遇したので、メモしておきます。

ケース1: Wordの表で列挙されているURLの一覧をHTMLのtableに起こしたい

タイトルの通りですが、Wordの表からtableを作りたい、というケース。

ギルガメシュ
https://example.com/gilgamesh.html
ビルガメス
https://example.eu/bilgamesh.html
英雄
エンキドゥ
http://example.com/enkidu.html
エンキドゥ
http://example.net/enkidu.html
友人
グラガンナ
http://example.com/gugalanna.html
牡牛座
https://example.jp/taurus/
天の牡牛

こんな形式の表が与えられたとき、以下のようなtableを作りたい。

<table>
<thead>
<tr>
<th>リンク1</th>
<th>リンク2</th>
<th>名前</th>
</tr>
</thead>
<tbody>
<tr>
<td><a href="https://example.com/gilgamesh.html">ギルガメシュ</a></td>
<td><a href="https://example.eu/bilgamesh.html">ビルガメス</a></td>
<td>英雄</td>
</tr>
<tr>
<td><a href="http://example.com/enkidu.html">エンキドゥ</a></td>
<td><a href="http://example.net/enkidu.html">エンキドゥ</a></td>
<td>友人</td>
</tr>
<tr>
<td><a href="http://example.com/gugalanna.html">グラガンナ</a></td>
<td><a href="https://example.jp/taurus/">牡牛座</a></td>
<td>天の牡牛</td>
</tr>
</tbody>
</table>

なお、このWordのテーブルを全選択してテキストにコピペすると、以下のようになりました。

ギルガメシュ
https://example.com/gilgamesh.html    ビルガメス
https://example.eu/bilgamesh.html    英雄
エンキドゥ
http://example.com/enkidu.html    エンキドゥ
http://example.net/enkidu.html    友人
グラガンナ
http://example.com/gugalanna.html    牡牛座
https://example.jp/taurus/    天の牡牛
//以下略

途中に改行があって項目の区切れが分かりづらいですが、一定のルールに則っているのは分かります。

また、考慮すべきは以下の点。

  • httphttpsが混ざっている
  • リンクの終わりについて.html/が混ざっている

これらを考慮したうえで、上手く冒頭のtableが作れないか、と。

対処

まず、上述の表からクリップボードにコピーした内容をVSCodeの新規ファイルに貼り付けます。

次に、VSCodeの置換機能で

  • 検索条件: \n(.+)\nhttp(.+)(\/|\.html)\t(.+)\nhttp(.+)(\/|\.html)\t(.+)
  • 置換文字列: <tr>\n<td><a href="http$2$3">$1</a></td>\n<td><a href="http$5$6">$4</a></td>\n<td>$7</td>\n</tr>\n

とします。

すると、上述のコピペした文字列から、下記コードが生まれます。

<tr>
<td><a href="https://example.com/gilgamesh.html">ギルガメシュ</a></td>
<td><a href="https://example.eu/bilgamesh.html">ビルガメス</a></td>
<td>英雄</td>
</tr>
<tr>
<td><a href="http://example.com/enkidu.html">エンキドゥ</a></td>
<td><a href="http://example.net/enkidu.html">エンキドゥ</a></td>
<td>友人</td>
</tr>
<tr>
<td><a href="http://example.com/gugalanna.html">グラガンナ</a></td>
<td><a href="https://example.jp/taurus/">牡牛座</a></td>
<td>天の牡牛</td>
</tr>

これを貼り付けて、tableの開始/終了タグやtheadを用意すれば冒頭の作りたかったコードに辿り着けました。

ケース2: aタグにtarget="_blank"class="HOGE"を付けたい

上述のやり方で意図したコードになった……と思ったのですが、うっかりtarget="_blank"とクラスを付け忘れてしまいました。

対処

もう一度VSCodeの正規表現を使って一括置換します。

  • 検索条件: <a href="(http(s)?://(.)+(\/|\.html))">
  • 置換文字列: <a href="$1" target="_blank" class="HOGE">

すると、以下のようになりました。

<tr>
<td><a href="https://example.com/gilgamesh.html" target="_blank" class="HOGE">ギルガメシュ</a></td>
<td><a href="https://example.eu/bilgamesh.html" target="_blank" class="HOGE">ビルガメス</a></td>
<td>英雄</td>
</tr>
<tr>
<td><a href="http://example.com/enkidu.html" target="_blank" class="HOGE">エンキドゥ</a></td>
<td><a href="http://example.net/enkidu.html" target="_blank" class="HOGE">エンキドゥ</a></td>
<td>友人</td>
</tr>
<tr>
<td><a href="http://example.com/gugalanna.html" target="_blank" class="HOGE">グラガンナ</a></td>
<td><a href="https://example.jp/taurus/" target="_blank" class="HOGE">牡牛座</a></td>
<td>天の牡牛</td>
</tr>

aタグにtarget="_blank"class="HOGE"が付きました。これで今度こそゴールです。

ケース3: 関数をアロー関数に書き換える

function Ishtar() {
    //処理
}

function Inanna(args) {
    //処理
}

上述のようなJSを

const Ishtar = () => {
    //処理
}

const Inanna = (args) => {
    //処理
}

このように書き換えたい(式の終わりのセミコロンはとりあえず手動で付けるものとします)。

  • 検索条件: function (.*)\((.*)\) \{
  • 置換文字列: const $1 = ($2) => {

引数は1つしかないパターンだったので、これでOKでした。


ということで、三度正規表現(特に後方参照)に助けられたので、備忘録としてメモしておきます。

この記事を書いた人

アルム=バンド

フロントエンド・バックエンド・サーバエンジニア。LAMPやNodeからWP、Gulpを使ってejs,Scss,JSのコーディングまで一通り。たまにRasPiで遊んだり、趣味で開発したり。