JavaScript 正規表現で文字列を検索し値を返す(exec)

JavaScriptのexecメソッドのサンプルです。
正規表現で文字列を検索します。

確認環境
・Windows10
・Google Chrome

目次

execメソッド

変数1 = /正規表現のパターン/;
変数 = 変数1.exec (文字列);
  • 正規表現のパターンで文字列を検索します。
  • 一致した場合、一致した値を配列で返します。
  • 一致しなかった場合、nullを返します。
  • gオプションを付けたときの挙動がStringオブジェクトのmatchメソッドと違います。(サンプルコード参照)
  • 特定のパターンが存在するか確認するだけであればexecメソッドではなくsearchまたはtestメソッドを使用します
    以下は、searchとtestメソッドのリンクです。
    https://itsakura.com/js-search
    https://itsakura.com/js-test
  • RegExpオブジェクトのメソッドです。
  • 以下はMDNのexecメソッドのリンクです。
    https://developer.mozilla.org/ja/docs/Web/JavaScript/Reference/Global_Objects/RegExp/exec

文字列を検索する

文字列を検索するサンプルです。

<script>
const str1 = "ABCあいう";
const reg1 = /BC/;

const m1 = reg1.exec(str1);
console.log(m1);//["BC", index: 1, input: "ABCあいう", groups: undefined]
console.log(m1[0]); //BC

</script>

3行目は、正規表現で文字列「BC」があるかを指定しています。
5行目は、文字列を正規表現で検索し、一致する値を配列で返します。

文字をORで検索する

文字をORで検索するサンプルです。

<script>
const str1 = "ABCあいう";
const reg1 = /[Fい]/;

const m1 = reg1.exec(str1);
console.log(m1);//["い", index: 4, input: "ABCあいう", groups: undefined]
console.log(m1[0]); //い

</script>

3行目は、正規表現で「F」or「い」があるかを指定しています。
5行目は、文字列を正規表現で検索し、一致する値を配列で返します。

文字を否定で検索する (gオプションあり)

文字を否定で検索するサンプルです。
(※注 gオプションあり)

<script>
const str1 = "ABCあいう";
const reg1 = /[^Fい]/g;

const m1 = reg1.exec(str1);
console.log(m1);//["A", index: 0, input: "ABCあいう", groups: undefined]
console.log(m1[0]); //A

const m2 = reg1.exec(str1);
console.log(m2);//["B", index: 1, input: "ABCあいう", groups: undefined]
console.log(m2[0]); //B

const m3 = reg1.exec(str1);
console.log(m3);//["C", index: 2, input: "ABCあいう", groups: undefined]
console.log(m3[0]); //C

const m4 = reg1.exec(str1);
console.log(m4);//["あ", index: 3, input: "ABCあいう", groups: undefined]
console.log(m4[0]); //あ

const m5 = reg1.exec(str1);
console.log(m5);//["う", index: 5, input: "ABCあいう", groups: undefined]
console.log(m5[0]); //う

</script>

3行目は、正規表現で「F」と「い」以外+全て(オプションのg)を指定しています。
execメソッドは、メソッドを実行するごとに1つずつ対象の値を取得します。
正規表現で検索するStringオブジェクトのmatchメソッドと違う点です。

文字を範囲で指定して検索する (gオプションあり)

文字を範囲で指定して検索するサンプルです。
(※注 gオプションあり)

<script>
const str1 = "ABCあいう";
const reg1 = /[A-C]/g;

const m1 = reg1.exec(str1);
console.log(m1);//["A", index: 0, input: "ABCあいう", groups: undefined]
console.log(m1[0]); //A

const m2 = reg1.exec(str1);
console.log(m2);//["B", index: 1, input: "ABCあいう", groups: undefined]
console.log(m2[0]); //B

const m3 = reg1.exec(str1);
console.log(m3);//["C", index: 2, input: "ABCあいう", groups: undefined]
console.log(m3[0]); //C

</script>

3行目は、正規表現で「A」から「C」+全て(g)を指定しています。
execメソッドは、メソッドを実行するごとに1つずつ対象の値を取得します。
正規表現で検索するStringオブジェクトのmatchメソッドと違う点です。

先頭の文字列を検索する

先頭の文字列を検索するサンプルです。

<script>
const str1 = "ABCあいう";
const reg1 = /^AB/;

const m1 = reg1.exec(str1);
console.log(m1);//["AB", index: 0, input: "ABCあいう", groups: undefined]
console.log(m1[0]); //AB

</script>

3行目は、正規表現で「AB」が先頭にあるかを指定しています。
5行目は、文字列を正規表現で検索し、一致する値を配列で返します。

文字列の最後尾を検索する

文字列の最後尾を検索するサンプルです。

<script>
const str1 = "ABCあいう";
const reg1 = /いう$/;

