• トップ
  • ブログ一覧
  • 【JavaScript】正規表現で文字列を検索する
  • 【JavaScript】正規表現で文字列を検索する

    広告メディア事業部広告メディア事業部
    2019.05.10

    IT技術

    正規表現とは?

    正規表現 ( regular expression ) とは、特殊な文字列を組み合わせることで、条件にかなった文字列を表現する方法です。

    例えば、郵便番号を正規表現で表す場合

    1//郵便番号 ***-**** の正規表現
    2\d{3}-?/d{4}

    上記の正規表現では、"三桁の数字" + "-"(ハイフン) + "4桁の数字" を表すことになり、郵便番号(012-3456 や 123-4567) と合致します

    正規表現はおもに文字列の検索、置換を行うときに使います。

    決まったパターンの文字列を一気に検索、置換できるために文字列を操作するときに便利です。

    正規表現に使われる特殊記号

    正規表現では、特定の記号に特殊な意味が与えられています。

    主な正規表現についてはこちら!

    記号意味例の説明
    \エスケープ文字\*'*'(アスタリスク) とマッチ)
    ^行の先頭^hello行頭の 'hello' とマッチ
    $行の末尾world$行末の 'world' とマッチ
    *直前の文字のゼロ回以上の繰り返しにマッチhello*'hell' や 'hello', hellooooo とマッチ
    +直前の文字の一回以上の繰り返しにマッチhello+'hello' や 'helloooo' とマッチ
    ?直前の文字の 0 回か 1 回の出現にマッチhello?'hell' と 'hello' にマッチ
    .改行文字以外の全ての一文字にマッチ.n'en' や 'an' とマッチ。
    {n}直前の文字のちょうど n 回にマッチA{3}'AAA' とマッチ
    { m,}直前の文字の m 回以上にマッチA{3,}'AAA' や 'AAAAAAAA'とマッチ。'AA' とはマッチしない
    { m, n }直前の文字の m 回以上 n 回以上にマッチA{1,3}'A', 'AA', 'AAA' とマッチ
    [abc]角括弧で囲まれた文字のいずれか一個にマッチ[xyz]x,y,z のいずれかの文字とマッチ
    [a-z]ハイフンを用いることで文字の範囲指定[a-d][abcd] と同じ。a ~ d の文字にマッチ
    [^abc]角括弧で囲まれた文字以外の文字にマッチ[^xyz]x,y,z 以外の文字とマッチ。
    \s空白文字(スペース、タブ、改行)にマッチ
    \w大文字小文字の英字、数字、アンダースコアにマッチ
    \W\w でマッチしない文字とマッチ。[^w]と同じ
    \d数字とマッチ
    \D数字以外とマッチ
    \n改行文字(LF, U+000A)とマッチ
    \r復帰文字(CR, U+000D) とマッチ
    ()グループ化

    JavaScript で正規表現を使ってみる

    もちろん、JavaScript でも正規表現は使用可能です。

    JavaScript で正規表現の文字列を表す場合、2つの方法があります。

    1:/ (スラッシュ) で囲まれたパターン

    「/ (スラッシュ) 」で囲まれたパターンの場合は、正規表現リテラルとして使用する。

    1let regexp = /正規表現/オプション
    2
    3// 例
    4let sample = /ac+c/;

    スクリプトがロードされたときに、定数の中身(リテラル)として正規表現をコンパイルします。

    正規表現のパターンが一定で変化しない場合、こちらのほうがパフォーマンスは良いです。

    2:RegExp() のコンストラクタ関数を呼び出す方法

    1let regexp = new RegExp('正規表現', 'オプション')
    2// 例
    3let sample = new RegExp('ab+c')

    関数実行時にその正規表現をコンパイルします。

    正規表現パターンが変化する場合や、ユーザーからの入力などを受けてから正規表現パターンを作成する場合は RegExp() のコンストラクタを使用してください。

    オプションについて

    正規表現を作成するときにオプションを指定できます。

    オプション説明
    gグローバルサーチ。文字列全体を検索する。指定しなければ一度検索がヒットすればそこで処理終了
    i大文字小文字を区別しない
    m複数行検索
    uunicode 対応する
    s. も改行文字とする

    JavaScript で正規表現を使用するメソッド

    JavaScript では、正規表現を以下のメソッドとともに使用します。

    1. RegExe ・・・「 test」「  exec」
    2. String ・・・「match」replace」search」split」

    RegExp

    RegExp オブジェクトから呼び出すメソッド一覧です。

    RegExpメソッド説明
    exec文字列中で一致するものを検索します。検索結果の配列を返します
    test文字列中に一致するものがあるか確かめます。 ture または false を返します

    String

    String オブジェクトから呼び出すメソッド一覧です。

    Stringメソッド説明
    match文字列中で一致するものを検索します。検索結果の配列を返します
    search文字列中で一致するものがあるか確かめます。マッチした場所の文字位置(インデックス)を返します
    replace文字列中で一致するものを検索し、マッチした文字列を別の文字列に置換します。
    split正規表現または固定文字列を区切り文字として分割し、分割した結果を文字列の配列として返す

    各メソッドの使い方

    各メソッドの使い方について簡単に見ていきましょう。

    exec

    1let string = 'abcdefgab';
    2let regexp = RegExp('[a-b]')
    3let result = regexp.exec(string);
    4console.log(result); // => [ 'a', index: 0, input: 'abcdefgab', groups: undefined ]

    exec メソッドを使うことで、正規表現に合致する文字列を検索できます。

    test

    1let string = 'abcdefgab';
    2let regexp = RegExp('[a-b]', 'g')
    3let result = regexp.test(string);
    4console.log(result); // => true

    test メソッドを使うことで、正規表現に合致する文字列が含まれているか判定することができます。

    match

    1let string = "ABCDEFGABCD"
    2let result = string.match(/[a-b]/gi);
    3console.log(result); // => [ 'A', 'B', 'A', 'B' ]

    match メソッドを使うことで、正規表現に合致する文字列を検索できます。g オプションが有効の場合、合致する文字列の配列を返します。

    search

    1let string = "cdseabcde"
    2let result = string.search(/[a-b]/);
    3console.log(result); => 4

    search メソッドを使うことで、正規表現に合致する文字列が最初にでてきた位置を取得できます。

    replace

    1let string = "123-4567";
    2let result = string.replace(/\d{3}-?d{4}/, '***-****');
    3console.log(result);

    replace メソッドを使うことで、正規表現に合致する文字列を、別の文字列に置き換えることができます。

    split

    1let regexp = RegExp('[-\/\.]'); // '-', '/', '.' にマッチ
    2
    3let string1 = '2019-04-10'
    4let result1 = string1.split(regexp);
    5console.log(result1) // => [ '2019', '04', '10' ]
    6
    7let string2 = '2019/04/10'
    8let result2 = string2.split(regexp);
    9console.log(result2) // => [ '2019', '04', '10' ]
    10
    11let string3 = '2019.04.10'
    12let result3 = string3.split(regexp);
    13console.log(result3) // => [ '2019', '04', '10' ]

    split メソッドを使うことで、正規表現に合致する文字列を区切り文字として、文字列を分割できます。分割結果が配列として返します。

    オススメのJavaScript入門書はこちら!

    確かな力が身につくJavaScript「超」入門

    さいごに

    最後に今回の記事の内容をまとめます。

    1. 正規表現とは特殊な文字列を組み合わせることで、条件にかなった文字列を表現する方法
    2. JavaScript でも利用できる
    3. 正規表現の生成方法は正規表現リテラルと RegExp コンストラクタを使う二種類の方法がある
    4. JavaScript の正規表現関連のメソッドを使うことで、文字列の検索、置換、分割ができる

    正規表現を使うことで文字列操作を楽に行えるようになります。

    正規表現は、現役のエンジニアでも、全て完璧に覚えていない人は多いです!

    そのため、こちらの記事を読みながら使いこなせれば問題ないと言えますので、是非この記事をご活用くださいね!

    こちらの記事もオススメ!

    featureImg2020.08.07JavaScript 特集知識編JavaScriptを使ってできることをわかりやすく解説!JavaScriptの歴史【紆余曲折を経たプログラミン...

    featureImg2020.07.17ライトコード的「やってみた!」シリーズ「やってみた!」を集めました!(株)ライトコードが今まで作ってきた「やってみた!」記事を集めてみました!※作成日が新し...

    ライトコードでは、エンジニアを積極採用中!

    ライトコードでは、エンジニアを積極採用しています!社長と一杯しながらお話しする機会もご用意しております。そのほかカジュアル面談等もございますので、くわしくは採用情報をご確認ください。

    採用情報へ

    広告メディア事業部

    広告メディア事業部

    おすすめ記事

    エンジニア大募集中!

    ライトコードでは、エンジニアを積極採用中です。

    特に、WEBエンジニアとモバイルエンジニアは是非ご応募お待ちしております!

    また、フリーランスエンジニア様も大募集中です。

    background