【JavaScript】正規表現について - 讃岐小僧のEngineering×Techメモ

はじめに

この記事はJavaScriptの正規表現について学習したのでその内容をメモしたものです。

◼︎正規表現を利用するケースは主に３ケースだと考えています。
　1：文字列を部分的に置換するとき
　2.：文字列が制約を満たしているか確認するとき
　3.：文字列の一部分を抽出するとき

フォームの中に入力したデータに対してValidationをかけたい時とか、電話番号で090-××××-××××とかのハイフンを取り除きたかったり、そもそも、DBスキーマの制約に整合しているか確かめたかったり。。

いろんなところで使いたい正規表現ですが、とにかく地味で「あれ、どうだった？」となりがちなものです。

なので改めてこちらの記事に基本的な内容をまとめてみたいと思います。

正規表現	効果
`[a-z]`	角括弧で囲まれた文字のいずれか 1 個にマッチ
`\d`	数字にマッチ
`{n, m}`	直前の文字が少なくとも n 回、多くても m 回出現するものにマッチ
`i`	大文字・小文字を区別しない検索
`g`	グローバルマッチで。例えばreplaceメソッドと組み合わせて利用することで文字列の中に指定した文字が複数含まれている場合、全てを置換することができる。
`+`	直前の一回以上の文字列にマッチする
`-`	直後の一回以上の文字列にマッチす
`.`	どの１文字にもマッチする

replaceメソッドは文字列の指定の部分を別の文字に置き換えるメソッドです。

> var food = 'ポテチうまい';
=> undefined

> food.replace(/ポテチ/, 'じゃがりこ');　
=> "じゃがりこうまい"

replaceを利用して文字列を操作したい文字列は//で囲みます。第２引数に変換後の文字列を指定します。

今回はポテチをじゃがりこに変更することができました。

> var address = '東京都-港区-虎ノ門';
=>  undefined

> address.replace(/-/g, ""); ##'g'を
=> "東京都港区虎ノ門"

matchメソッドは引数の中に指定した文字列がレシーバに存在しているかどうかを確認するためのメソッドです。指定した文字列が含まれている場合は、返り値に指定した文字列が配列形式で戻されます。また含まれていない場合は返り値としてnullが返されます。

> var str = 'ポテチ';
=> undefined

> str.match(/ポテチ/);
=> ["ポテチ"]

> str.match(/じゃがりこ/)
=> null

{8,}を利用して８文字以上の制約をつけています。その他、[a-z]はa~zのアルファベットに合致するもの、

> var pass = 'Huga1234';
=>  undefined

> pass.match(/[a-z\d]{8,}/i);
=> ["Huga1234"]

補足① 最初の１文字を返します。

> var aaa.match(/./);
=> ['a'] ##最初の１文字にマッチ

補足② 最初のaだけでなくその後に続くaも返します

> var aaabbb.match(/a+/);
=> ['a'] ##直前の文字で直後に続く文字にマッチ

補足③ '.'を指定しているので、全ての文字列を返します。

> var aaabbb.match(/.+/);
=> ['aaabbb'] ##直前の文字で直後に続く文字にマッチ、この場合は'.'を利用しているので全てにマッチする

これまで基本的な正規表現の書き方についてメモしてきました。こちらは備忘的に見てもらえたらと思います。

閲覧ありがとうございました。

またこの記事の内容はQiitaにも投稿しているのでそちらもみてくださればと思います。