const m1 = reg1.exec(str1);
console.log(m1);//["いう", index: 4, input: "ABCあいう", groups: undefined]
console.log(m1[0]); //いう

</script>

3行目は、正規表現で「いう」が最後尾にあるかを指定しています。
5行目は、文字列を正規表現で検索し、一致する値を配列で返します。

1回以上出現している文字を検索する

1回以上出現している文字を検索するサンプルです。

<script>
const str1 = "ABCccbcccあいう";
const reg1 = /c+/;

const m1 = reg1.exec(str1);
console.log(m1);//["cc", index: 3, input: "ABCccbcccあいう", groups: undefined]
console.log(m1[0]); //cc

</script>

3行目は、正規表現で「c」が1回以上出現しているを指定しています。
5行目は、文字列を正規表現で検索し、一致する値を配列で返します。

1桁以上の半角数値のみかをチェックする

1桁以上の半角数値のみかをチェックするサンプルです。

<script>
const str1 = "123456";
const reg1 = /^[0-9]+$/;

const m1 = reg1.exec(str1);
console.log(m1);//["123456", index: 0, input: "123456", groups: undefined]
console.log(m1[0]); //123456

</script>

3行目は、正規表現で1桁以上の半角数値のみかを指定しています。
5行目は、文字列を正規表現で検索し、一致する値を配列で返します。

1桁以上の半角数値または英字の小文字(a-f)のみかをチェックする

1桁以上の半角数値または英字の小文字(a-f)のみかをチェックするサンプルです。

<script>
const str1 = "123456abc";
const reg1 = /^[0-9a-f]+$/;

const m1 = reg1.exec(str1);
console.log(m1);//["123456abc", index: 0, input: "123456abc", groups: undefined]
console.log(m1[0]); //123456abc

</script>

3行目は、正規表現で1桁以上の半角数値または英字の小文字(a-f)のみかを指定しています。
5行目は、文字列を正規表現で検索し、一致する値を配列で返します。

郵便番号の桁数と数値のチェックする

郵便番号の桁数と数値のチェックするサンプルです。

<script>
const str1 = "123-4567";
const reg1 = /^\d{3}-\d{4}$/;

const m1 = reg1.exec(str1);
console.log(m1);//["123-4567", index: 0, input: "123-4567", groups: undefined]
console.log(m1[0]); //123-4567

</script>

3行目は、正規表現で郵便番号の桁数と数値のチェックを指定しています。
5行目は、文字列を正規表現で検索し、一致する値を配列で返します。

正規表現の構文

正規表現の構文として以下2つがあります。

変数 = /正規表現のパターン/オプション
変数 = new RegExp('正規表現のパターン','オプション') 

正規表現の主なパターン

以下は、正規表現の主なパターンです。

パターン パターンの意味
ABD ABDという文字か。
[ABD] A or B or Dのどれか1文字が入っているか。
[^ABD] A と B と D以外の1文字が入っているか。
[A-D] A or B or C or Dのどれか1文字が入っているか。
A|B|D A or B or Dのどれか1文字が入っているか。
[a-zA-Z] 英字の小文字のaからzまたは大文字のAからZのどれか1文字が入っているか。
^A 先頭の文字はAか。
A$ 最後尾の文字はAか。
* *の直前の文字が0回以上の繰り返し。
+ +の直前の文字が1回以上の繰り返し。
? ?の直前の文字が0回または1回の繰り返し。
{n} n回続いている。
{n,} n回以上続いている。
 . 任意の一文字を表す。
¥s 比較する文字に、空白1文字がある。
¥S 比較する文字に、空白以外の1文字がある。
¥d 比較する文字に、数字1文字がある。 ([0-9]と同じ)
¥D 比較する文字に、数字以外の1文字がある。  ([^0-9]と同じ)
¥w 比較する文字に、小文字の英字 or 大文字の英字 or 数値 or アンダースコアの1文字がある。
[a-zA-Z0-9_]と同じ
¥W ¥wの否定。
[^¥w]と同じ

正規表現の主なオプション

以下は、正規表現の主なオプションです。

オプション 説明
g マッチしたものをすべて返す(Global search.)
i 大文字と小文字の区別をしない(Case-insensitive search.)
m 複数行をマッチする

以下は、MDNの正規表現のリンクです。
https://developer.mozilla.org/ja/docs/Web/JavaScript/Guide/Regular_Expressions

関連の記事

JavaScript 文字列を区切り文字で分割する(split)
JavaScript 文字列を置き換える(replace)
JavaScript 正規表現で文字列を検索し数値を返す(search)
JavaScript 正規表現で文字列を検索し値を返す(match)
JavaScript 正規表現で文字列を検索し真偽値を返す(test)

プログラムでつまったらteratailに登録して質問しましょう!↓↓↓

△上に戻る