【JS】正規表現まとめ
正規表現を知っていると何かと便利です。
けれど、僕はJavaScriptにおいての正規表現のやり方をきちんと理解していなかったので、調べました。
同じように、
「正規表現がどんなものかはわかるけど、JSではどうやるかわからない。」
という方に参考にしていただければと思います。
１、定義の仕方
JavaScriptにおいて正規表現を定義する方法は2つあります。
1つ目は正規表現リテラルを使う方法です。
要は、スラッシュで囲む方法です。
もう1つは、RegExpコンストラクターを使う方法です。
以下がその具体例になります。
//正規表現リテラルによる定義(/パターン/オプション)
//ABCという文字列にマッチするか
const ABC = /ABC/;
//AかBかC何かにマッチするか
const AorBorC = /[ABC]/;
//ABC以外にマッチするか
const notAanBbandC = /[^ABC]/;
//A~Zの何かにマッチするか
const AtoZ = /[A-Z]/;
//ABCという文字列全てをサーチする
const ABC = /ABC/g;
//RegExpによる定義(new RegExp('パターン','オプション'))
//Aという文字に一致する全てをサーチ
const str = new RegExp('A','g');
//Aかaという文字にマッチするか
const str = new RegExp('A','i');
正規表現にはオプションがあり、その主な例は以下になります。
| オプション | 説明 |
|---|---|
| g | グローバルサーチ。文字列全体に対してマッチングするか |
| i | 大文字／小文字を区別しない |
| m | 複数行の入力文字列を複数行として扱う |
| u | Unicode対応 |
ちなみに、この2つの定義の仕方は上手く使い分ける必要があります。
というのも、正規表現リテラルのパターンはスクリプトのロード時にコンパイルされ、RegExpを使った定義は実行時にコンパイルされます。
なので、
- パターン内で変数を使いたいとき
- 動的にパターンを変化させたいとき
- 外からパターンを受け取りたいとき
などはRegExpを使い、それ以外はリテラルを使った定義をするのがベストです。
２、正規表現の書き方
複雑な正規表現を書くためには正規表現パターンというものを知っておく必要があります。
以下がその一覧になります。
| 文字 | 説明 |
|---|---|
| ^ | 行の先頭にマッチする |
| $ | 行の末尾にマッチする |
| * | 直前の文字の0回以上の繰り返しにマッチする |
| + | 直前の文字の1回以上の繰り返しにマッチする |
| ? | 直前の文字の0or1回の繰り返しにマッチする |
| {n} | 直前の文字のn回の繰り返しにマッチする |
| {n,} | 直前の文字のn回以上の繰り返しにマッチする |
| {n,m} | 直前の文字のn~m回の繰り返しにマッチする |
| [ABC] | ABC何か一文字に一致 |
| [^ABC] | ABC以外一文字に一致 |
| . | 改行文字以外の文字と一致 |
| \w | 英数字と_に一致 |
| \W | 文字以外に一致 |
| \d | 数字に一致 |
| \D | 数字以外に一致 |
| \n | 改行に一致 |
| \t | タブ文字に一致 |
| \r | 復帰に一致 |
| \s | 空白文字に一致 |
| \S | 空白文字以外に一致 |
ちなみに、Macだとoption押しながら¥でバックスラッシュが打てます。
３、正規表現を使う場面
正規表現を使う場面は主に6つあります。
それは以下の通り
| メソッド | 説明 |
|---|---|
| match | マッチした文字列を配列で返します |
| exec | マッチした文字列をと詳細な情報を配列で返します |
| test | 1つでもマッチしたらtrueを返し、マッチしなければfalseを返します |
| search | 最初にマッチした文字列の位置を返します |
| replace | マッチした文字を置き換えます |
| split | マッチした場所で区切って配列を返します |
４、実際に使ってみた
では、実際に使うとどうなるのかやっていきましょう。
今回は例題として、
与えられた文字列の中からABCという文字列の数を数えるプログラム(大文字小文字は区別しない）
を作っていきます。
これは、実際に僕がコーディングテストで出されたことのある例題です。
テストを受けた時はif文をネストさせて実装しましたが、今回はスマートに正規表現を使って書いていきたいと思います。
const targetStr = "abcbcabacbabcbabcbabcABCbaabcbabcbabcABCb"; //今回対象となる文字列
const abcPattern = /abc/gi;
const matchedArr = targetStr.match(abcPattern);
console.log(matchedArr.length);
こうして見るとかなりシンプルに書くことができますね、、
おわりに
JSでの正規表現のやり方について解説していきました。
正規表現を書けるのと書けないのとでは、コーディングの質が大きく異なるのでこの機会にマスターしてしまいましょう。
また、この記事をチートシートとして活用していただければと思います。
最後に宣伝です。
0からエンジニアになるためのノウハウをブログで発信しています。
また、YouTubeでの動画解説も始めました。 YouTubeのvideoIDが不正です
インスタの発信も細々とやっています。
興味がある方は、ぜひリンクをクリックして確認してみてください！
おわり
Discussion