コーディングメソドロジー

第103回 現場で使える正規表現

HTMLソースや長文の原稿などで、検索・置換を行う時により便利にできるのが、正規表現です。記号の羅列は難しいイメージがありますが、マスターすると様々な活用シーンがあり、作業の時間短縮につながります。今回は使用例を3つご紹介したいと思います。

テキストエディタを使用した正規表現

■ HTMLの構造変更での正規表現

例えば、tableタグで作成したテーブルパーツを定義リスト(<dl>~</dl>)へと構造を組み替える場合、正規表現を使って簡単に組み替えることができます。
正規表現で置換すれば、手作業で1つ1つ修正するより、大幅な作業時間の短縮ができ、修正の間違いや修正漏れを防ぐことができます。

HTMLの構造変更での正規表現
HTMLの構造変更での正規表現

【解説】

.*? = 「任意の1文字の0回以上の最短連続」にマッチします。

\r|\n = 全ての改行コード(「LF」「CR」「CR+LF」)にマッチします。

(?:.|\r|\n)*? = 「任意の一文字あるいは改行の繰り返し」にマッチします。

■ 原稿の表記揺れを修正する正規表現

原稿チェック・修正の際に送り仮名の表記揺れを発見し、一括で修正を行いたい場合に使える正規表現
を紹介します。方法はとても簡単です。
送り仮名の後ろに一文字づつ「?(半角クエスチョンマーク)」をつけてあげて、揃えたい文字を置換
する文字へ指定するだけです。例えば、以下のように対象文字を「打ち合せ」に修正します。

原稿の表記揺れを修正する正規表現
原稿の表記揺れを修正する正規表現

JavaScript での正規表現

最後に、JavaScriptを使用した正規表現で文字列置換をする方法を紹介します。文字列置換に使用する関数は「replace()」です。
単純な文字列置換も行えますが、正規表現を使用した文字列置換も行うことができます。
例として、システムから出力されるハイフン区切りの日付データ(2017-01-01)を日本語の日付表示(2017年01月01日)に置換を行う手順を説明します。

原稿の表記揺れを修正する正規表現

【解説】

システムから出力された日付データを引数「systemDate」へ代入します。

「systemDate」の文字列をreplace()関数を使用して置換した文字列を「viewDate」に代入します。
replace関数は第1引数に検索文字列を指定し、第2引数に置換文字列を指定します。
「\d+」は1文字以上の連続する数字にマッチする正規表現で、フォーマットに従って間にハイフンを指定して検索を行えるようにしています。

置換を行った文字列をアラートで出力します。

  • 大規模サイト制作のご案内 大規模サイトプロジェクトのポイントやサービス内容をご紹介
  • レスポンシブWebデザインセミナーがDVDになりました。
  • コーディングメソドロジー
  • コーディングファクトリートピックス
  • 受注活動サポートサービス
  • コーディングファクトリーニュース
  • IllustratorでのWebデザイン
  • 求人案内
  • 株式会社モノサス
  • お問い合わせ

    コーディング相談ダイヤル

    お問い合わせ

  • ご相談、お問い合わせフォーム

    ご相談、お問い合わせフォーム